@microsoft/fast-html 1.0.0-alpha.30 → 1.0.0-alpha.32

package/dist/esm/fixtures/observer-map/observer-map.spec.js

@@ -1,251 +0,0 @@
-import { __awaiter } from "tslib";
-import { test, expect } from "@playwright/test";
-test.describe("ObserverMap", () => __awaiter(void 0, void 0, void 0, function* () {
-    test.beforeEach(({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/observer-map");
-        yield page.waitForSelector("observer-map-test-element");
-    }));
-    test("should render initial users with deeply nested properties", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Check that initial users are rendered
-        yield expect(page.locator(".user-card")).toHaveCount(2);
-        // Check deeply nested properties are displayed
-        yield expect(page.locator("text=Alice Johnson")).toHaveCount(3);
-        yield expect(page.locator("text=Bob Smith")).toHaveCount(2);
-        // Check nested location data
-        yield expect(page.locator("text=New York, USA")).toBeVisible();
-        yield expect(page.locator("text=London, UK")).toBeVisible();
-        // Check deeply nested preferences
-        yield expect(page.locator("text=Theme: dark")).toBeVisible();
-        yield expect(page.locator("text=Theme: light")).toBeVisible();
-    }));
-    test("should update deeply nested age property", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Initial age should be 28 for Alice
-        yield expect(page.locator("text=Age: 28 years old")).toBeVisible();
-        // Click the age increment button for Alice (user ID 1)
-        yield page.locator("button:has-text('Age +1')").first().click();
-        // Age should now be 29
-        yield expect(page.locator("text=Age: 29 years old")).toBeVisible();
-        yield expect(page.locator("text=Age: 28 years old")).not.toBeVisible();
-    }));
-    test("should toggle theme in deeply nested preferences", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Initial theme should be dark for Alice
-        yield expect(page.locator("text=Theme: dark").first()).toBeVisible();
-        // Click the toggle theme button for Alice
-        yield page.locator("button:has-text('Toggle Theme')").first().click();
-        // Theme should now be light
-        yield expect(page.locator("text=Theme: light").first()).toBeVisible();
-    }));
-    test("should update location", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Initial location should be New York, USA
-        yield expect(page.locator("text=New York, USA")).toBeVisible();
-        // Click the change location button for Alice
-        yield page.locator("button:has-text('Change Location')").first().click();
-        // Location should now be Tokyo, Japan
-        yield expect(page.locator("text=Tokyo, Japan")).toBeVisible();
-        yield expect(page.locator("text=New York, USA")).not.toBeVisible();
-    }));
-    test("should update notification settings", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Check initial notification settings for Alice
-        yield expect(page.locator("text=Email Notifications: true").first()).toBeVisible();
-        yield expect(page.locator("text=Push Notifications: false").first()).toBeVisible();
-        yield expect(page.locator("text=Notification Frequency: daily").first()).toBeVisible();
-        // Click update notifications button
-        yield page.locator("button:has-text('Update Notifications')").first().click();
-        // Settings should be toggled
-        yield expect(page.locator("text=Email Notifications: false").first()).toBeVisible();
-        yield expect(page.locator("text=Push Notifications: true").first()).toBeVisible();
-        yield expect(page.locator("text=Notification Frequency: weekly").first()).toBeVisible();
-    }));
-    test("should add and remove categories in deeply nested arrays", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Check initial categories for Alice (should include "tech")
-        yield expect(page.locator(".tag:has-text('tech')")).toHaveCount(2);
-        // Add sports category
-        yield page.locator("button:has-text('Add Category')").first().click();
-        yield expect(page.locator(".tag:has-text('sports')").first()).toBeVisible();
-        // Remove tech category
-        yield page.locator("button:has-text('Remove Tech Category')").first().click();
-        yield expect(page.locator(".tag:has-text('tech')")).toHaveCount(1);
-    }));
-    test("should increment post likes and update nested metadata", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        const aliceCard = page.locator(".user-card").first();
-        const firstPost = aliceCard.locator(".post-card").first();
-        // Check initial likes (should be 25)
-        yield expect(firstPost.locator("text=25 likes")).toBeVisible();
-        // Click like button
-        yield firstPost.locator("button:has-text('Like Post')").click();
-        // Likes should increment to 26
-        yield expect(firstPost.locator("text=26 likes")).toBeVisible();
-        // Views should also increment (random amount)
-        yield expect(firstPost.locator("text=views")).toBeVisible();
-    }));
-    test("should add new posts to users", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        const aliceCard = page.locator(".user-card").first();
-        // Initial post count should be 2
-        yield expect(aliceCard.locator(".post-card")).toHaveCount(2);
-        // Add new post
-        yield aliceCard.locator("button:has-text('Add New Post')").click();
-        // Should now have 3 posts
-        yield expect(aliceCard.locator(".post-card")).toHaveCount(3);
-    }));
-    test("should update the likes on a new post", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        const aliceCard = page.locator(".user-card").first();
-        // Add new post first
-        yield aliceCard.locator("button:has-text('Add New Post')").click();
-        // Should now have 3 posts
-        yield expect(aliceCard.locator(".post-card")).toHaveCount(3);
-        // Get the newly added post (should be the last one)
-        const newPost = aliceCard.locator(".post-card").nth(2);
-        // Check initial likes on the new post (should be 0)
-        yield expect(newPost.locator("text=0 likes")).toBeVisible();
-        // Click like button on the new post
-        yield newPost.locator("button:has-text('Like Post')").click();
-        // Likes should increment to 1
-        yield expect(newPost.locator("text=1 likes")).toBeVisible();
-        yield expect(newPost.locator("text=0 likes")).not.toBeVisible();
-    }));
-    test("should add and remove users from the array", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Initial user count should be 2
-        yield expect(page.locator(".user-card")).toHaveCount(2);
-        yield expect(page.locator("text=Total Users: 2")).toBeVisible();
-        // Add new user
-        yield page.locator("button:has-text('Add New User')").click();
-        // Should now have 3 users
-        yield expect(page.locator(".user-card")).toHaveCount(3);
-        yield expect(page.locator("text=Total Users: 3")).toBeVisible();
-        yield expect(page.locator("text=User 3")).toBeVisible();
-        // Remove a user (Alice - first remove button)
-        yield page.locator("button:has-text('Remove User')").first().click();
-        // Should be back to 2 users
-        yield expect(page.locator(".user-card")).toHaveCount(2);
-        yield expect(page.locator("text=Total Users: 2")).toBeVisible();
-    }));
-    test("should be able to update nested properties on added users", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Initial user count should be 2
-        yield expect(page.locator(".user-card")).toHaveCount(2);
-        // Add new user
-        yield page.locator("button:has-text('Add New User')").click();
-        // Should now have 3 users
-        yield expect(page.locator(".user-card")).toHaveCount(3);
-        const userCard3 = yield page.locator(".user-card").nth(2);
-        // Initial theme should be dark for User 3
-        yield expect(userCard3.locator("text=Theme: dark")).toBeVisible();
-        // Click the toggle theme button for User 3
-        yield userCard3.locator("button:has-text('Toggle Theme')").click();
-        // Theme should now be light
-        yield expect(userCard3.locator("text=Theme: light")).toBeVisible();
-    }));
-    test("should be able to update nested properties on added users after the items array has been emptied", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Initial item count should be 1
-        yield expect(page.locator(".item")).toHaveCount(1);
-        // Remove item
-        yield page.locator("button:has-text('Remove all items')").click();
-        // Should now have 0 items
-        yield expect(page.locator(".item")).toHaveCount(0);
-        // Click the add item button
-        yield page.locator("button:has-text('Add an item')").click();
-        // There should now be 1 item
-        yield expect(page.locator(".item")).toHaveCount(1);
-        // Click the update item button
-        yield page.locator("button:has-text('Update an item')").click();
-        // The item should have updated text
-        yield expect(page.locator(".item")).toHaveText('item C');
-    }));
-    test("should be able to update nested properties on added users after the group array has been emptied", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Initial item count should be 1
-        yield expect(page.locator(".item")).toHaveCount(1);
-        // Remove groups
-        yield page.locator("button:has-text('Remove groups')").click();
-        // Should now have 0 items
-        yield expect(page.locator(".item")).toHaveCount(0);
-        // Click the add group button
-        yield page.locator("button:has-text('Add group')").click();
-        // There should now be 1 item
-        yield expect(page.locator(".item")).toHaveCount(1);
-        // Click the update item button
-        yield page.locator("button:has-text('Update an item')").click();
-        // The item should have updated text
-        yield expect(page.locator(".item")).toHaveText('item C');
-        // Click the update action label
-        yield page.locator("button:has-text('Update an action label')").click();
-        // The action label should have updated text
-        yield expect(page.locator(".action-label")).toHaveText('action label B');
-    }));
-    test("should update global stats with nested metrics", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Check initial engagement stats
-        const initialDaily = yield page.locator(".stats .nested-info").nth(1).textContent();
-        // Update stats
-        yield page.locator(".stats .controls button").nth(0).click();
-        yield page.evaluate(() => {
-            return new Promise((resolve) => {
-                requestAnimationFrame(() => resolve(true));
-            });
-        });
-        // Stats should be updated (values should change)
-        const updatedDaily = yield page.locator(".stats .nested-info").nth(1).textContent();
-        expect(updatedDaily).not.toBe(initialDaily);
-    }));
-    test("should handle user selection with conditional rendering", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Initially, Alice (ID 1) should be selected
-        yield expect(page.locator("text=⭐ SELECTED").first()).toBeVisible();
-        // Select Bob (user ID 2)
-        yield page.locator(".user-card").nth(1).locator("button:has-text('Select User')").click();
-        // Bob should now show as selected
-        const bobCard = page.locator(".user-card").nth(1);
-        yield expect(bobCard.locator("text=⭐ SELECTED")).toBeVisible();
-        // Alice should no longer show as selected
-        const aliceCard = page.locator(".user-card").first();
-        yield expect(aliceCard.locator("text=⭐ SELECTED")).not.toBeVisible();
-    }));
-    test("should update a defined object when a nested property has been defined", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        const undefinedText = yield page.locator(".nested-define").textContent();
-        yield expect(undefinedText).toEqual("");
-        // Define the object
-        yield page.locator("button:has-text('Define B')").nth(0).click();
-        yield page.evaluate(() => {
-            return new Promise((resolve) => {
-                requestAnimationFrame(() => resolve(true));
-            });
-        });
-        const definedText = yield page.locator(".nested-define").textContent();
-        yield expect(definedText).toEqual("Hello world");
-    }));
-    test("should update a defined object when a nested property has been updated", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Define the object
-        yield page.locator("button:has-text('Define B')").nth(0).click();
-        // Update the object
-        yield page.locator("button:has-text('Update C')").nth(0).click();
-        yield page.evaluate(() => {
-            return new Promise((resolve) => {
-                requestAnimationFrame(() => resolve(true));
-            });
-        });
-        const updatedText = yield page.locator(".nested-define").textContent();
-        yield expect(updatedText).toEqual("Hello pluto");
-    }));
-    test("should update an undefined object when a nested property has been defined", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        const undefinedText = yield page.locator(".nested-define-2");
-        yield expect(undefinedText).toHaveCount(0);
-        // Define the object
-        yield page.locator("button:has-text('Define Y')").nth(0).click();
-        yield page.evaluate(() => {
-            return new Promise((resolve) => {
-                requestAnimationFrame(() => resolve(true));
-            });
-        });
-        const definedText = yield page.locator(".nested-define-2").textContent();
-        yield expect(definedText).toEqual("Z1");
-    }));
-    test("should update an undefined object when a nested property has been updated", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        // Define the object
-        yield page.locator("button:has-text('Define Y')").nth(0).click();
-        // Update the object
-        yield page.locator("button:has-text('Update Z')").nth(0).click();
-        yield page.evaluate(() => {
-            return new Promise((resolve) => {
-                requestAnimationFrame(() => resolve(true));
-            });
-        });
-        const updatedText = yield page.locator(".nested-define-2").textContent();
-        yield expect(updatedText).toEqual("Z2");
-    }));
-}));

