angular4-testing/project-manager/src/app/login/login.component.spec.ts

import {TestBed} from "@angular/core/testing";
import {LoginComponent} from "./login.component";
import {RouterTestingModule} from "@angular/router/testing";
import {LoginService} from "../services/login-service/login-service";
import {FormsModule} from "@angular/forms";
import {MockLoginService} from "../mocks/mock-login-service";
import Spy = jasmine.Spy;

/**
 * Test für die LoginComponent Klasse
 * für Formulareingabe und Service Interaktion
 *
 * @author FHartwich
 */
describe('Login Component UI Driven Form Test with Spy', () => {

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [FormsModule, RouterTestingModule.withRoutes([])],
      declarations: [LoginComponent],
      providers: [
        {provide: LoginService, useClass: MockLoginService}
      ],
    })
  });


  it('should be possible to request login', () => {
    const inputUser = 'testuser';
    const inputPass = 'testpass';

    const loginFixture = TestBed.createComponent(LoginComponent);
    const loginInstance = loginFixture.componentInstance;
    const loginElement = loginFixture.nativeElement;
    loginFixture.autoDetectChanges(true);

    // Login ausfuellen und absenden

    let service = loginFixture.debugElement.injector.get(LoginService);
    // Spy anmelden, die eigentliche Methode wird nicht mehr aufgerufen
    const spy = spyOn(service, 'login');

    // Formular Eingabe
    loginElement.querySelector('div /deep/ div > #inputEmail').value = inputUser;
    loginElement.querySelector('div /deep/ div > #inputPassword').value = inputPass;
    // Trigger Submit - nicht möglich über click() oder HTTPNode submit()
    // daher in Comp '@ViewChild(NgForm)' benoetigt
    loginInstance.form.ngSubmit.emit();

    // Spy auswerten
    expect(spy).toHaveBeenCalledWith(inputUser, inputPass);
  });

});