refactor: remove hard dependency of DI on FASTElement

change/@microsoft-fast-element-953ae13a-b331-48b2-b410-0881b9fcfce2.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "refactor: remove dependency of DI on FASTElement",
+  "packageName": "@microsoft/fast-element",
+  "email": "roeisenb@microsoft.com",
+  "dependentChangeType": "prerelease"
+}

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

@@ -32,6 +32,7 @@ const debugMessages = {
     [1511 /* invalidKey */]: "Key/value cannot be null or undefined. Are you trying to inject/register something that doesn't exist with DI?",
     [1512 /* noDefaultResolver */]: "'${key}' not registered. Did you forget to add @singleton()?",
     [1513 /* cyclicDependency */]: "Cyclic dependency found '${name}'.",
+    [1514 /* connectUpdateRequiresController */]: "Injected properties that are updated on changes to DOM connectivity require the target object to be an instance of FASTElement.",
 };
 
 const allPlaceholders = /(\$\{\w+?})/g;

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

@@ -2,7 +2,6 @@
  * Big thanks to https://github.com/fkleuver and the https://github.com/aurelia/aurelia project
  * for the bulk of this code and many of the associated tests.
  */
-import { FASTElement } from "../components/fast-element.js";
 import { Context, ContextDecorator, ContextEvent, UnknownContext } from "../context.js";
 import { Class, Constructable, Message } from "../interfaces.js";
 import { Metadata } from "../metadata.js";
@@ -777,8 +776,13 @@ export const DI = Object.freeze({
                     value = container.get(key);
                     this[diPropertyKey] = value;
 
-                    if (respectConnection && this instanceof FASTElement) {
-                        const notifier = (this as FASTElement).$fastController;
+                    if (respectConnection) {
+                        const notifier = (this as any).$fastController;
+
+                        if (!notifier) {
+                            throw FAST.error(Message.connectUpdateRequiresController);
+                        }
+
                         const handleChange = () => {
                             const newContainer = DI.findResponsibleContainer(this);
                             const newValue = newContainer.get(key) as any;

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

@@ -216,6 +216,7 @@ export const enum Message {
     invalidKey = 1511,
     noDefaultResolver = 1512,
     cyclicDependency = 1513,
+    connectUpdateRequiresController = 1514,
 }
 
 /**