package/dist/esm/fixtures/ref/main.js

@@ -1,15 +0,0 @@
-import { FASTElement } from "@microsoft/fast-element";
-import { RenderableFASTElement, TemplateElement } from "@microsoft/fast-html";
-class TestElement extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.video = null;
-    }
-}
-RenderableFASTElement(TestElement).defineAsync({
-    name: "test-element",
-    templateOptions: "defer-and-hydrate",
-});
-TemplateElement.define({
-    name: "f-template",
-});

package/dist/esm/fixtures/ref/ref.spec.js

@@ -1,9 +0,0 @@
-import { __awaiter } from "tslib";
-import { expect, test } from "@playwright/test";
-test.describe("f-template", () => __awaiter(void 0, void 0, void 0, function* () {
-    test("create a ref directive", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/ref");
-        const element = page.locator("test-element");
-        yield expect(element).toHaveJSProperty("video.nodeName", "VIDEO");
-    }));
-}));

package/dist/esm/fixtures/repeat/main.js

@@ -1,44 +0,0 @@
-import { __decorate, __metadata } from "tslib";
-import { RenderableFASTElement, TemplateElement } from "@microsoft/fast-html";
-import { FASTElement, observable } from "@microsoft/fast-element";
-class TestElement extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.list = ["Foo", "Bar"];
-        this.item_parent = "Bat";
-    }
-}
-__decorate([
-    observable,
-    __metadata("design:type", Array)
-], TestElement.prototype, "list", void 0);
-RenderableFASTElement(TestElement).defineAsync({
-    name: "test-element",
-    templateOptions: "defer-and-hydrate",
-});
-class TestElementInnerWhen extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.list = [
-            {
-                show: true,
-                text: "Foo",
-            },
-            {
-                show: false,
-                text: "Bar",
-            },
-        ];
-    }
-}
-__decorate([
-    observable,
-    __metadata("design:type", Array)
-], TestElementInnerWhen.prototype, "list", void 0);
-RenderableFASTElement(TestElementInnerWhen).defineAsync({
-    name: "test-element-inner-when",
-    templateOptions: "defer-and-hydrate",
-});
-TemplateElement.define({
-    name: "f-template",
-});

