Merge pull request #1778 from satanTime/issues/1596

 fix: looking in vcr.createComponent on root node #1596

Author: satanTime

libs/ng-mocks/src/lib/mock-helper/crawl/nested-check-children.ts

@@ -26,5 +26,23 @@ export default (node: MockedDebugNode): MockedDebugNode[] => {
     children.push(childNode);
   }
 
+  if ((node as any).parent?.name === 'BODY') {
+    const childNodes: any[] = (node as any).parent.childNodes;
+    let start = childNodes.length;
+    let end = 0;
+    for (let i = childNodes.length - 1; i >= 0; i -= 1) {
+      const childNode = childNodes[i];
+      if (childNode.nativeNode.nodeName === '#comment') {
+        end = i;
+      } else if (childNode.nativeNode === node.nativeNode) {
+        start = i + 1;
+        break;
+      }
+    }
+    for (let i = start; i < end; i += 1) {
+      children.push(childNodes[i]);
+    }
+  }
+
   return children;
 };

package.json

@@ -8,6 +8,7 @@
     "build": "npm run clean && npm run build:ncc && npm run build:fix && cp CHANGELOG.md dist/libs/ng-mocks && cp README.md dist/libs/ng-mocks && cp LICENSE dist/libs/ng-mocks && cp libs/ng-mocks/package.json dist/libs/ng-mocks/package.json && cp libs/ng-mocks/migrations.json dist/libs/ng-mocks/migrations.json && cp -R examples dist/libs/ng-mocks",
     "build:ncc": "cd ./libs/ng-mocks && npx ncc build --no-source-map-register -m -e '@angular/animations' -e '@angular/cli' -e '@angular/common' -e '@angular/common/http' -e '@angular/core' -e '@angular/core/testing' -e '@angular/forms' -e '@angular/platform-browser' -e '@angular/platform-browser/animations' -e '@angular/platform-browser-dynamic' -e '@angular/router' ./src/index.ts -o ../../dist/libs/ng-mocks/",
     "build:fix": "sed -e 's/__dirname/(typeof __dirname===\"undefined\"?\"\":__dirname)/g' dist/libs/ng-mocks/index.js > dist/libs/ng-mocks/index.fix.js && mv dist/libs/ng-mocks/index.fix.js dist/libs/ng-mocks/index.js",
+    "build:sources": "cp -R libs/ng-mocks/src dist/libs/ng-mocks && sed -e 's/\\.\\.\\/webpack:\\/\\/ng-mocks\\///g' dist/libs/ng-mocks/index.js.map > dist/libs/ng-mocks/index.fix.js.map && mv dist/libs/ng-mocks/index.fix.js.map dist/libs/ng-mocks/index.js.map",
     "build:all": "npm run lint && npm run build && npm run test",
     "build:docs": "cd docs && CI=true npm run build",
     "clean": "rm -rf dist test-reports tmp",

tests/issue-1596/test.spec.ts

@@ -0,0 +1,79 @@
+import {
+  Component,
+  ComponentFactoryResolver,
+  NgModule,
+  Optional,
+  ViewContainerRef,
+} from '@angular/core';
+import { TestBed } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { MockBuilder, ngMocks } from 'ng-mocks';
+
+@Component({
+  selector: 'parent',
+  template: '<div #parent>parent</div>',
+})
+class ParentComponent {
+  public constructor(
+    viewContainerRef: ViewContainerRef,
+    @Optional() componentFactoryResolver: ComponentFactoryResolver,
+  ) {
+    const vcr: any = viewContainerRef;
+
+    try {
+      vcr.createComponent(ChildComponent);
+    } catch (e) {
+      const factory =
+        componentFactoryResolver.resolveComponentFactory(
+          ChildComponent,
+        );
+      vcr.createComponent(factory);
+    }
+  }
+}
+
+@Component({
+  selector: 'child',
+  template: '<span #child>child</span>',
+})
+class ChildComponent {}
+
+@NgModule({
+  declarations: [ParentComponent, ChildComponent],
+  entryComponents: [ChildComponent],
+})
+class TargetModule {}
+
+// It's a tricky thing, because it behaves like that in Ivy only.
+// But even in Ivy, it doesn't render the child component properly.
+describe('issue-1596', () => {
+  beforeEach(() => MockBuilder(ParentComponent, TargetModule));
+
+  it('finds child component', () => {
+    const fixture1 = TestBed.createComponent(ParentComponent);
+    fixture1.detectChanges();
+    const expectedEl1 = fixture1.debugElement.query(
+      By.directive(ChildComponent),
+    );
+    const expectedInstance1 = expectedEl1
+      ? expectedEl1.componentInstance
+      : null;
+
+    expect(ngMocks.findInstance(fixture1, ChildComponent, null)).toBe(
+      expectedInstance1,
+    );
+
+    const fixture2 = TestBed.createComponent(ParentComponent);
+    fixture2.detectChanges();
+    const expectedEl2 = fixture2.debugElement.query(
+      By.directive(ChildComponent),
+    );
+    const expectedInstance2 = expectedEl2
+      ? expectedEl2.componentInstance
+      : null;
+
+    expect(ngMocks.findInstance(fixture2, ChildComponent, null)).toBe(
+      expectedInstance2,
+    );
+  });
+});