When you testing Component rendering, you often needs to call: fixture.detectChanges(); For example: it('should display original title', () => { fixture.detectChanges(); expect(el.textContent).toContain(comp.title); }); it('should display a different…
If sometime you want to log out the comonent html to see whether the html render correctly, you can do : import {TestBed, async, ComponentFixture} from '@angular/core/testing'; import {AppComponent} from './app.component'; import {AuFaInputComponent}…
In a proper unit test we want to isolate external dependencies as much as possible to guarantee a reliable test outcome. Http calls represent such external dependencies. Therefore, when testing our Angular components or services that rely on data ret…
When using Ngrx, we need to know how to test the component which has Router injected. Component: import {Component} from '@angular/core'; import {FormGroup} from '@angular/forms'; import {Store} from '@ngrx/store'; import * as fromAuth from '../../re…
import {ComponentFixture, TestBed} from '@angular/core/testing'; import {BrowserDynamicTestingModule, platformBrowserDynamicTesting} from '@angular/platform-browser-dynamic/testing'; import {StockCounterComponent} from './stock-counter.component'; Te…
import { Http, Response, ResponseOptions } from '@angular/http'; import { TestBed } from '@angular/core/testing'; import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing'; import { Observa…
import { TestBed, ComponentFixture } from '@angular/core/testing'; import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing'; import { FileSizePipe } from './file-size.pipe'; import {Compon…
The way to test router componet needs a little bit setup, first we need to create a "router-stubs.ts". This file is a helper file. // export for convenience. export { ActivatedRoute, Router, RouterLink, RouterOutlet} from '@angular/router'; impo…
// backend test beforeEach(inject(function (_$compile_, _$httpBackend_, _$rootScope_, _$state_, _AnnouncementsService_, _CONFIG_) { compile = _$compile_; $httpBackend = _$httpBackend_; $scope = _$rootScope_.$new(); AnnouncementsService = _Announcemen…
Both what "TestBed.get" & "injector" trying to do is get service for the test component. But there is some diffenece which determined when use which. Register the service:  You need to mock the service, not using the real service!…