package/dist/esm/fixtures/repeat/repeat.spec.js

@@ -1,36 +0,0 @@
-import { __awaiter } from "tslib";
-import { expect, test } from "@playwright/test";
-test.describe("f-template", () => __awaiter(void 0, void 0, void 0, function* () {
-    test("create a repeat directive", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/repeat");
-        const customElement = yield page.locator("test-element");
-        let customElementListItems = yield customElement.locator("li");
-        expect(yield customElementListItems.count()).toEqual(2);
-        expect(yield customElementListItems.nth(0).textContent()).toEqual("Foo - Bat");
-        expect(yield customElementListItems.nth(1).textContent()).toEqual("Bar - Bat");
-        yield page.evaluate(() => {
-            const customElement = document.getElementsByTagName("test-element");
-            customElement.item(0).list = [
-                "A",
-                "B",
-                "C"
-            ];
-        });
-        const timeout = new Promise(function (resolve) {
-            setTimeout(resolve, 100);
-        });
-        yield timeout;
-        customElementListItems = yield customElement.locator("li");
-        expect(yield customElementListItems.count()).toEqual(3);
-        expect(yield customElementListItems.nth(0).textContent()).toEqual("A - Bat");
-        expect(yield customElementListItems.nth(1).textContent()).toEqual("B - Bat");
-        expect(yield customElementListItems.nth(2).textContent()).toEqual("C - Bat");
-    }));
-    test("create a repeat directive with an inner when", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/repeat");
-        const customElement = yield page.locator("test-element-inner-when");
-        let customElementListItems = yield customElement.locator("li");
-        expect(yield customElementListItems.count()).toEqual(1);
-        expect(yield customElementListItems.nth(0).textContent()).toEqual("Foo");
-    }));
-}));

