ng-mocks 13.4.2 → 13.5.2

package/README.md

@@ -71,14 +71,6 @@ An example of a spec for a profile edit component.
 // In the following test suite, we would like to
 // cover behavior of the component.
 describe('profile:classic', () => {
-  // First of all, we would like to reuse the same
-  // TestBed in every test.
-  // ngMocks.faster suppresses reset of TestBed
-  // after each test and allows to use TestBed,
-  // MockBuilder and MockRender in beforeAll.
-  // https://ng-mocks.sudo.eu/api/ngMocks/faster
-  ngMocks.faster();
-
   // Helps to reset customizations after each test.
   MockInstance.scope();
 

package/examples/MockForms/test.spec.ts

@@ -31,12 +31,7 @@ class DependencyComponent implements ControlValueAccessor {
 
 @Component({
   selector: 'tested',
-  template: `
-    <app-child
-      [ngModel]="value"
-      (ngModelChange)="value = $event"
-    ></app-child>
-  `,
+  template: ` <app-child [(ngModel)]="value"></app-child> `,
 })
 class TestedComponent {
   public value: any;
@@ -67,9 +62,12 @@ describe('MockForms', () => {
     MockInstance(DependencyComponent, 'writeValue', writeValue);
 
     const fixture = MockRender(TestedComponent);
+    // FormsModule needs fixture.whenStable()
+    // right after MockRender to install all hooks.
+    await fixture.whenStable();
     const component = fixture.point.componentInstance;
 
-    // During initialization it should be called
+    // During initialization, it should be called
     // with null.
     expect(writeValue).toHaveBeenCalledWith(null);
 
@@ -77,12 +75,12 @@ describe('MockForms', () => {
     // and simulate its change, like a user does it.
     const mockControlEl = ngMocks.find(DependencyComponent);
     ngMocks.change(mockControlEl, 'foo');
-    await fixture.whenStable();
     expect(component.value).toBe('foo');
 
     // Let's check that change on existing value
     // causes calls of `writeValue` on the mock component.
     component.value = 'bar';
+    // Both below are needed to trigger writeValue.
     fixture.detectChanges();
     await fixture.whenStable();
     expect(writeValue).toHaveBeenCalledWith('bar');

package/examples/TestHttpInterceptor/test.spec.ts

@@ -18,6 +18,7 @@ import {
   MockBuilder,
   MockRender,
   NG_MOCKS_INTERCEPTORS,
+  ngMocks,
 } from 'ng-mocks';
 
 // An interceptor we want to test.
@@ -92,13 +93,13 @@ describe('TestHttpInterceptor', () => {
   });
 
   it('triggers interceptor', () => {
-    const fixture = MockRender('');
-    const client: HttpClient =
-      fixture.debugElement.injector.get(HttpClient);
-    const httpMock: HttpTestingController =
-      fixture.debugElement.injector.get(HttpTestingController);
+    MockRender();
 
-    // Let's do a simply request.
+    // Let's extract the service and http controller for testing.
+    const client = ngMocks.findInstance(HttpClient);
+    const httpMock = ngMocks.findInstance(HttpTestingController);
+
+    // Let's do a simple request.
     client.get('/target').subscribe();
 
     // Now we can assert that a header has been added to the request.

package/examples/TestHttpRequest/test.spec.ts

@@ -6,7 +6,7 @@ import {
 import { Injectable, NgModule } from '@angular/core';
 import { Observable } from 'rxjs';
 
-import { MockBuilder, MockRender } from 'ng-mocks';
+import { MockBuilder, MockRender, ngMocks } from 'ng-mocks';
 
 // A service that does http requests.
 @Injectable()
@@ -39,12 +39,11 @@ describe('TestHttpRequest', () => {
   });
 
   it('sends a request', () => {
-    const fixture = MockRender('');
+    MockRender();
+
     // Let's extract the service and http controller for testing.
-    const service: TargetService =
-      fixture.debugElement.injector.get(TargetService);
-    const httpMock: HttpTestingController =
-      fixture.debugElement.injector.get(HttpTestingController);
+    const service = ngMocks.findInstance(TargetService);
+    const httpMock = ngMocks.findInstance(HttpTestingController);
 
     // A simple subscription to check what the service returns.
     let actual: any;

package/examples/TestLifecycleHooks/test.spec.ts

@@ -100,7 +100,7 @@ describe('TestLifecycleHooks', () => {
     const service: TargetService =
       fixture.debugElement.injector.get(TargetService);
 
-    // By default nothing should be initialized.
+    // By default, nothing should be initialized.
     expect(service.onChanges).toHaveBeenCalledTimes(0);
 
     // Now let's render the component.

package/examples/TestPipe/test.spec.ts

@@ -28,15 +28,15 @@ describe('TestPipe', () => {
   beforeEach(() => MockBuilder(TargetPipe));
 
   it('sorts strings', () => {
-    const fixture = MockRender('{{ values | target}}', {
-      values: ['1', '3', '2'],
+    const fixture = MockRender(TargetPipe, {
+      $implicit: ['1', '3', '2'],
     });
 
     expect(fixture.nativeElement.innerHTML).toEqual('1, 2, 3');
   });
 
   it('reverses strings on param', () => {
-    const fixture = MockRender('{{ values | target:flag}}', {
+    const fixture = MockRender('{{ values | target:flag }}', {
       flag: false,
       values: ['1', '3', '2'],
     });

package/examples/readme/builder.spec.ts

@@ -26,9 +26,9 @@ export const EMPTY = new Subject<any>();
 EMPTY.complete();
 
 interface User {
-  email: string;
-  firstName: string;
-  lastName: string;
+  email?: string | null;
+  firstName?: string | null;
+  lastName?: string | null;
 }
 
 @Injectable()
@@ -56,9 +56,9 @@ class StorageService {
 })
 class ProfileComponent implements OnInit {
   public readonly form = new FormGroup({
-    email: new FormControl(null, Validators.required),
-    firstName: new FormControl(null, Validators.required),
-    lastName: new FormControl(null, Validators.required),
+    email: new FormControl('', Validators.required),
+    firstName: new FormControl('', Validators.required),
+    lastName: new FormControl('', Validators.required),
   });
 
   @Input() public readonly profile: User | null = null;
@@ -67,7 +67,7 @@ class ProfileComponent implements OnInit {
 
   public ngOnInit(): void {
     if (this.profile) {
-      this.form.setValue(this.profile);
+      this.form.patchValue(this.profile);
     }
   }
 

package/examples/readme/classic.spec.ts

@@ -28,9 +28,9 @@ export const EMPTY = new Subject<any>();
 EMPTY.complete();
 
 interface User {
-  email: string;
-  firstName: string;
-  lastName: string;
+  email?: string | null;
+  firstName?: string | null;
+  lastName?: string | null;
 }
 
 @Injectable()
@@ -58,9 +58,9 @@ class StorageService {
 })
 class ProfileComponent implements OnInit {
   public readonly form = new FormGroup({
-    email: new FormControl(null, Validators.required),
-    firstName: new FormControl(null, Validators.required),
-    lastName: new FormControl(null, Validators.required),
+    email: new FormControl('', Validators.required),
+    firstName: new FormControl('', Validators.required),
+    lastName: new FormControl('', Validators.required),
   });
 
   @Input() public readonly profile: User | null = null;
@@ -69,7 +69,7 @@ class ProfileComponent implements OnInit {
 
   public ngOnInit(): void {
     if (this.profile) {
-      this.form.setValue(this.profile);
+      this.form.patchValue(this.profile);
     }
   }
 
@@ -99,20 +99,12 @@ const assertion: any =
 // In the following test suite, we would like to
 // cover behavior of the component.
 describe('profile:classic', () => {
-  // First of all, we would like to reuse the same
-  // TestBed in every test.
-  // ngMocks.faster suppresses reset of TestBed
-  // after each test and allows to use TestBed,
-  // MockBuilder and MockRender in beforeAll.
-  // https://ng-mocks.sudo.eu/api/ngMocks/faster
-  ngMocks.faster();
-
   // Helps to reset customizations after each test.
   MockInstance.scope();
 
   // Let's declare TestBed in beforeAll instead of beforeEach.
   // The code mocks everything in SharedModule and provides a mock AuthService.
-  beforeAll(async () => {
+  beforeEach(async () => {
     return TestBed.configureTestingModule({
       imports: [
         MockModule(SharedModule), // mock