@microsoft/fast-element 1.10.5 → 2.0.0-beta.10

package/dist/esm/testing/fixture.js

@@ -0,0 +1,86 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { FASTElementDefinition } from "../components/fast-definitions.js";
+import { ViewTemplate } from "../templating/template.js";
+function findElement(view) {
+    let current = view.firstChild;
+    while (current !== null && current.nodeType !== 1) {
+        current = current.nextSibling;
+    }
+    return current;
+}
+/**
+ * Creates a random, unique name suitable for use as a Custom Element name.
+ * @public
+ */
+export function uniqueElementName(prefix = "fast-unique") {
+    return `${prefix}-${Math.random().toString(36).substring(7)}`;
+}
+/**
+ * Creates a test fixture suitable for testing custom elements, templates, and bindings.
+ * @param templateNameOrType An HTML template or single element name to create the fixture for.
+ * @param options Enables customizing fixture creation behavior.
+ * @remarks
+ * Yields control to the caller one Microtask later, in order to
+ * ensure that the DOM has settled.
+ * @public
+ */
+export function fixture(templateNameOrType, options = {}) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const document = options.document || globalThis.document;
+        const parent = options.parent || document.createElement("div");
+        const source = options.source || {};
+        if (typeof templateNameOrType === "function") {
+            const def = FASTElementDefinition.getByType(templateNameOrType);
+            if (!def) {
+                throw new Error("Missing FASTElement definition.");
+            }
+            templateNameOrType = def.name;
+        }
+        if (typeof templateNameOrType === "string") {
+            const html = `<${templateNameOrType}></${templateNameOrType}>`;
+            templateNameOrType = new ViewTemplate(html, {});
+        }
+        const view = templateNameOrType.create();
+        const element = findElement(view);
+        let isConnected = false;
+        view.bind(source);
+        view.appendTo(parent);
+        customElements.upgrade(parent);
+        // Hook into the Microtask Queue to ensure the DOM is settled
+        // before yielding control to the caller.
+        yield Promise.resolve();
+        const connect = () => __awaiter(this, void 0, void 0, function* () {
+            if (isConnected) {
+                return;
+            }
+            isConnected = true;
+            document.body.appendChild(parent);
+            yield Promise.resolve();
+        });
+        const disconnect = () => __awaiter(this, void 0, void 0, function* () {
+            if (!isConnected) {
+                return;
+            }
+            isConnected = false;
+            document.body.removeChild(parent);
+            yield Promise.resolve();
+        });
+        return {
+            document,
+            template: templateNameOrType,
+            view,
+            parent,
+            element,
+            connect,
+            disconnect,
+        };
+    });
+}

package/dist/esm/testing/timeout.js

@@ -0,0 +1,24 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+/**
+ * A timeout helper for use in tests.
+ * @param timeout The length of the timeout.
+ * @returns A promise that resolves once the configured time has elapsed.
+ * @public
+ */
+export function timeout(timeout = 0) {
+    return __awaiter(this, void 0, void 0, function* () {
+        return new Promise((resolve, reject) => {
+            window.setTimeout(() => {
+                resolve(void 0);
+            }, timeout);
+        });
+    });
+}

package/dist/esm/utilities.js

@@ -0,0 +1,44 @@
+/**
+ * Retrieves the "composed parent" element of a node, ignoring DOM tree boundaries.
+ * When the parent of a node is a shadow-root, it will return the host
+ * element of the shadow root. Otherwise it will return the parent node or null if
+ * no parent node exists.
+ * @param element - The element for which to retrieve the composed parent
+ *
+ * @public
+ */
+export function composedParent(element) {
+    const parentNode = element.parentElement;
+    if (parentNode) {
+        return parentNode;
+    }
+    else {
+        const rootNode = element.getRootNode();
+        if (rootNode.host instanceof HTMLElement) {
+            // this is shadow-root
+            return rootNode.host;
+        }
+    }
+    return null;
+}
+/**
+ * Determines if the reference element contains the test element in a "composed" DOM tree that
+ * ignores shadow DOM boundaries.
+ *
+ * Returns true of the test element is a descendent of the reference, or exist in
+ * a shadow DOM that is a logical descendent of the reference. Otherwise returns false.
+ * @param reference - The element to test for containment against.
+ * @param test - The element being tested for containment.
+ *
+ * @public
+ */
+export function composedContains(reference, test) {
+    let current = test;
+    while (current !== null) {
+        if (current === reference) {
+            return true;
+        }
+        current = composedParent(current);
+    }
+    return false;
+}