package/dist/esm/fixtures/slotted/main.js

@@ -1,33 +0,0 @@
-import { __decorate, __metadata } from "tslib";
-import { RenderableFASTElement, TemplateElement } from "@microsoft/fast-html";
-import { FASTElement, observable } from "@microsoft/fast-element";
-class TestElement extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.slottedNodes = [];
-        this.slottedFooNodes = [];
-        this.slottedBarNodes = [];
-    }
-    slottedFooNodesChanged() {
-        this.classList.add(`class-${this.slottedFooNodes.length}`);
-    }
-}
-__decorate([
-    observable,
-    __metadata("design:type", Array)
-], TestElement.prototype, "slottedNodes", void 0);
-__decorate([
-    observable,
-    __metadata("design:type", Array)
-], TestElement.prototype, "slottedFooNodes", void 0);
-__decorate([
-    observable,
-    __metadata("design:type", Array)
-], TestElement.prototype, "slottedBarNodes", void 0);
-RenderableFASTElement(TestElement).defineAsync({
-    name: "test-element",
-    templateOptions: "defer-and-hydrate",
-});
-TemplateElement.define({
-    name: "f-template",
-});

package/dist/esm/fixtures/slotted/slotted.spec.js

@@ -1,24 +0,0 @@
-import { __awaiter } from "tslib";
-import { expect, test } from "@playwright/test";
-test.describe("f-template", () => {
-    let element;
-    test.beforeEach(({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/slotted");
-        element = page.locator("test-element");
-    }));
-    test("create a slotted directive", () => __awaiter(void 0, void 0, void 0, function* () {
-        yield expect(element).toHaveJSProperty("classList.length", 2);
-        yield element.evaluate((node) => {
-            const newElement = document.createElement("button");
-            newElement.slot = "foo";
-            node.append(newElement);
-        });
-        yield expect(element).toHaveJSProperty("classList.length", 3);
-    }));
-    test("slotted nodes are filtered by elements()", () => __awaiter(void 0, void 0, void 0, function* () {
-        yield expect(element).toHaveJSProperty("slottedNodes.length", 1);
-    }));
-    test("slotted nodes are filtered by elements() with query", () => __awaiter(void 0, void 0, void 0, function* () {
-        yield expect(element).toHaveJSProperty("slottedBarNodes.length", 1);
-    }));
-});

