adding construction strategy to elementController

packages/web-components/fast-element/src/components/element-controller.ts

@@ -7,8 +7,8 @@ import type { ElementViewTemplate } from "../templating/template.js";
 import type { ElementView } from "../templating/view.js";
 import { ElementStyles } from "../styles/element-styles.js";
 import type { ViewController } from "../templating/html-directive.js";
-import { FASTElementDefinition } from "./fast-definitions.js";
 import { UnobservableMutationObserver } from "../utilities.js";
+import { FASTElementDefinition } from "./fast-definitions.js";
 
 const defaultEventOptions: CustomEventInit = {
     bubbles: true,
@@ -24,6 +24,16 @@ function getShadowRoot(element: Element): ShadowRoot | null {
     return element.shadowRoot ?? shadowRoots.get(element) ?? null;
 }
 
+export interface ElementControllerStrategy {
+    create(element: HTMLElement, definition: FASTElementDefinition): ElementController;
+}
+
+let elementControllerStrategy: ElementControllerStrategy = {
+    create(element, definition) {
+        return new ElementController(element, definition);
+    },
+};
+
 /**
  * Controls the lifecycle and rendering of a `FASTElement`.
  * @public
@@ -448,7 +458,7 @@ export class ElementController<TElement extends HTMLElement = HTMLElement>
             throw FAST.error(Message.missingElementDefinition);
         }
 
-        return ((element as any).$fastController = new ElementController(
+        return ((element as any).$fastController = elementControllerStrategy.create(
             element,
             definition
         ));
@@ -484,6 +494,14 @@ export class HydratableElementController<
     }
 }
 
+export function addHydrationSupport() {
+    elementControllerStrategy = {
+        create(element, definition) {
+            return new HydratableElementController(element, definition);
+        },
+    };
+}
+
 /**
  * Converts a styleTarget into the operative target. When the provided target is an Element
  * that is a FASTElement, the function will return the ShadowRoot for that element. Otherwise,