Setup methods (#30)

* Refactor types

* Add `compileEach()` and `setup(..)`

* Add types and make module configuration possible outside of beforeEach setup

* Use set objects into factory

Author: remscodes

projects/ngx-testing-tools/src/lib/components/test-bed/component-test-bed-factory.ts

@@ -1,75 +1,120 @@
-import { Component, EnvironmentProviders, ModuleWithProviders, Provider, ProviderToken, Type } from '@angular/core';
-import { ComponentFixture, TestBed, TestBedStatic, TestModuleMetadata } from '@angular/core/testing';
+import { Component, ProviderToken, Type } from '@angular/core';
+import { ComponentFixture, TestBed, TestBedStatic } from '@angular/core/testing';
 import { MaybeArray, Merge, NonEmptyString, Nullable } from '../../models/shared.model';
 import { assertComponent } from './assert-component';
 import { assertComponentFixture } from './assert-fixture';
 import { getComponentAnnotation } from './component-annotation';
+import { buildComponentTools } from './component-tools';
 import { ComponentTestBed } from './models';
+import { AnyProvider, Declaration, Importation } from './models/metadata-type.model';
+import { ComponentSetup } from './models/setup-fn.model';
 import { InjectionStore } from './store';
 
-export class ComponentTestBedFactory<ComponentType, Injected extends InjectionStore = InjectionStore> {
+export class ComponentTestBedFactory<ComponentType, Store extends InjectionStore = InjectionStore> {
 
   public constructor(
     private rootComponent: Type<ComponentType>,
   ) {
-    this.annotation = getComponentAnnotation(rootComponent);
-    assertComponent(rootComponent, this.annotation);
-  }
+    const annotation: Nullable<Component> = getComponentAnnotation(rootComponent);
+    assertComponent(rootComponent, annotation);
 
-  private readonly annotation: Nullable<Component>;
+    (annotation?.standalone)
+      ? this.import(this.rootComponent)
+      : this.declare(this.rootComponent);
+  }
 
   private testBed: TestBedStatic = TestBed;
   private fixture: ComponentFixture<ComponentType> = null!;
-  private injected: Map<ProviderToken<any>, string> = new Map();
+
+  private imports: Set<Importation> = new Set();
+  private declarations: Set<Declaration> = new Set();
+  private providers: Set<AnyProvider> = new Set();
+
+  private injectedMap: Map<ProviderToken<any>, string> = new Map();
 
   /**
    * Import one module or one standalone component / directive / pipe into the `ComponentTestBed`.
    */
-  public import(importation: Type<any> | ModuleWithProviders<any>): this
+  public import(importation: Importation): this
   /**
    * Import many modules or many standalone components / directives / pipes into the `ComponentTestBed`.
    */
-  public import(imports: (Type<any> | ModuleWithProviders<any>)[]): this
-  public import(oneOrManyImports: MaybeArray<Type<any> | ModuleWithProviders<any>>): this
-  public import(oneOrManyImports: MaybeArray<Type<any> | ModuleWithProviders<any>>): this {
-    return this.configure('imports', oneOrManyImports);
+  public import(imports: Importation[]): this
+  public import(oneOrManyImports: MaybeArray<Importation>): this {
+    makeArray(oneOrManyImports).forEach(v => this.imports.add(v));
+    return this;
   }
 
   /**
    * Add one provider into the `ComponentTestBed`.
    */
-  public provide(provider: Provider | EnvironmentProviders): this
+  public provide(provider: AnyProvider): this
   /**
    * Add many providers into the `ComponentTestBed`.
    */
-  public provide(providers: (Provider | EnvironmentProviders)[]): this
-  public provide(oneOrManyProviders: MaybeArray<Provider | EnvironmentProviders>): this
-  public provide(oneOrManyProviders: MaybeArray<Provider | EnvironmentProviders>): this {
-    return this.configure('providers', oneOrManyProviders);
+  public provide(providers: AnyProvider[]): this
+  public provide(oneOrManyProviders: MaybeArray<AnyProvider>): this {
+    makeArray(oneOrManyProviders).forEach(v => this.providers.add(v));
+    return this;
   }
 
   /**
    * Declare one non standalone component, directive or pipe into the `ComponentTestBed`.
    */
-  public declare(declaration: Type<any>): this
+  public declare(declaration: Declaration): this
   /**
    * Declare many non standalone components, directives and pipes into `ComponentTestBed`.
    */
-  public declare(declarations: Type<any>[]): this
-  public declare(oneOrManyDeclarations: MaybeArray<Type<any>>): this
-  public declare(oneOrManyDeclarations: MaybeArray<Type<any>>): this {
-    return this.configure('declarations', oneOrManyDeclarations);
+  public declare(declarations: Declaration[]): this
+  public declare(oneOrManyDeclarations: MaybeArray<Declaration>): this {
+    makeArray(oneOrManyDeclarations).forEach(v => this.declarations.add(v));
+    return this;
+  }
+
+  private async configureModule(): Promise<void> {
+    this.testBed.configureTestingModule({
+      imports: [...this.imports.values()],
+      declarations: [...this.declarations.values()],
+      providers: [...this.providers.values()],
+    });
+
+    await this.testBed.compileComponents();
   }
 
-  public inject<key extends string, T>(name: NonEmptyString<key>, token: ProviderToken<T>): ComponentTestBed<ComponentType, InjectionStore<Merge<Injected['injected'] & { [k in key]: T }>>> {
-    this.injected.set(token, name);
+  /**
+   * Inject an instance by token into the `ComponentTestBed`.
+   *
+   * Retrieve it into the `ComponentTools.injected` by autocompletion.
+   * @param name the key to access the instance.
+   * @param token the provider token.
+   */
+  public inject<key extends string, T>(name: NonEmptyString<key>, token: ProviderToken<T>): ComponentTestBed<ComponentType, InjectionStore<Merge<Store['injected'] & { [k in key]: T }>>> {
+    this.injectedMap.set(token, name);
     return this as any;
   }
 
-  private configure(key: keyof TestModuleMetadata, itemS: MaybeArray<unknown>): this {
-    const defs: unknown[] = Array.isArray(itemS) ? itemS : [itemS];
-    this.testBed.configureTestingModule({ [key]: defs });
-    return this;
+  /**
+   * Compile the `ComponentTestBed` before each test.
+   */
+  public compileEach(): void {
+    beforeEach(() => this.compile());
+  }
+
+  /**
+   * Compile the `ComponentTestBed` to create the `rootComponent` fixture.
+   */
+  public async compile(): Promise<void> {
+    await this.configureModule();
+    this.fixture = this.testBed.createComponent(this.rootComponent);
+  }
+
+  /**
+   * Not compatible with `beforeAll` and `afterAll`.
+   */
+  public setup(action: ComponentSetup<ComponentType, Store['injected']>): jasmine.ImplementationCallback {
+    return (action.length > 1)
+      ? (done: DoneFn) => action(buildComponentTools(this), done)
+      : () => action(buildComponentTools(this), null!);
   }
 
   /**
@@ -83,17 +128,8 @@ export class ComponentTestBedFactory<ComponentType, Injected extends InjectionSt
       expect(this.fixture.componentInstance).toBeTruthy();
     });
   }
+}
 
-  /**
-   * Compile the `ComponentTestBed` to create the `rootComponent` fixture.
-   */
-  public async compile(): Promise<void> {
-    (this.annotation?.standalone)
-      ? this.import(this.rootComponent)
-      : this.declare(this.rootComponent);
-
-    await this.testBed.compileComponents();
-
-    this.fixture = this.testBed.createComponent(this.rootComponent);
-  }
+function makeArray<T>(itemS: MaybeArray<T>): T[] {
+  return (Array.isArray(itemS)) ? itemS : [itemS];
 }

projects/ngx-testing-tools/src/lib/components/test-bed/component-test-bed.ts

@@ -1,15 +1,8 @@
 import { Type } from '@angular/core';
-import { ComponentFixture } from '@angular/core/testing';
-import { assertComponentFixture } from './assert-fixture';
-import { buildComponentActionTools } from './component-action-tools';
-import { buildComponentQueryTools } from './component-query-tools';
 import { ComponentTestBedFactory } from './component-test-bed-factory';
-import { ComponentExtraOptions } from './models';
-import { ComponentActionTools } from './models/component-action-tools.model';
-import { ComponentQueryTools } from './models/component-query-tools.model';
+import { buildComponentTools } from './component-tools';
+import { ComponentExtraOptions, ComponentTools } from './models';
 import { ComponentAssertion, ComponentTestBed } from './models/component-test-bed.models';
-import { InjectionStore } from './store';
-import { buildInjected } from './store/injected';
 
 /**
  * Creates a new `ComponentTestBed` to configure the test bed and wrap the assertion test.
@@ -22,19 +15,11 @@ export function componentTestBed<T>(rootComponent: Type<T>): ComponentTestBed<T>
     const { startDetectChanges = true } = options;
 
     const expectationFn = (done: DoneFn = null!) => {
-      const fixture: ComponentFixture<T> = factory['fixture'];
-      assertComponentFixture(fixture);
+      const tools: ComponentTools<T> = buildComponentTools(factory);
 
-      const { componentInstance: component, debugElement: debug } = fixture;
-      const { injector } = debug;
+      if (startDetectChanges) tools.fixture.detectChanges();
 
-      const query: ComponentQueryTools = buildComponentQueryTools(fixture);
-      const action: ComponentActionTools = buildComponentActionTools(fixture);
-      const injected: InjectionStore['injected'] = buildInjected(factory);
-
-      if (startDetectChanges) fixture.detectChanges();
-
-      return assertionCb({ fixture, component, injector, query, action, injected, debug }, done);
+      return assertionCb(tools, done);
     };
 
     return (assertionCb.length > 1)
@@ -45,16 +30,16 @@ export function componentTestBed<T>(rootComponent: Type<T>): ComponentTestBed<T>
   return mergeFactoryToFn(factory, tb);
 }
 
-function mergeFactoryToFn<T>(factory: ComponentTestBedFactory<T, any>, tb: ComponentTestBed<T, any>): ComponentTestBed<T> {
-  tb.import = (imports) => {
+function mergeFactoryToFn<T>(factory: ComponentTestBedFactory<T>, tb: ComponentTestBed<T, any>): ComponentTestBed<T> {
+  tb.import = (imports: any) => {
     factory.import(imports);
     return tb;
   };
-  tb.provide = (providers) => {
+  tb.provide = (providers: any) => {
     factory.provide(providers);
     return tb;
   };
-  tb.declare = (declarations) => {
+  tb.declare = (declarations: any) => {
     factory.declare(declarations);
     return tb;
   };
@@ -63,8 +48,10 @@ function mergeFactoryToFn<T>(factory: ComponentTestBedFactory<T, any>, tb: Compo
     return tb;
   };
 
-  tb.shouldCreate = factory.shouldCreate.bind(factory);
   tb.compile = factory.compile.bind(factory);
+  tb.compileEach = factory.compileEach.bind(factory);
+  tb.setup = factory.setup.bind(factory);
+  tb.shouldCreate = factory.shouldCreate.bind(factory);
 
   return tb;
 }

projects/ngx-testing-tools/src/lib/components/test-bed/component-tools.ts

@@ -0,0 +1,27 @@
+import { ProviderToken } from '@angular/core';
+import { ComponentFixture } from '@angular/core/testing';
+import { assertComponentFixture } from './assert-fixture';
+import { buildComponentActionTools } from './component-action-tools';
+import { buildComponentQueryTools } from './component-query-tools';
+import { ComponentTestBedFactory } from './component-test-bed-factory';
+import { ComponentTools } from './models';
+import { ComponentActionTools } from './models/component-action-tools.model';
+import { ComponentQueryTools } from './models/component-query-tools.model';
+import { InjectionStore } from './store';
+import { buildInjected } from './store/injected';
+
+export function buildComponentTools(factory: ComponentTestBedFactory<any>): ComponentTools<any, any> {
+  const fixture: ComponentFixture<unknown> = factory['fixture'];
+  assertComponentFixture(fixture);
+
+  const injectedMap: Map<ProviderToken<any>, string> = factory['injectedMap'];
+
+  const { componentInstance: component, debugElement: debug } = fixture;
+  const { injector } = debug;
+
+  const query: ComponentQueryTools = buildComponentQueryTools(fixture);
+  const action: ComponentActionTools = buildComponentActionTools(fixture);
+  const injected: InjectionStore['injected'] = buildInjected(fixture, injectedMap);
+
+  return { fixture, component, injector, query, action, injected, debug };
+}

projects/ngx-testing-tools/src/lib/components/test-bed/models/component-tools.model.ts

@@ -4,7 +4,7 @@ import { InjectionStore } from '../store';
 import { ComponentActionTools } from './component-action-tools.model';
 import { ComponentQueryTools } from './component-query-tools.model';
 
-export interface ComponentTools<T, I extends {}> extends InjectionStore<I> {
+export interface ComponentTools<T, I extends {} = {}> extends InjectionStore<I> {
   fixture: ComponentFixture<T>;
   component: T;
   injector: Injector;

projects/ngx-testing-tools/src/lib/components/test-bed/models/metadata-type.model.ts

@@ -0,0 +1,17 @@
+import { ClassProvider, ConstructorProvider, EnvironmentProviders, ExistingProvider, FactoryProvider, ModuleWithProviders, Type, TypeProvider, ValueProvider } from '@angular/core';
+
+export type Importation =
+  | Type<any>
+  | ModuleWithProviders<any>
+
+export type AnyProvider =
+  | TypeProvider
+  | ValueProvider
+  | ClassProvider
+  | ConstructorProvider
+  | ExistingProvider
+  | FactoryProvider
+  | EnvironmentProviders
+
+export type Declaration =
+  | Type<any>

projects/ngx-testing-tools/src/lib/components/test-bed/models/setup-fn.model.ts

@@ -0,0 +1,3 @@
+import { ComponentTools } from './component-tools.model';
+
+export type ComponentSetup<T, I extends {}> = (tools: ComponentTools<T, I>, done: DoneFn) => ReturnType<jasmine.ImplementationCallback>

projects/ngx-testing-tools/src/lib/components/test-bed/store/injected.ts

@@ -1,11 +1,12 @@
+import { ProviderToken } from '@angular/core';
+import { ComponentFixture } from '@angular/core/testing';
 import { fromInjector } from '../../../injector';
-import { ComponentTestBedFactory } from '../component-test-bed-factory';
 import { InjectionStore } from './models/injected-store.model';
 
-export function buildInjected(factory: ComponentTestBedFactory<unknown>): InjectionStore['injected'] {
+export function buildInjected(fixture: ComponentFixture<unknown>, injectedMap: Map<ProviderToken<any>, string>): InjectionStore['injected'] {
   const injected: InjectionStore<any>['injected'] = {};
-  for (const [key, value] of factory['injected'].entries()) {
-    injected[value] = fromInjector(factory['fixture'], key);
+  for (const [key, value] of injectedMap.entries()) {
+    injected[value] = fromInjector(fixture, key);
   }
   return injected;
 }

projects/ngx-testing-tools/src/lib/models/shared.model.ts

@@ -8,7 +8,7 @@ export type MaybeArray<T> =
 
 export type NonEmptyString<T extends string> = T extends '' ? never : T;
 
-export type Merge<T> = {
+export type Merge<T extends {}> = {
   [K in keyof T]: T[K];
 } & {};
 

projects/ngx-testing-tools/src/tests/fixtures/mocks/test-compiler.mock.ts

@@ -1,11 +1,11 @@
-import { Provider, Type } from '@angular/core';
 import { TestModuleMetadata } from '@angular/core/testing';
+import { AnyProvider, Declaration, Importation } from '../../../lib/components/test-bed/models/metadata-type.model';
 
 export class MockTestCompiler {
 
-  public declarations: Type<any>[] = [];
-  public imports: Type<any>[] = [];
-  public providers: Provider[] = [];
+  public declarations: Declaration[] = [];
+  public imports: Importation[] = [];
+  public providers: AnyProvider[] = [];
 
   public configureTestingModule(moduleDef: TestModuleMetadata): void {
     if (Array.isArray(moduleDef.declarations)) {