feat: supporting fixture in ngMocks.find

help-me-mom · Oct 23, 2020 · 26da8a4 · 26da8a4
1 parent db7b368
commit 26da8a4
Show file tree

Hide file tree

Showing 6 changed files with 28 additions and 21 deletions.
diff --git a/README.md b/README.md
@@ -167,7 +167,7 @@ describe('MockComponent', () => {
     // ).componentInstance
     // but properly typed.
     const mockedComponent = ngMocks.find<DependencyComponent>(
-      fixture.debugElement,
+      fixture,
       'app-child'
     ).componentInstance;
 
@@ -192,10 +192,8 @@ describe('MockComponent', () => {
     //   By.directive(DependencyComponent)
     // ).componentInstance
     // but properly typed.
-    const mockedComponent = ngMocks.find(
-      fixture.debugElement,
-      DependencyComponent
-    ).componentInstance;
+    const mockedComponent = ngMocks.find(fixture, DependencyComponent)
+      .componentInstance;
 
     // Again, let's pretend DependencyComponent has an output
     // called 'someOutput'. TestedComponent listens on the output via

diff --git a/examples/MockComponent/test.spec.ts b/examples/MockComponent/test.spec.ts
@@ -39,7 +39,7 @@ describe('MockComponent', () => {
     //   By.css('app-child')
     // ).componentInstance
     // but properly typed.
-    const mockedComponent = ngMocks.find<DependencyComponent>(fixture.debugElement, 'app-child').componentInstance;
+    const mockedComponent = ngMocks.find<DependencyComponent>(fixture, 'app-child').componentInstance;
 
     // Let's pretend that DependencyComponent has 'someInput' as
     // an input. TestedComponent sets its value via
@@ -62,7 +62,7 @@ describe('MockComponent', () => {
     //   By.directive(DependencyComponent)
     // ).componentInstance
     // but properly typed.
-    const mockedComponent = ngMocks.find(fixture.debugElement, DependencyComponent).componentInstance;
+    const mockedComponent = ngMocks.find(fixture, DependencyComponent).componentInstance;
 
     // Again, let's pretend DependencyComponent has an output
     // called 'someOutput'. TestedComponent listens on the output via
@@ -117,7 +117,7 @@ describe('MockComponent', () => {
 
     // The rendered template is wrapped by <div data-key="something">.
     // We can use this selector to assert exactly its content.
-    const mockedNgTemplate = ngMocks.find(localFixture.debugElement, '[data-key="something"]').nativeElement.innerHTML;
+    const mockedNgTemplate = ngMocks.find(localFixture, '[data-key="something"]').nativeElement.innerHTML;
     expect(mockedNgTemplate).toContain('<p>inside template</p>');
   });
 });
diff --git a/lib/mock-helper/mock-helper.find.ts b/lib/mock-helper/mock-helper.find.ts
@@ -8,7 +8,7 @@ import { MockedDebugElement } from '../mock-render';
 const defaultNotFoundValue = {}; // simulating Symbol
 
 export default (...args: any[]) => {
-  const el: MockedDebugElement = args[0];
+  const el: MockedDebugElement = args[0].debugElement ? args[0].debugElement : args[0];
   const sel: string | Type<any> = args[1];
   const notFoundValue: any = args.length === 3 ? args[2] : defaultNotFoundValue;
 

diff --git a/lib/mock-helper/mock-helper.findAll.ts b/lib/mock-helper/mock-helper.findAll.ts
@@ -3,9 +3,8 @@
 import { By } from '@angular/platform-browser';
 
 import { getSourceOfMock } from '../common';
-import { MockedDebugElement } from '../mock-render';
 
-export default (el: MockedDebugElement, sel: any) => {
+export default (el: any, sel: any) => {
   const term = typeof sel === 'string' ? By.css(sel) : By.directive(getSourceOfMock(sel));
-  return el.queryAll(term);
+  return (el.debugElement ? el.debugElement : el).queryAll(term);
 };
diff --git a/lib/mock-helper/mock-helper.spec.ts b/lib/mock-helper/mock-helper.spec.ts
@@ -157,7 +157,7 @@ describe('MockHelper:getDirective', () => {
 
   it('findAll selector: T', () => {
     const fixture = MockRender(`<component-a></component-a><component-a></component-a>`);
-    const componentA = ngMocks.findAll(fixture.debugElement, AComponent);
+    const componentA = ngMocks.findAll(fixture, AComponent);
     expect(componentA.length).toBe(2);
     expect(componentA[0].componentInstance).toEqual(jasmine.any(AComponent));
     expect(componentA[1].componentInstance).toEqual(jasmine.any(AComponent));
@@ -168,7 +168,7 @@ describe('MockHelper:getDirective', () => {
 
   it('findAll selector: string', () => {
     const fixture = MockRender(`<component-b></component-b><component-b></component-b>`);
-    const componentB = ngMocks.findAll(fixture.debugElement, 'component-b');
+    const componentB = ngMocks.findAll(fixture, 'component-b');
     expect(componentB.length).toEqual(2);
     expect(componentB[0].componentInstance).toEqual(jasmine.any(BComponent));
     expect(componentB[0].componentInstance).toEqual(jasmine.any(BComponent));

diff --git a/lib/mock-helper/mock-helper.ts b/lib/mock-helper/mock-helper.ts
@@ -1,7 +1,7 @@
 // tslint:disable:variable-name unified-signatures no-default-import
 
 import { EventEmitter, InjectionToken, Provider } from '@angular/core';
-import { TestModuleMetadata } from '@angular/core/testing';
+import { ComponentFixture, TestModuleMetadata } from '@angular/core/testing';
 
 import { AbstractType, AnyType, NgModuleWithProviders, Type } from '../common';
 import { MockedDebugElement, MockedDebugNode } from '../mock-render';
@@ -92,18 +92,28 @@ export const MockHelper: {
 export const ngMocks: {
   faster(): void;
 
-  find<T>(debugElement: MockedDebugElement, component: Type<T>): MockedDebugElement<T>;
-  find<T, D>(debugElement: MockedDebugElement, component: Type<T>, notFoundValue: D): D | MockedDebugElement<T>;
+  find<T>(debugElement: MockedDebugElement | ComponentFixture<any>, component: Type<T>): MockedDebugElement<T>;
+  find<T, D>(
+    debugElement: MockedDebugElement | ComponentFixture<any>,
+    component: Type<T>,
+    notFoundValue: D
+  ): D | MockedDebugElement<T>;
 
-  find<T = any>(debugElement: MockedDebugElement, cssSelector: string): MockedDebugElement<T>;
+  find<T = any>(debugElement: MockedDebugElement | ComponentFixture<any>, cssSelector: string): MockedDebugElement<T>;
   find<T = any, D = undefined>(
-    debugElement: MockedDebugElement,
+    debugElement: MockedDebugElement | ComponentFixture<any>,
     cssSelector: string,
     notFoundValue: D
   ): D | MockedDebugElement<T>;
 
-  findAll<T>(debugElement: MockedDebugElement, component: Type<T>): Array<MockedDebugElement<T>>;
-  findAll<T = any>(debugElement: MockedDebugElement, cssSelector: string): Array<MockedDebugElement<T>>;
+  findAll<T>(
+    debugElement: MockedDebugElement | ComponentFixture<any>,
+    component: Type<T>
+  ): Array<MockedDebugElement<T>>;
+  findAll<T = any>(
+    debugElement: MockedDebugElement | ComponentFixture<any>,
+    cssSelector: string
+  ): Array<MockedDebugElement<T>>;
 
   findInstance<T>(debugNode: MockedDebugNode, instanceClass: Type<T>): T;
   findInstance<T, D>(debugNode: MockedDebugNode, instanceClass: Type<T>, notFoundValue: D): D | T;