@microsoft/fast-html 1.0.0-alpha.18 → 1.0.0-alpha.19

package/README.md

@@ -22,12 +22,12 @@ npm install --save @microsoft/fast-html
 In your JS bundle you will need to include the `@microsoft/fast-html` package:
 
 ```typescript
-import { TemplateElement } from "@microsoft/fast-html";
+import { RenderableFASTElement, TemplateElement } from "@microsoft/fast-html";
 import { MyCustomElement } from "./my-custom-element";
 
-MyCustomElement.define({
+RenderableFASTElement(MyCustomElement).defineAsync({
     name: "my-custom-element",
-    shadowOptions: null,
+    templateOptions: "defer-and-hydrate",
 });
 
 TemplateElement.define({
@@ -35,9 +35,7 @@ TemplateElement.define({
 });
 ```
 
-This will include the `<f-template>` custom element and all logic for interpreting the declarative HTML syntax for a FAST web component as well as the `shadowOptions` for any element an `<f-template>` has been used to define.
-
-It is necessary to set the initial `shadowOptions` of your custom elements to `null` otherwise a shadowRoot will be attached and cause a FOUC (Flash Of Unstyled Content). For more information about how this affects hydration, check out our [document](./RENDERING.md#setting-shadow-options) on rendering DOM from a non-browser environment.
+This will include the `<f-template>` custom element and all logic for interpreting the declarative HTML syntax for a FAST web component.
 
 The template must be wrapped in `<f-template name="[custom-element-name]"><template>[template logic]</template></f-template>` with a `name` attribute for the custom elements name, and the template logic inside.
 
@@ -77,23 +75,19 @@ TemplateElement.options({
 
 #### Using the RenderableFASTElement
 
-The exported abstract class `RenderableFASTElement` is available for automatic addition and removal of `defer-hydration` and `needs-hydration`. If you use `FASTElement` you will need to add `defer-hydration` and `needs-hydration` attributes to your rendered markup and remove them via your component.
+The use of `RenderableFASTElement` as a mixin for your custom element will automatically remove the `defer-hydration` attribute signalling for hydration to begin, and if you need to add state before hydration should occur you can make use of the `prepare` method.
 
 Example:
 ```typescript
-import { RenderableFASTElement, TemplateElement } from "@microsoft/fast-html";
-
-class MyCustomElement extends RenderableFASTElement {
-    // component logic
+class MyCustomElement extends FASTElement {
+    private prepare(): Promise<void> {
+        // Get initial state
+    }
 }
 
-MyCustomElement.define({
+RenderableFASTElement(MyCustomElement).defineAsync({
     name: "my-custom-element",
-    shadowOptions: null,
-});
-
-TemplateElement.define({
-    name: "f-template",
+    templateOptions: "defer-and-hydrate",
 });
 ```
 

package/dist/dts/components/schema.d.ts

@@ -0,0 +1,126 @@
+interface JSONSchemaDefinition extends JSONSchemaCommon {
+    $fast_context: string;
+    $fast_parent_contexts: Array<string>;
+}
+interface JSONSchemaCommon {
+    type?: string;
+    properties?: any;
+}
+interface JSONSchema extends JSONSchemaCommon {
+    $schema: string;
+    $id: string;
+    $defs?: Record<string, JSONSchemaDefinition>;
+    $ref?: string;
+}
+type AccessCachedPathType = "access";
+export interface AccessCachedPath {
+    type: AccessCachedPathType;
+    currentContext: string | null;
+    path: string;
+}
+type DefaultCachedPathType = "default";
+export interface DefaultCachedPath {
+    type: DefaultCachedPathType;
+    currentContext: string | null;
+    path: string;
+}
+type EventCachedPathType = "event";
+export interface EventCachedPath {
+    type: EventCachedPathType;
+    currentContext: string | null;
+    path: string;
+}
+type RepeatCachedPathType = "repeat";
+export interface RepeatCachedPath {
+    type: RepeatCachedPathType;
+    parentContext: string | null;
+    currentContext: string;
+    path: string;
+}
+export type CachedPath = DefaultCachedPath | RepeatCachedPath | AccessCachedPath | EventCachedPath;
+export type CachedPathMap = Map<string, JSONSchema>;
+interface RegisterPathConfig {
+    rootPropertyName: string;
+    pathConfig: CachedPath;
+}
+/**
+ * A constructed JSON schema from a template
+ */
+export declare class Schema {
+    /**
+     * The name of the custom element
+     */
+    private customElementName;
+    /**
+     * A JSON schema describing each root schema
+     */
+    private jsonSchemaMap;
+    constructor(name: string);
+    /**
+     * Add a path to a schema
+     * @param config RegisterPathConfig
+     */
+    addPath(config: RegisterPathConfig): void;
+    /**
+     * Gets the JSON schema for a property name
+     * @param rootPropertyName - the root property the JSON schema is mapped to
+     * @returns The JSON schema for the root property
+     */
+    getSchema(rootPropertyName: string): JSONSchema | null;
+    /**
+     * Get a path split into property names
+     * @param path The dot syntax path e.g. a.b.c
+     * @returns An array of items in the path
+     */
+    private getSplitPath;
+    /**
+     * Gets the path to the $def
+     * @param context The context name e.g. {{item in items}} in a repeat creates the "item" context
+     * @returns A string to use as a $ref
+     */
+    private getDefsPath;
+    /**
+     * Add a new JSON schema to the JSON schema map
+     * @param propertyName The name of the property to assign this JSON schema to
+     */
+    private addNewSchema;
+    /**
+     * Add properties to a context
+     * @param schema The schema to add the properties to
+     * @param splitPath The path split into property/context names
+     * @param context The paths context
+     */
+    private addPropertiesToAContext;
+    /**
+     * Add properties to an object
+     * @param schema The schema to add the properties to
+     * @param splitPath The path split into property/context names
+     * @param context The paths context
+     * @param type The data type (see JSON schema for details)
+     */
+    private addPropertiesToAnObject;
+    /**
+     * Add an array to an object property
+     * @param schema The schema to add the properties to
+     * @param context The name of the context
+     */
+    private addArrayToAnObject;
+    /**
+     * Add a context to the $defs property
+     * @param schema The schema to use
+     * @param propertyName The name of the property the context belongs to
+     * @param currentContext The current context
+     * @param parentContext The parent context
+     * @returns
+     */
+    private addContext;
+    /**
+     * Get parent contexts
+     * @param schema The schema to use
+     * @param parentContext The parent context
+     * @param contexts A list of parent contexts
+     * @returns
+     */
+    private getParentContexts;
+}
+export {};

package/dist/dts/components/schema.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/components/schema.js

@@ -0,0 +1,196 @@
+// The context, in most cases the array property e.g. users
+const fastContextMetaData = "$fast_context";
+// The list of contexts preceeding this context, the first of which should be the root property
+const fastContextsMetaData = "$fast_parent_contexts";
+const defsPropertyName = "$defs";
+const refPropertyName = "$ref";
+/**
+ * A constructed JSON schema from a template
+ */
+export class Schema {
+    constructor(name) {
+        /**
+         * A JSON schema describing each root schema
+         */
+        this.jsonSchemaMap = new Map();
+        this.customElementName = name;
+    }
+    /**
+     * Add a path to a schema
+     * @param config RegisterPathConfig
+     */
+    addPath(config) {
+        var _a, _b;
+        const splitPath = this.getSplitPath(config.pathConfig.path);
+        let schema = this.jsonSchemaMap.get(config.rootPropertyName);
+        // Create a root level property JSON
+        if (!schema) {
+            this.addNewSchema(config.rootPropertyName);
+            schema = this.jsonSchemaMap.get(config.rootPropertyName);
+        }
+        switch (config.pathConfig.type) {
+            case "default":
+            case "access": {
+                if (config.pathConfig.currentContext === null) {
+                    this.addPropertiesToAnObject(schema, splitPath.slice(1), config.pathConfig.currentContext);
+                }
+                else {
+                    this.addPropertiesToAContext((_a = schema === null || schema === void 0 ? void 0 : schema[defsPropertyName]) === null || _a === void 0 ? void 0 : _a[splitPath[0]], splitPath.slice(1), config.pathConfig.currentContext);
+                }
+                break;
+            }
+            case "repeat": {
+                this.addContext(schema, splitPath[splitPath.length - 1], // example items
+                config.pathConfig.currentContext, // example item
+                config.pathConfig.parentContext);
+                if (splitPath.length > 2) {
+                    let updatedSchema = schema;
+                    if (config.pathConfig.parentContext) {
+                        updatedSchema = this.addPropertiesToAnObject((_b = schema[defsPropertyName]) === null || _b === void 0 ? void 0 : _b[config.pathConfig.parentContext], splitPath.slice(1, -1), config.pathConfig.parentContext);
+                    }
+                    this.addPropertiesToAnObject(updatedSchema, splitPath.slice(-1), config.pathConfig.currentContext, "array");
+                }
+                else if (splitPath.length > 1) {
+                    this.addPropertiesToAnObject(schema, splitPath.slice(1), config.pathConfig.currentContext, "array");
+                }
+                else {
+                    schema.type = "array";
+                    schema[refPropertyName] = this.getDefsPath(config.pathConfig.currentContext);
+                }
+                break;
+            }
+        }
+    }
+    /**
+     * Gets the JSON schema for a property name
+     * @param rootPropertyName - the root property the JSON schema is mapped to
+     * @returns The JSON schema for the root property
+     */
+    getSchema(rootPropertyName) {
+        var _a;
+        return (_a = this.jsonSchemaMap.get(rootPropertyName)) !== null && _a !== void 0 ? _a : null;
+    }
+    /**
+     * Get a path split into property names
+     * @param path The dot syntax path e.g. a.b.c
+     * @returns An array of items in the path
+     */
+    getSplitPath(path) {
+        return path.split(".");
+    }
+    /**
+     * Gets the path to the $def
+     * @param context The context name e.g. {{item in items}} in a repeat creates the "item" context
+     * @returns A string to use as a $ref
+     */
+    getDefsPath(context) {
+        return `#/${defsPropertyName}/${context}`;
+    }
+    /**
+     * Add a new JSON schema to the JSON schema map
+     * @param propertyName The name of the property to assign this JSON schema to
+     */
+    addNewSchema(propertyName) {
+        this.jsonSchemaMap.set(propertyName, {
+            $schema: "https://json-schema.org/draft/2019-09/schema",
+            $id: `https://fast.design/schemas/${this.customElementName}/${propertyName}.json`,
+            [defsPropertyName]: {},
+        });
+    }
+    /**
+     * Add properties to a context
+     * @param schema The schema to add the properties to
+     * @param splitPath The path split into property/context names
+     * @param context The paths context
+     */
+    addPropertiesToAContext(schema, splitPath, context) {
+        schema.type = "object";
+        if (schema.properties) {
+            schema.properties[splitPath[0]] = {};
+        }
+        else {
+            schema.properties = {
+                [splitPath[0]]: {},
+            };
+        }
+        if (splitPath.length > 1) {
+            this.addPropertiesToAnObject(schema.properties[splitPath[0]], splitPath.slice(1), context);
+        }
+    }
+    /**
+     * Add properties to an object
+     * @param schema The schema to add the properties to
+     * @param splitPath The path split into property/context names
+     * @param context The paths context
+     * @param type The data type (see JSON schema for details)
+     */
+    addPropertiesToAnObject(schema, splitPath, context, type = "object") {
+        schema.type = "object";
+        if (schema.properties) {
+            schema.properties[splitPath[0]] = {};
+        }
+        else {
+            schema.properties = {
+                [splitPath[0]]: {},
+            };
+        }
+        if (context === null && type === "object" && splitPath.length > 1) {
+            return this.addPropertiesToAnObject(schema.properties[splitPath[0]], splitPath.slice(1), context, type);
+        }
+        else if (type === "array") {
+            if (splitPath.length > 1) {
+                return this.addPropertiesToAnObject(schema.properties[splitPath[0]], splitPath.slice(1), context, type);
+            }
+            else {
+                return this.addArrayToAnObject(schema.properties[splitPath[0]], context);
+            }
+        }
+        return schema.properties[splitPath[0]];
+    }
+    /**
+     * Add an array to an object property
+     * @param schema The schema to add the properties to
+     * @param context The name of the context
+     */
+    addArrayToAnObject(schema, context) {
+        schema.type = "array";
+        schema.items = {
+            [refPropertyName]: this.getDefsPath(context),
+        };
+        return schema.items;
+    }
+    /**
+     * Add a context to the $defs property
+     * @param schema The schema to use
+     * @param propertyName The name of the property the context belongs to
+     * @param currentContext The current context
+     * @param parentContext The parent context
+     * @returns
+     */
+    addContext(schema, propertyName, // e.g items
+    currentContext, // e.g. item
+    parentContext) {
+        if (schema[defsPropertyName][currentContext]) {
+            return;
+        }
+        schema[defsPropertyName][currentContext] = {
+            [fastContextMetaData]: propertyName,
+            [fastContextsMetaData]: this.getParentContexts(schema, parentContext),
+        };
+    }
+    /**
+     * Get parent contexts
+     * @param schema The schema to use
+     * @param parentContext The parent context
+     * @param contexts A list of parent contexts
+     * @returns
+     */
+    getParentContexts(schema, parentContext, contexts = []) {
+        var _a;
+        if (parentContext === null) {
+            return [null, ...contexts];
+        }
+        const parentParentContext = (_a = schema === null || schema === void 0 ? void 0 : schema[defsPropertyName]) === null || _a === void 0 ? void 0 : _a[parentContext].$fast_parent_contexts;
+        return this.getParentContexts(schema, parentParentContext.at(-1), [parentContext, ...contexts]);
+    }
+}

package/dist/esm/components/schema.spec.js

@@ -0,0 +1,248 @@
+import { __awaiter } from "tslib";
+import { expect, test } from "@playwright/test";
+import { Schema } from "./schema.js";
+test.describe("Schema", () => __awaiter(void 0, void 0, void 0, function* () {
+    test("should instantiate with a custom element name without throwing", () => __awaiter(void 0, void 0, void 0, function* () {
+        expect(() => new Schema("my-custom-element")).not.toThrow();
+    }));
+    test("should return null when a JSON schema is requested but none exists for that property name", () => __awaiter(void 0, void 0, void 0, function* () {
+        const schema = new Schema("my-custom-element");
+        expect(schema.getSchema("foo")).toEqual(null);
+    }));
+    test("should be able to return a JSON schema after adding a path", () => __awaiter(void 0, void 0, void 0, function* () {
+        const schema = new Schema("my-custom-element");
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "default",
+                path: "a",
+                currentContext: null,
+            }
+        });
+        const schemaA = schema.getSchema("a");
+        expect(schemaA).not.toBe(null);
+        expect(schemaA.$id).toEqual("https://fast.design/schemas/my-custom-element/a.json");
+        expect(schemaA.$schema).toEqual("https://json-schema.org/draft/2019-09/schema");
+    }));
+    test("should add a property and cast the schema as type object if a nested path is given", () => __awaiter(void 0, void 0, void 0, function* () {
+        const schema = new Schema("my-custom-element");
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "default",
+                path: "a.b",
+                currentContext: null,
+            },
+        });
+        let schemaA = schema.getSchema("a");
+        expect(schemaA.properties).toBeDefined();
+        expect(schemaA.properties).toHaveProperty("b");
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "default",
+                path: "a.b.c",
+                currentContext: null,
+            },
+        });
+        schemaA = schema.getSchema("a");
+        expect(schemaA.properties).toBeDefined();
+        expect(schemaA.properties).toHaveProperty("b");
+        expect(schemaA.properties.b.properties).toBeDefined();
+        expect(schemaA.properties.b.properties).toHaveProperty("c");
+    }));
+    test("should add a new context in a schema", () => __awaiter(void 0, void 0, void 0, function* () {
+        var _a, _b, _c;
+        const schema = new Schema("my-custom-element");
+        schema.addPath({
+            rootPropertyName: "items",
+            pathConfig: {
+                type: "repeat",
+                path: "items",
+                currentContext: "item",
+                parentContext: null,
+            },
+        });
+        const schemaA = schema.getSchema("items");
+        expect(schemaA).toBeDefined();
+        expect(schemaA.$ref).toBeDefined();
+        expect(schemaA.$ref).toEqual("#/$defs/item");
+        expect(schemaA.type).toEqual("array");
+        expect((_a = schemaA.$defs) === null || _a === void 0 ? void 0 : _a["item"]).toBeDefined();
+        expect((_b = schemaA.$defs) === null || _b === void 0 ? void 0 : _b["item"].$fast_context).toEqual("items");
+        expect((_c = schemaA.$defs) === null || _c === void 0 ? void 0 : _c["item"].$fast_parent_contexts).toEqual([null]);
+    }));
+    test("should add a nested context in a schema", () => __awaiter(void 0, void 0, void 0, function* () {
+        var _d, _e, _f, _g, _h;
+        const schema = new Schema("my-custom-element");
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "default",
+                path: "a",
+                currentContext: null,
+            },
+        });
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "repeat",
+                path: "a.items",
+                currentContext: "item",
+                parentContext: null,
+            },
+        });
+        const schemaA = schema.getSchema("a");
+        expect(schemaA).toBeDefined();
+        expect((_d = schemaA === null || schemaA === void 0 ? void 0 : schemaA.properties) === null || _d === void 0 ? void 0 : _d["items"]).toBeDefined();
+        expect((_e = schemaA === null || schemaA === void 0 ? void 0 : schemaA.properties) === null || _e === void 0 ? void 0 : _e["items"].items.$ref).toEqual("#/$defs/item");
+        expect((_f = schemaA.$defs) === null || _f === void 0 ? void 0 : _f["item"]).toBeDefined();
+        expect((_g = schemaA.$defs) === null || _g === void 0 ? void 0 : _g["item"].$fast_context).toEqual("items");
+        expect((_h = schemaA.$defs) === null || _h === void 0 ? void 0 : _h["item"].$fast_parent_contexts).toEqual([null]);
+    }));
+    test("should define an object as a nested context in a schema", () => __awaiter(void 0, void 0, void 0, function* () {
+        var _j, _k, _l, _m, _o, _p, _q;
+        const schema = new Schema("my-custom-element");
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "default",
+                path: "a",
+                currentContext: null,
+            },
+        });
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "repeat",
+                path: "a.items",
+                currentContext: "item",
+                parentContext: null,
+            },
+        });
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "access",
+                path: "item.b",
+                currentContext: "item",
+            },
+        });
+        const schemaA = schema.getSchema("a");
+        expect(schemaA).toBeDefined();
+        expect((_j = schemaA.$defs) === null || _j === void 0 ? void 0 : _j["item"]).toBeDefined();
+        expect((_k = schemaA.$defs) === null || _k === void 0 ? void 0 : _k["item"].$fast_context).toEqual("items");
+        expect((_l = schemaA.$defs) === null || _l === void 0 ? void 0 : _l["item"].$fast_parent_contexts).toEqual([null]);
+        expect((_m = schemaA.$defs) === null || _m === void 0 ? void 0 : _m["item"].type).toEqual("object");
+        expect((_o = schemaA.$defs) === null || _o === void 0 ? void 0 : _o["item"].properties).toBeDefined();
+        expect((_q = (_p = schemaA.$defs) === null || _p === void 0 ? void 0 : _p["item"].properties) === null || _q === void 0 ? void 0 : _q["b"]).toBeDefined();
+    }));
+    test("should define nested contexts in a schema", () => __awaiter(void 0, void 0, void 0, function* () {
+        var _r, _s, _t, _u, _v, _w;
+        const schema = new Schema("my-custom-element");
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "default",
+                path: "a",
+                currentContext: null,
+            },
+        });
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "repeat",
+                path: "a.users",
+                currentContext: "user",
+                parentContext: null,
+            },
+        });
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "repeat",
+                path: "user.posts",
+                currentContext: "post",
+                parentContext: "user"
+            },
+        });
+        const schemaA = schema.getSchema("a");
+        expect(schemaA).toBeDefined();
+        expect((_r = schemaA.$defs) === null || _r === void 0 ? void 0 : _r["user"]).toBeDefined();
+        expect((_s = schemaA.$defs) === null || _s === void 0 ? void 0 : _s["user"].$fast_context).toEqual("users");
+        expect((_t = schemaA.$defs) === null || _t === void 0 ? void 0 : _t["user"].$fast_parent_contexts).toEqual([null]);
+        expect((_u = schemaA.$defs) === null || _u === void 0 ? void 0 : _u["post"]).toBeDefined();
+        expect((_v = schemaA.$defs) === null || _v === void 0 ? void 0 : _v["post"].$fast_context).toEqual("posts");
+        expect((_w = schemaA.$defs) === null || _w === void 0 ? void 0 : _w["post"].$fast_parent_contexts).toEqual([null, "user"]);
+    }));
+    test("should define nested contexts with objects in a schema", () => __awaiter(void 0, void 0, void 0, function* () {
+        var _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17;
+        const schema = new Schema("my-custom-element");
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "repeat",
+                path: "a.users",
+                currentContext: "user",
+                parentContext: null,
+            },
+        });
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "access",
+                path: "user.a.b",
+                currentContext: "user",
+            },
+        });
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "repeat",
+                path: "user.posts",
+                currentContext: "post",
+                parentContext: "user"
+            },
+        });
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "access",
+                path: "post.c.d",
+                currentContext: "post",
+            },
+        });
+        schema.addPath({
+            rootPropertyName: "a",
+            pathConfig: {
+                type: "repeat",
+                path: "post.meta.tags",
+                currentContext: "tag",
+                parentContext: "post"
+            },
+        });
+        const schemaA = schema.getSchema("a");
+        expect(schemaA).toBeDefined();
+        expect((_x = schemaA.$defs) === null || _x === void 0 ? void 0 : _x["user"]).toBeDefined();
+        expect((_y = schemaA.$defs) === null || _y === void 0 ? void 0 : _y["user"].$fast_context).toEqual("users");
+        expect((_z = schemaA.$defs) === null || _z === void 0 ? void 0 : _z["user"].$fast_parent_contexts).toEqual([null]);
+        expect((_0 = schemaA.$defs) === null || _0 === void 0 ? void 0 : _0["user"].type).toEqual("object");
+        expect((_1 = schemaA.$defs) === null || _1 === void 0 ? void 0 : _1["user"].properties).toBeDefined();
+        expect((_2 = schemaA.$defs) === null || _2 === void 0 ? void 0 : _2["user"].properties["a"]).toBeDefined();
+        expect((_3 = schemaA.$defs) === null || _3 === void 0 ? void 0 : _3["user"].properties["a"].properties["b"]).toBeDefined();
+        expect((_4 = schemaA.$defs) === null || _4 === void 0 ? void 0 : _4["post"]).toBeDefined();
+        expect((_5 = schemaA.$defs) === null || _5 === void 0 ? void 0 : _5["post"].$fast_context).toEqual("posts");
+        expect((_6 = schemaA.$defs) === null || _6 === void 0 ? void 0 : _6["post"].$fast_parent_contexts).toEqual([null, "user"]);
+        expect((_7 = schemaA.$defs) === null || _7 === void 0 ? void 0 : _7["post"].type).toEqual("object");
+        expect((_8 = schemaA.$defs) === null || _8 === void 0 ? void 0 : _8["post"].properties).toBeDefined();
+        expect((_9 = schemaA.$defs) === null || _9 === void 0 ? void 0 : _9["post"].properties["c"]).toBeDefined();
+        expect((_10 = schemaA.$defs) === null || _10 === void 0 ? void 0 : _10["post"].properties["c"].properties["d"]).toBeDefined();
+        expect((_11 = schemaA.$defs) === null || _11 === void 0 ? void 0 : _11["post"].properties["meta"]).toBeDefined();
+        expect((_12 = schemaA.$defs) === null || _12 === void 0 ? void 0 : _12["post"].properties["meta"].properties["tags"]).toBeDefined();
+        expect((_13 = schemaA.$defs) === null || _13 === void 0 ? void 0 : _13["post"].properties["meta"].properties["tags"].items).toBeDefined();
+        expect((_14 = schemaA.$defs) === null || _14 === void 0 ? void 0 : _14["post"].properties["meta"].properties["tags"].items.$ref).toEqual("#/$defs/tag");
+        expect((_15 = schemaA.$defs) === null || _15 === void 0 ? void 0 : _15["tag"]).toBeDefined();
+        expect((_16 = schemaA.$defs) === null || _16 === void 0 ? void 0 : _16["tag"].$fast_context).toEqual("tags");
+        expect((_17 = schemaA.$defs) === null || _17 === void 0 ? void 0 : _17["tag"].$fast_parent_contexts).toEqual([null, "user", "post"]);
+    }));
+}));

package/dist/esm/components/template.js

@@ -17,7 +17,7 @@ class TemplateElement extends FASTElement {
                 observerMap: value.observerMap,
             };
         }
-        this.elementOptions = result;
+        TemplateElement.elementOptions = result;
         HydratableElementController.install();
         return this;
     }