package/dist/esm/fixtures/when/main.js

@@ -1,156 +0,0 @@
-import { __decorate, __metadata } from "tslib";
-import { RenderableFASTElement, TemplateElement } from "@microsoft/fast-html";
-import { attr, FASTElement } from "@microsoft/fast-element";
-class TestElement extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.show = false;
-    }
-}
-__decorate([
-    attr({ mode: "boolean" }),
-    __metadata("design:type", Boolean)
-], TestElement.prototype, "show", void 0);
-RenderableFASTElement(TestElement).defineAsync({
-    name: "test-element",
-    templateOptions: "defer-and-hydrate",
-});
-class TestElementNot extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.hide = false;
-    }
-}
-__decorate([
-    attr({ mode: "boolean" }),
-    __metadata("design:type", Boolean)
-], TestElementNot.prototype, "hide", void 0);
-RenderableFASTElement(TestElementNot).defineAsync({
-    name: "test-element-not",
-    templateOptions: "defer-and-hydrate",
-});
-class TestElementEquals extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.varA = 0;
-    }
-}
-__decorate([
-    attr({ attribute: "var-a" }),
-    __metadata("design:type", Number)
-], TestElementEquals.prototype, "varA", void 0);
-RenderableFASTElement(TestElementEquals).defineAsync({
-    name: "test-element-equals",
-    templateOptions: "defer-and-hydrate",
-});
-class TestElementNotEquals extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.varA = 0;
-    }
-}
-__decorate([
-    attr({ attribute: "var-a" }),
-    __metadata("design:type", Number)
-], TestElementNotEquals.prototype, "varA", void 0);
-RenderableFASTElement(TestElementNotEquals).defineAsync({
-    name: "test-element-not-equals",
-    templateOptions: "defer-and-hydrate",
-});
-class TestElementGe extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.varA = 0;
-    }
-}
-__decorate([
-    attr({ attribute: "var-a" }),
-    __metadata("design:type", Number)
-], TestElementGe.prototype, "varA", void 0);
-RenderableFASTElement(TestElementGe).defineAsync({
-    name: "test-element-ge",
-    templateOptions: "defer-and-hydrate",
-});
-class TestElementGt extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.varA = 0;
-    }
-}
-__decorate([
-    attr({ attribute: "var-a" }),
-    __metadata("design:type", Number)
-], TestElementGt.prototype, "varA", void 0);
-RenderableFASTElement(TestElementGt).defineAsync({
-    name: "test-element-gt",
-    templateOptions: "defer-and-hydrate",
-});
-class TestElementLe extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.varA = 0;
-    }
-}
-__decorate([
-    attr({ attribute: "var-a" }),
-    __metadata("design:type", Number)
-], TestElementLe.prototype, "varA", void 0);
-RenderableFASTElement(TestElementLe).defineAsync({
-    name: "test-element-le",
-    templateOptions: "defer-and-hydrate",
-});
-class TestElementLt extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.varA = 0;
-    }
-}
-__decorate([
-    attr({ attribute: "var-a" }),
-    __metadata("design:type", Number)
-], TestElementLt.prototype, "varA", void 0);
-RenderableFASTElement(TestElementLt).defineAsync({
-    name: "test-element-lt",
-    templateOptions: "defer-and-hydrate",
-});
-class TestElementOr extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.thisVar = false;
-        this.thatVar = false;
-    }
-}
-__decorate([
-    attr({ attribute: "this-var", mode: "boolean" }),
-    __metadata("design:type", Boolean)
-], TestElementOr.prototype, "thisVar", void 0);
-__decorate([
-    attr({ attribute: "that-var", mode: "boolean" }),
-    __metadata("design:type", Boolean)
-], TestElementOr.prototype, "thatVar", void 0);
-RenderableFASTElement(TestElementOr).defineAsync({
-    name: "test-element-or",
-    templateOptions: "defer-and-hydrate",
-});
-class TestElementAnd extends FASTElement {
-    constructor() {
-        super(...arguments);
-        this.thisVar = false;
-        this.thatVar = false;
-    }
-}
-__decorate([
-    attr({ attribute: "this-var", mode: "boolean" }),
-    __metadata("design:type", Boolean)
-], TestElementAnd.prototype, "thisVar", void 0);
-__decorate([
-    attr({ attribute: "that-var", mode: "boolean" }),
-    __metadata("design:type", Boolean)
-], TestElementAnd.prototype, "thatVar", void 0);
-RenderableFASTElement(TestElementAnd).defineAsync({
-    name: "test-element-and",
-    templateOptions: "defer-and-hydrate",
-});
-TemplateElement.define({
-    name: "f-template",
-});

