fix: allow component declarations in modules (#28)

Use the `excludeComponentDeclaration` option to exclude the component to be automatically be added as a declaration.

Author: timdeschryver

projects/testing-library/src/lib/models.ts

@@ -20,4 +20,9 @@ export interface RenderOptions<C, Q extends Queries = typeof queries> {
   componentProviders?: any[];
   queries?: Q;
   wrapper?: Type<any>;
+  /**
+   * Exclude the component to be automatically be added as a declaration
+   * This is needed when the component is declared in an imported module
+   */
+  excludeComponentDeclaration?: boolean;
 }

projects/testing-library/src/lib/testing-library.ts

@@ -29,10 +29,16 @@ export async function render<T>(
     wrapper = WrapperComponent,
     componentProperties = {},
     componentProviders = [],
+    excludeComponentDeclaration = false,
   } = renderOptions;
 
   const isTemplate = typeof templateOrComponent === 'string';
-  const componentDeclarations = isTemplate ? [wrapper] : [templateOrComponent];
+  const componentDeclarations = declareComponents({
+    templateOrComponent,
+    wrapper,
+    isTemplate,
+    excludeComponentDeclaration,
+  });
 
   TestBed.configureTestingModule({
     declarations: [...declarations, ...componentDeclarations],
@@ -144,3 +150,15 @@ function setComponentProperties<T>(
   }
   return fixture;
 }
+
+function declareComponents({ isTemplate, wrapper, excludeComponentDeclaration, templateOrComponent }) {
+  if (isTemplate) {
+    return [wrapper];
+  }
+
+  if (excludeComponentDeclaration) {
+    return [];
+  }
+
+  return [templateOrComponent];
+}

projects/testing-library/tests/render.spec.ts

@@ -0,0 +1,20 @@
+import { Component, ElementRef, OnInit, NgModule } from '@angular/core';
+import { render } from '../src/public_api';
+
+@Component({
+  selector: 'fixture',
+  template: ``,
+})
+class FixtureComponent {}
+
+@NgModule({
+  declarations: [FixtureComponent],
+})
+export class FixtureModule {}
+
+test('should not throw if component is declared in an import', async () => {
+  await render(FixtureComponent, {
+    imports: [FixtureModule],
+    excludeComponentDeclaration: true,
+  });
+});

projects/testing-library/tests/wrapper.spec.ts

@@ -1,4 +1,4 @@
-import { Component, Input, ElementRef, OnInit } from '@angular/core';
+import { Component, ElementRef, OnInit } from '@angular/core';
 import { render } from '../src/public_api';
 
 @Component({