fix: more friendly return type of mock-render

README.md

@@ -364,11 +364,13 @@ describe('MockModule', () => {
 
 Providers simple way to render anything, change `@Inputs` and `@Outputs` of testing component, directives etc.
 
-It returns `fixture` with a `point` property if a component class was passed.
+It returns `fixture` of type `MockedComponentFixture` (it extends `ComponentFixture`) with a `point` property if a component class was passed.
 The `fixture` belongs to the middle component for the render,
 when `fixture.point` points to the debugElement of the passed component.
 
-The best thing here is that `fixture.point.componentInstance` is typed to the component's class.
+Its type: `let fixture: <ComponentToRender> = MockRender(ComponentToRender)`.
+
+The best thing here is that `fixture.point.componentInstance` is typed to the component's class instead of any.
 
 If you want you can set providers for the render passing them via the 3rd parameter.
 It is useful if you want to mock system tokens / services such as APP_INITIALIZER, DOCUMENT etc.

lib/common/Mock.spec.ts

@@ -1,7 +1,13 @@
 /* tslint:disable: max-classes-per-file */
 
 import { Component, Directive, NgModule, Pipe, PipeTransform } from '@angular/core';
-import { Mock, MockComponent, MockControlValueAccessor, MockDirective, MockModule, MockPipe } from 'ng-mocks';
+
+import { MockComponent } from '../mock-component';
+import { MockDirective } from '../mock-directive';
+import { MockModule } from '../mock-module';
+import { MockPipe } from '../mock-pipe';
+
+import { Mock, MockControlValueAccessor } from './Mock';
 
 class ParentClass {
   protected parentValue = true;

lib/mock-component/mock-component.spec.ts

@@ -13,9 +13,10 @@ import {
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { By } from '@angular/platform-browser';
-import { MockedDirective, MockHelper } from 'ng-mocks';
 
 import { staticTrue } from '../../tests';
+import { MockedDirective } from '../mock-directive';
+import { MockHelper } from '../mock-helper';
 
 import { MockComponent, MockComponents, MockedComponent } from './mock-component';
 import { ChildComponent } from './test-components/child-component.component';

lib/mock-directive/mock-directive.spec.ts

@@ -16,11 +16,11 @@ import {
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormControl, FormControlDirective } from '@angular/forms';
 import { By } from '@angular/platform-browser';
-import { MockedDirective, MockHelper } from 'ng-mocks';
 
 import { staticFalse } from '../../tests';
+import { MockHelper } from '../mock-helper';
 
-import { MockDirective } from './mock-directive';
+import { MockDirective, MockedDirective } from './mock-directive';
 
 @Directive({
   exportAs: 'foo',

lib/mock-module/mock-module.spec.ts

@@ -5,8 +5,11 @@ import { Component } from '@angular/core';
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { BrowserModule, By } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
-import { MockComponent, MockModule, MockRender } from 'ng-mocks';
 
+import { MockComponent } from '../mock-component';
+import { MockRender } from '../mock-render';
+
+import { MockModule } from './mock-module';
 import {
   AppRoutingModule,
   CustomWithServiceComponent,

lib/mock-module/mock-module.ts

@@ -1,8 +1,10 @@
 import { CommonModule } from '@angular/common';
 import { ModuleWithProviders, NgModule, Provider, Type } from '@angular/core';
-import { Mock, MockDeclaration, MockOf, MockService } from 'ng-mocks';
 
+import { Mock, MockOf } from '../common';
 import { jitReflector, ngModuleResolver } from '../common/reflect';
+import { MockDeclaration } from '../mock-declaration';
+import { MockService } from '../mock-service';
 
 const cache = new Map<Type<any>, Type<any>>();
 

lib/mock-render/mock-render.spec.ts

@@ -5,7 +5,7 @@ import { By } from '@angular/platform-browser';
 
 import { MockService } from '../mock-service';
 
-import { MockRender } from './mock-render';
+import { MockedComponentFixture, MockRender } from './mock-render';
 import { RenderRealComponent } from './mock-render.fixtures';
 
 describe('MockRender', () => {
@@ -81,10 +81,13 @@ describe('MockRender', () => {
     expect(spy).toHaveBeenCalledWith(payload);
   });
 
-  it('does not return a pointer with a provided template', () => {
-    const fixture = MockRender(`<render-real-component></render-real-component>`);
+  it('returns a pointer with a provided template', () => {
+    const fixture: MockedComponentFixture<RenderRealComponent> = MockRender(
+      `<render-real-component></render-real-component>`
+    );
     // because template can include more than 1 component, be wrapped by any html element etc.
-    expect((fixture as any).point).toBeUndefined();
+    expect(fixture.point).toBeDefined();
+    expect(fixture.point.componentInstance).toEqual(jasmine.any(RenderRealComponent));
   });
 
   it('returns pointer with a provided component', () => {

lib/mock-render/mock-render.ts

@@ -35,31 +35,34 @@ export interface IMockRenderOptions {
   providers?: Provider[];
 }
 
+// tslint:disable-next-line:interface-name
+export interface MockedComponentFixture<C = any, F = undefined> extends ComponentFixture<F> {
+  point: DebugElementType<C>;
+}
+
 function MockRender<MComponent, TComponent extends { [key: string]: any }>(
   template: Type<MComponent>,
   params: TComponent,
   detectChanges?: boolean | IMockRenderOptions
-): ComponentFixture<TComponent> & { point: DebugElementType<MComponent> };
+): MockedComponentFixture<MComponent, TComponent>;
 
 // without params we shouldn't autocomplete any keys of any types.
-function MockRender<MComponent>(
-  template: Type<MComponent>
-): ComponentFixture<null> & { point: DebugElementType<MComponent> };
+function MockRender<MComponent>(template: Type<MComponent>): MockedComponentFixture<MComponent>;
 
 function MockRender<MComponent, TComponent extends { [key: string]: any }>(
   template: string,
   params: TComponent,
   detectChanges?: boolean | IMockRenderOptions
-): ComponentFixture<TComponent>;
+): MockedComponentFixture<any, TComponent>;
 
 // without params we shouldn't autocomplete any keys of any types.
-function MockRender<MComponent>(template: string): ComponentFixture<null>;
+function MockRender<MComponent>(template: string): MockedComponentFixture;
 
 function MockRender<MComponent, TComponent extends { [key: string]: any }>(
   template: string | Type<MComponent>,
   params?: TComponent,
   flags: boolean | IMockRenderOptions = true
-): ComponentFixture<TComponent> {
+): MockedComponentFixture<MComponent, TComponent> {
   const flagsObject: IMockRenderOptions = typeof flags === 'boolean' ? { detectChanges: flags } : flags;
 
   let mockedTemplate = '';
@@ -119,9 +122,7 @@ function MockRender<MComponent, TComponent extends { [key: string]: any }>(
     fixture.detectChanges();
   }
 
-  if (typeof template !== 'string') {
-    fixture.point = fixture.debugElement.children[0];
-  }
+  fixture.point = fixture.debugElement.children[0];
   return fixture;
 }
 

lib/mock-service/mock-service.spec.ts

@@ -1,5 +1,8 @@
 import { InjectionToken } from '@angular/core';
-import { MockHelper, MockService } from 'ng-mocks';
+
+import { MockHelper } from '../mock-helper';
+
+import { MockService } from './mock-service';
 
 // tslint:disable:max-classes-per-file
 class DeepParentClass {