feat(host): allow to pass initial inputs when creating component

Also second parameter can trigger change detection to render view with initial inputs immediately

Author: gund

projects/ngx-testing/src/lib/factories.ts

@@ -6,26 +6,35 @@ import { HostComponentService } from './host-component.service';
 import { HostDirectiveService } from './host-directive.service';
 import { NgxTestingModule } from './ngx-testing.module';
 import {
+  ComponentInputs,
   TestingComponentModuleExtras,
   TestingDirectiveModuleExtras,
 } from './types';
 
 export interface TestingFactory<T, H extends Host> {
   testModule: NgxTestingModule<T>;
   getHost(): H;
-  createComponent(): Promise<H>;
+  createComponent(
+    inputs?: ComponentInputs<T>,
+    detectChanges?: boolean,
+  ): Promise<H>;
 }
 
 export function getTestingForComponent<T>(
   type: Type<T>,
   extras?: TestingComponentModuleExtras,
 ): TestingFactory<T, HostComponentService<T>> {
   const testModule = NgxTestingModule.forComponent<T>(type, extras);
+
   const getHost = () =>
-    TestBed.get(HostComponentService) as HostComponentService<T>;
-  const createComponent = () =>
+    TestBed.inject(HostComponentService) as HostComponentService<T>;
+
+  const createComponent = (
+    inputs?: ComponentInputs<T>,
+    detectChanges?: boolean,
+  ) =>
     getHost()
-      .createComponent()
+      .createComponent(inputs, detectChanges)
       .then(getHost);
 
   return { testModule, getHost, createComponent };
@@ -36,11 +45,16 @@ export function getTestingForDirective<T>(
   extras?: TestingDirectiveModuleExtras,
 ): TestingFactory<T, HostDirectiveService<T>> {
   const testModule = NgxTestingModule.forDirective<T>(type, extras);
+
   const getHost = () =>
-    TestBed.get(HostDirectiveService) as HostDirectiveService<T>;
-  const createComponent = () =>
+    TestBed.inject(HostDirectiveService) as HostDirectiveService<T>;
+
+  const createComponent = (
+    inputs?: ComponentInputs<T>,
+    detectChanges?: boolean,
+  ) =>
     getHost()
-      .createComponent()
+      .createComponent(inputs, detectChanges)
       .then(getHost);
 
   return { testModule, getHost, createComponent };

projects/ngx-testing/src/lib/host.ts

@@ -10,7 +10,7 @@ import { By } from '@angular/platform-browser';
 
 import { HostGeneratorService } from './host-generator.service';
 import { TestTypeToken } from './tokens';
-import { AsHostComponent, DebugElementTyped } from './types';
+import { AsHostComponent, ComponentInputs, DebugElementTyped } from './types';
 
 export abstract class Host<T = any> implements OnDestroy {
   private hostGeneratorService = this.injector.get(HostGeneratorService);
@@ -63,12 +63,32 @@ export abstract class Host<T = any> implements OnDestroy {
     }
   }
 
-  async createComponent(): Promise<ComponentFixture<AsHostComponent<T>>> {
+  async createComponent(
+    inputs?: ComponentInputs<T>,
+    detectChanges = false,
+  ): Promise<ComponentFixture<AsHostComponent<T>>> {
     await this.compileComponents();
     this._fixture = TestBed.createComponent(this.hostComponentType);
+
+    if (inputs) {
+      this.setInputs(inputs);
+    }
+
+    if (detectChanges) {
+      this.detectChanges();
+    }
+
     return this._fixture;
   }
 
+  setInputs(inputs: ComponentInputs<T>, detectChanges = false) {
+    Object.assign(this.hostComponent, inputs);
+
+    if (detectChanges) {
+      this.detectChanges();
+    }
+  }
+
   overrideHostTemplate(tpl: string): void {
     TestBed.overrideTemplate(this.hostComponentType, tpl);
   }

projects/ngx-testing/src/lib/types.ts

@@ -41,6 +41,19 @@ export interface HostComponent<T> {
 export type AsHostComponent<T> = HostComponent<T> &
   { [K in keyof T]: T[K] extends EventEmitter<infer A> ? OutputMock<A> : T[K] };
 
+/**
+ * Represents inputs of component `T`
+ */
+export type ComponentInputs<T> = Partial<
+  ExcludePropsByType<T, EventEmitter<any> | Function>
+>;
+
+export type FilterKeysByType<T, E> = {
+  [K in keyof T]: T[K] extends E ? never : K;
+}[keyof T];
+
+export type ExcludePropsByType<T, K> = Pick<T, FilterKeysByType<T, K>>;
+
 export type TemplateBindings = ComponentFactory<any>['inputs'];
 export type TemplateBinding = TemplateBindings extends Array<infer T>
   ? T