@joist/di 4.0.0-next.1 → 4.0.0-next.11

package/src/lib/injectable.test.ts

@@ -1,128 +1,31 @@
-import { expect, fixture, html } from '@open-wc/testing';
+import { assert } from 'chai';
 
 import { injectable } from './injectable.js';
 import { inject } from './inject.js';
+import { injectables } from './injector.js';
 
-describe('@injectable()', () => {
-  it('should allow a custom element to be injected with deps', () => {
-    class Foo {}
-    class Bar {}
+it('should locally override a provider', () => {
+  class Foo {}
 
-    @injectable
-    class MyElement extends HTMLElement {
-      foo = inject(Foo);
-      bar = inject(Bar);
-    }
+  class Bar extends Foo {}
 
-    customElements.define('injectable-1', MyElement);
+  @injectable({
+    providers: [{ provide: Foo, use: Bar }]
+  })
+  class MyService {
+    foo = inject(Foo);
+  }
 
-    const el = document.createElement('injectable-1') as MyElement;
+  const el = new MyService();
 
-    expect(el.foo()).to.be.instanceOf(Foo);
-  });
-
-  it('should locally override a provider', () => {
-    class Foo {}
-
-    class Bar extends Foo {}
-
-    const MyElement = injectable(
-      class {
-        static providers = [{ provide: Foo, use: Bar }];
-
-        foo = inject(Foo);
-      }
-    );
-
-    const el = new MyElement();
-
-    expect(el.foo()).to.be.instanceOf(Bar);
-  });
-
-  it('should handle parent HTML Injectors', async () => {
-    @injectable
-    class A {}
-
-    const B = injectable(
-      class {
-        a = inject(A);
-      }
-    );
-
-    class AltA implements A {}
-
-    @injectable
-    class Parent extends HTMLElement {
-      static providers = [
-        { provide: B, use: B },
-        { provide: A, use: AltA }
-      ];
-    }
-
-    @injectable
-    class Child extends HTMLElement {
-      b = inject(B);
-    }
-
-    customElements.define('injectable-parent-1', Parent);
-    customElements.define('injectable-child-1', Child);
-
-    const el = await fixture(html`
-      <injectable-parent-1>
-        <injectable-child-1></injectable-child-1>
-      </injectable-parent-1>
-    `);
-
-    const child = el.querySelector<Child>('injectable-child-1')!;
-
-    expect(child.b().a()).to.be.instanceOf(AltA);
-  });
-
-  it('should handle changing contexts', async () => {
-    class A {}
-    class AltA implements A {}
-
-    @injectable
-    class Ctx1 extends HTMLElement {
-      static providers = [{ provide: A, use: A }];
-    }
-
-    @injectable
-    class Ctx2 extends HTMLElement {
-      static providers = [{ provide: A, use: AltA }];
-    }
-
-    @injectable
-    class Child extends HTMLElement {
-      a = inject(A);
-    }
-
-    customElements.define('ctx-1', Ctx1);
-    customElements.define('ctx-2', Ctx2);
-    customElements.define('ctx-child', Child);
-
-    const el = await fixture(html`
-      <div>
-        <ctx-1>
-          <ctx-child></ctx-child>
-        </ctx-1>
-
-        <ctx-2></ctx-2>
-      </div>
-    `);
-
-    const ctx2 = el.querySelector('ctx-2')!;
-
-    let child = el.querySelector<Child>('ctx-child')!;
-
-    expect(child.a()).to.be.instanceOf(A);
-
-    child.remove();
+  assert.instanceOf(el.foo(), Bar);
+});
 
-    ctx2.append(child);
+it('should define an injector for a service instance', () => {
+  @injectable()
+  class MyService {}
 
-    child = el.querySelector<Child>('ctx-child')!;
+  const instance = new MyService();
 
-    expect(child.a()).to.be.instanceOf(AltA);
-  });
+  assert.ok(injectables.has(instance));
 });

package/src/lib/injectable.ts

@@ -1,69 +1,33 @@
-import { ConstructableToken } from './provider.js';
-import { Injector } from './injector.js';
-import { InjectableMap } from './injectable-map.js';
+(Symbol as any).metadata ??= Symbol('Symbol.metadata');
 
-export const INJECTABLE_MAP = new InjectableMap();
+import { ConstructableToken, Provider } from './provider.js';
+import { injectables, Injector } from './injector.js';
+import { injectableEl } from './injectable-el.js';
 
-export function injectable<T extends ConstructableToken<any>>(Base: T, _?: unknown) {
-  return class InjectableNode extends Base {
-    constructor(..._: any[]) {
-      super();
-
-      // Define a new Injector and assiciate it with this instance of the service
-      const injector = new Injector(Base.providers);
-      INJECTABLE_MAP.set(this, injector);
+export interface InjectableOpts {
+  providers?: Provider<unknown>[];
+}
 
-      // If the current injectable instance is a HTMLElement preform additional startup logic
-      // this will find and attach parent injectors
-      if ('HTMLElement' in globalThis && this instanceof HTMLElement) {
-        this.addEventListener('finddiroot', (e) => {
-          const parentInjector = findInjectorRoot(e);
+export function injectable(opts?: InjectableOpts) {
+  return function injectableDecorator<T extends ConstructableToken<any>>(
+    Base: T,
+    ctx: ClassDecoratorContext
+  ) {
+    class Injectable extends Base {
+      constructor(..._: any[]) {
+        super();
 
-          if (parentInjector !== null) {
-            injector.setParent(parentInjector);
-          }
-        });
+        injectables.set(this, new Injector(opts?.providers));
       }
     }
 
-    connectedCallback() {
-      if ('HTMLElement' in globalThis && this instanceof HTMLElement) {
-        this.dispatchEvent(new Event('finddiroot'));
-
-        if (super.connectedCallback) {
-          super.connectedCallback();
-        }
+    // Only apply custom element bootstrap logic if the decorated class is an HTMLElement
+    if ('HTMLElement' in globalThis) {
+      if (HTMLElement.prototype.isPrototypeOf(Base.prototype)) {
+        return injectableEl(Injectable, ctx);
       }
     }
 
-    disconnectedCallback() {
-      const injector = INJECTABLE_MAP.get(this);
-
-      if (injector) {
-        injector.setParent(undefined);
-      }
-
-      if (super.disconnectedCallback) {
-        super.disconnectedCallback();
-      }
-    }
+    return Injectable;
   };
 }
-
-function findInjectorRoot(e: Event): Injector | null {
-  const path = e.composedPath();
-
-  // find firt parent
-  // skips the first item which is the target
-  for (let i = 1; i < path.length; i++) {
-    const part = path[i];
-
-    const injector = INJECTABLE_MAP.get(part);
-
-    if (injector) {
-      return injector;
-    }
-  }
-
-  return null;
-}

package/src/lib/injector.test.ts

@@ -1,184 +1,186 @@
-import { expect } from '@open-wc/testing';
+import { assert } from 'chai';
 
 import { Injector } from './injector.js';
 import { inject } from './inject.js';
 import { injectable } from './injectable.js';
 import { Provider, StaticToken } from './provider.js';
 
-describe('Injector', () => {
-  it('should create a new instance of a single provider', () => {
-    class A {}
+it('should create a new instance of a single provider', () => {
+  class A {}
 
-    const app = new Injector();
+  const app = new Injector();
 
-    expect(app.inject(A)).to.be.instanceOf(A);
-    expect(app.inject(A)).to.equal(app.inject(A));
-  });
+  assert(app.inject(A) instanceof A);
 
-  it('should inject providers in the correct order', () => {
-    class A {}
-    class B {}
+  assert.equal(app.inject(A), app.inject(A));
+});
 
-    @injectable
-    class MyService {
-      a = inject(A);
-      b = inject(B);
-    }
+it('should inject providers in the correct order', () => {
+  class A {}
+  class B {}
 
-    const app = new Injector();
-    const instance = app.inject(MyService);
+  @injectable()
+  class MyService {
+    a = inject(A);
+    b = inject(B);
+  }
 
-    expect(instance.a()).to.be.instanceOf(A);
-    expect(instance.b()).to.be.instanceOf(B);
-  });
+  const app = new Injector();
+  const instance = app.inject(MyService);
 
-  it('should create a new instance of a provider that has a full dep tree', () => {
-    class A {}
+  assert(instance.a() instanceof A);
+  assert(instance.b() instanceof B);
+});
 
-    @injectable
-    class B {
-      a = inject(A);
-    }
+it('should create a new instance of a provider that has a full dep tree', () => {
+  class A {}
 
-    @injectable
-    class C {
-      b = inject(B);
-    }
+  @injectable()
+  class B {
+    a = inject(A);
+  }
 
-    @injectable
-    class D {
-      c = inject(C);
-    }
+  @injectable()
+  class C {
+    b = inject(B);
+  }
 
-    @injectable
-    class E {
-      d = inject(D);
-    }
+  @injectable()
+  class D {
+    c = inject(C);
+  }
 
-    const app = new Injector();
-    const instance = app.inject(E);
+  @injectable()
+  class E {
+    d = inject(D);
+  }
 
-    expect(instance.d().c().b().a()).to.be.instanceOf(A);
-  });
+  const app = new Injector();
+  const instance = app.inject(E);
 
-  it('should override a provider if explicitly instructed', () => {
-    class A {}
+  assert(instance.d().c().b().a() instanceof A);
+});
 
-    @injectable
-    class B {
-      a = inject(A);
-    }
+it('should override a provider if explicitly instructed', () => {
+  class A {}
 
-    class AltA extends A {}
-    const app = new Injector([{ provide: A, use: AltA }]);
+  @injectable()
+  class B {
+    a = inject(A);
+  }
 
-    expect(app.inject(B).a()).to.be.instanceOf(AltA);
-  });
+  class AltA extends A {}
+  const app = new Injector([{ provide: A, use: AltA }]);
 
-  it('should return an existing instance from a parent injector', () => {
-    class A {}
+  assert(app.inject(B).a() instanceof AltA);
+});
 
-    const parent = new Injector();
+it('should return an existing instance from a parent injector', () => {
+  class A {}
 
-    const app = new Injector([], parent);
+  const parent = new Injector();
 
-    expect(parent.inject(A)).to.equal(app.inject(A));
-  });
+  const app = new Injector([], parent);
 
-  it('should use a factory if provided', () => {
-    class Service {
-      hello() {
-        return 'world';
-      }
+  assert.equal(parent.inject(A), app.inject(A));
+});
+
+it('should use a factory if provided', () => {
+  class Service {
+    hello() {
+      return 'world';
     }
+  }
 
-    const injector = new Injector([
-      {
-        provide: Service,
-        factory() {
-          return {
-            hello() {
-              return 'you';
-            }
-          };
-        }
+  const injector = new Injector([
+    {
+      provide: Service,
+      factory() {
+        return {
+          hello() {
+            return 'world';
+          }
+        };
       }
-    ]);
+    }
+  ]);
 
-    expect(injector.inject(Service).hello()).to.equal('you');
-  });
+  assert.equal(injector.inject(Service).hello(), 'world');
+});
 
-  it('should throw an error if provider is missing both factory and use', () => {
-    class Service {
-      hello() {
-        return 'world';
-      }
+it('should throw an error if provider is missing both factory and use', () => {
+  class Service {
+    hello() {
+      return 'world';
     }
+  }
 
-    const injector = new Injector([
-      {
-        provide: Service
-      }
-    ]);
+  const injector = new Injector([
+    {
+      provide: Service
+    }
+  ]);
 
-    expect(() => injector.inject(Service)).to.throw(
-      "Provider for Service found but is missing either 'use' or 'factory'"
-    );
-  });
+  assert.throws(
+    () => injector.inject(Service),
+    "Provider for Service found but is missing either 'use' or 'factory'"
+  );
+});
 
-  it('should pass factories and instance of the injector', (done) => {
-    class Service {
-      hello() {
-        return 'world';
-      }
+it('should pass factories and instance of the injector', async () => {
+  class Service {
+    hello() {
+      return 'world';
     }
+  }
 
-    const injector = new Injector([
-      {
-        provide: Service,
-        factory(i) {
-          expect(i).to.equal(injector);
+  let factoryInjector: Injector | null = null;
 
-          done();
-        }
+  const injector = new Injector([
+    {
+      provide: Service,
+      factory(i) {
+        factoryInjector = i;
       }
-    ]);
+    }
+  ]);
 
-    injector.inject(Service);
-  });
+  injector.inject(Service);
 
-  it('should create an instance from a StaticToken factory', () => {
-    const TOKEN = new StaticToken('test', () => 'Hello World');
-    const injector = new Injector();
+  assert.equal(factoryInjector, injector);
+});
 
-    const res = injector.inject(TOKEN);
+it('should create an instance from a StaticToken factory', () => {
+  const TOKEN = new StaticToken('test', () => 'Hello World');
+  const injector = new Injector();
 
-    expect(res).to.equal('Hello World');
-  });
+  const res = injector.inject(TOKEN);
 
-  it('should create an instance from an async StaticToken factory', async () => {
-    const TOKEN = new StaticToken('test', () => Promise.resolve('Hello World'));
-    const injector = new Injector();
+  assert.equal(res, 'Hello World');
+});
 
-    const res = await injector.inject(TOKEN);
+it('should create an instance from an async StaticToken factory', async () => {
+  const TOKEN = new StaticToken('test', () => Promise.resolve('Hello World'));
+  const injector = new Injector();
 
-    expect(res).to.equal('Hello World');
-  });
+  const res = await injector.inject(TOKEN);
 
-  it('should allow static token to be overridden', () => {
-    const TOKEN = new StaticToken<string>('test');
+  assert.equal(res, 'Hello World');
+});
 
-    const provider: Provider<string> = {
-      provide: TOKEN,
-      factory() {
-        return 'Hello World';
-      }
-    };
+it('should allow static token to be overridden', () => {
+  const TOKEN = new StaticToken<string>('test');
+
+  const provider: Provider<string> = {
+    provide: TOKEN,
+    factory() {
+      return 'Hello World';
+    }
+  };
 
-    const injector = new Injector([provider]);
+  const injector = new Injector([provider]);
 
-    const res = injector.inject(TOKEN);
+  const res = injector.inject(TOKEN);
 
-    expect(res).to.equal('Hello World');
-  });
+  assert.equal(res, 'Hello World');
 });

package/src/lib/injector.ts

@@ -1,6 +1,16 @@
-import { INJECTABLE_MAP } from './injectable.js';
-import { LifeCycle } from './lifecycle.js';
-import { InjectionToken, Provider, StaticToken } from './provider.js';
+import { readMetadata } from './metadata.js';
+import {
+  ConstructableToken,
+  InjectionToken,
+  Provider,
+  ProviderFactory,
+  StaticToken
+} from './provider.js';
+
+/**
+ * Keeps track of all Injectable services and their Injector
+ */
+export const injectables = new WeakMap<object, Injector>();
 
 /**
  * Injectors create and store instances of services.
@@ -31,17 +41,17 @@ export class Injector {
     this.providers = providers;
   }
 
-  inject<T>(token: InjectionToken<T>): T {
-    return this.get(token);
-  }
-
   // resolves and retuns and instance of the requested service
-  get<T>(token: InjectionToken<T>): T {
+  inject<T>(token: InjectionToken<T>): T {
     // check for a local instance
     if (this.#instances.has(token)) {
       const instance = this.#instances.get(token)!;
 
-      callLifecycle(instance, LifeCycle.onInject);
+      const metadata = readMetadata(token as ConstructableToken<T>);
+
+      if (metadata) {
+        callLifecycle(instance, metadata.onInjected);
+      }
 
       return instance;
     }
@@ -89,7 +99,7 @@ export class Injector {
     this.#instances = new WeakMap();
   }
 
-  #createAndCache<T>(token: InjectionToken<T>, factory: (injector: Injector) => T): T {
+  #createAndCache<T>(token: InjectionToken<T>, factory: ProviderFactory<T>): T {
     const instance = factory(this);
 
     this.#instances.set(token, instance);
@@ -98,7 +108,7 @@ export class Injector {
      * Only values that are objects are able to have associated injectors
      */
     if (typeof instance === 'object' && instance !== null) {
-      const injector = INJECTABLE_MAP.get(instance);
+      const injector = injectables.get(instance);
 
       if (injector) {
         /**
@@ -114,8 +124,12 @@ export class Injector {
        * this ensures that services are initialized when the chain is settled
        * this is required since the parent is set after the instance is constructed
        */
-      callLifecycle(instance, LifeCycle.onInit);
-      callLifecycle(instance, LifeCycle.onInject);
+      const metadata = readMetadata(token as ConstructableToken<T>);
+
+      if (metadata) {
+        callLifecycle(instance, metadata.onCreated);
+        callLifecycle(instance, metadata.onInjected);
+      }
     }
 
     return instance;
@@ -136,12 +150,12 @@ export class Injector {
   }
 }
 
-function callLifecycle(instance: unknown, method: symbol) {
-  if (typeof instance === 'object' && instance !== null) {
-    const lifecycle = Reflect.get(instance, method);
-
-    if (typeof lifecycle === 'function') {
-      lifecycle.call(instance);
+function callLifecycle(instance: object, methods?: unknown) {
+  if (Array.isArray(methods)) {
+    for (let cb of methods) {
+      if (typeof cb === 'function') {
+        cb.call(instance);
+      }
     }
   }
 }