package/dist/esm/fixtures/when/when.spec.js

@@ -1,82 +0,0 @@
-import { __awaiter } from "tslib";
-import { expect, test } from "@playwright/test";
-test.describe("f-template", () => __awaiter(void 0, void 0, void 0, function* () {
-    test("create a when directive for a boolean: true", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/when");
-        const customElementShow = yield page.locator("#show");
-        const customElementHide = yield page.locator("#hide");
-        yield expect(customElementShow).toHaveText("Hello world");
-        yield expect(customElementHide).not.toHaveText("Hello world");
-        yield page.evaluate(() => {
-            const customElementShow = document.getElementById("show");
-            const customElementHide = document.getElementById("hide");
-            customElementShow === null || customElementShow === void 0 ? void 0 : customElementShow.removeAttribute("show");
-            customElementHide === null || customElementHide === void 0 ? void 0 : customElementHide.setAttribute("show", "");
-        });
-        yield expect(customElementShow).not.toHaveText("Hello world");
-        yield expect(customElementHide).toHaveText("Hello world");
-    }));
-    test("create a when directive for a boolean: false", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/when");
-        const customElementShow = yield page.locator("#show-not");
-        const customElementHide = yield page.locator("#hide-not");
-        yield expect(customElementShow).toHaveText("Hello world");
-        yield expect(customElementHide).not.toHaveText("Hello world");
-    }));
-    test("create a when directive value uses equals", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/when");
-        const customElementShow = yield page.locator("#equals-true");
-        const customElementHide = yield page.locator("#equals-false");
-        yield expect(customElementShow).toHaveText("Equals 3");
-        yield expect(customElementHide).not.toHaveText("Equals 3");
-    }));
-    test("create a when directive value uses not equals", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/when");
-        const customElementShow = yield page.locator("#not-equals-true");
-        const customElementHide = yield page.locator("#not-equals-false");
-        yield expect(customElementShow).toHaveText("Not equals 3");
-        yield expect(customElementHide).not.toHaveText("Not equals 3");
-    }));
-    test("create a when directive value uses greater than or equals", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/when");
-        const customElementShow = yield page.locator("#ge-true");
-        const customElementHide = yield page.locator("#ge-false");
-        yield expect(customElementShow).toHaveText("Two and Over");
-        yield expect(customElementHide).not.toHaveText("Two and Over");
-    }));
-    test("create a when directive value uses greater than", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/when");
-        const customElementShow = yield page.locator("#gt-true");
-        const customElementHide = yield page.locator("#gt-false");
-        yield expect(customElementShow).toHaveText("Over two");
-        yield expect(customElementHide).not.toHaveText("Over two");
-    }));
-    test("create a when directive value uses less than or equals", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/when");
-        const customElementShow = yield page.locator("#le-true");
-        const customElementHide = yield page.locator("#le-false");
-        yield expect(customElementShow).toHaveText("Two and Under");
-        yield expect(customElementHide).not.toHaveText("Two and Under");
-    }));
-    test("create a when directive value uses less than", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/when");
-        const customElementShow = yield page.locator("#lt-true");
-        const customElementHide = yield page.locator("#lt-false");
-        yield expect(customElementShow).toHaveText("Under two");
-        yield expect(customElementHide).not.toHaveText("Under two");
-    }));
-    test("create a when directive value uses or", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/when");
-        const customElementShow = yield page.locator("#or-true");
-        const customElementHide = yield page.locator("#or-false");
-        yield expect(customElementShow).toHaveText("This or That");
-        yield expect(customElementHide).not.toHaveText("This or That");
-    }));
-    test("create a when directive value uses and", ({ page }) => __awaiter(void 0, void 0, void 0, function* () {
-        yield page.goto("/when");
-        const customElementShow = yield page.locator("#and-true");
-        const customElementHide = yield page.locator("#and-false");
-        yield expect(customElementShow).toHaveText("This and That");
-        yield expect(customElementHide).not.toHaveText("This and That");
-    }));
-}));