unit-testing - Jasmine/karma 测试用例没有使用 Angular5 有序运行

Question

使用 jasmine/karma 测试用例运行测试用例时。我面临一个问题，即在开始登录规范测试用例之前，其他规范文件都在完成登录之前被调用。它需要有条不紊地发生，就像

1.登录
2.仪表板 3.
订单
等

有没有办法做到这一点。

login.spec.ts 文件

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { RouterModule, Router } from '@angular/router';
import { LoginComponent } from './login.component';
import { DebugElement } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { BrowserModule, By } from '@angular/platform-browser';
import { Ng2Bs3ModalModule } from 'ng2-bs3-modal/ng2-bs3-modal';
import { RouterTestingModule } from '@angular/router/testing';
import { APP_BASE_HREF } from '@angular/common';
import { LoginService } from './login.service';
import { HttpClientModule } from '@angular/common/http';
import { ApiService } from '../config/api.service';
import { ConfigService } from '../config/config.service';
import { Constants } from '../config/Constant';
import { SharedService } from '../shared/shared.service';
import { Http, BaseRequestOptions, ResponseOptions, Response, RequestMethod } from '@angular/http';
import { inject } from '@angular/core/testing';
import { MockBackend, MockConnection } from '@angular/http/testing';

describe('LoginComponent', () => {
  let comp: LoginComponent;
  let fixture: ComponentFixture<LoginComponent>;
  let de: DebugElement;
  let el: HTMLElement;
  let userNameEl: DebugElement;
  let passwordEl: DebugElement;
  let submitEl: DebugElement;
  let loginService: LoginService = null;
  let backend: MockBackend = null;

  TestBed.overrideComponent(LoginComponent, {
    set: {
      providers: [
        {
          provide: LoginService,
          useValue: loginService
        },
        {
          provide: Router,
          useClass: class { navigate = jasmine.createSpy('navigate'); }
        }
      ]
    }
  });


  beforeEach(async(() => {
    // loginService = loginService;
    // backend = mockBackend;
    TestBed.configureTestingModule({
      declarations: [
        LoginComponent
      ],
      imports: [
        RouterModule.forRoot([{
          path: '',
          component: LoginComponent
        }]),
        BrowserModule,
        FormsModule,
        ReactiveFormsModule,
        Ng2Bs3ModalModule,
        RouterTestingModule,
        HttpClientModule
      ],
      providers: [
        MockBackend,
        BaseRequestOptions,
        {
          provide: Http,
          useFactory: (backendInstance: MockBackend, defaultOptions: BaseRequestOptions) => {
            return new Http(backendInstance, defaultOptions);
          },
          deps: [MockBackend, BaseRequestOptions]
        },
        LoginService,
        ApiService,
        ConfigService,
        Constants,
        SharedService,
        { provide: APP_BASE_HREF, useValue: '/' }
      ]
    }).compileComponents().then(() => {
      fixture = TestBed.createComponent(LoginComponent);
      comp = fixture.componentInstance;
      de = fixture.debugElement.query(By.css('form'));
      el = de.nativeElement;
      userNameEl = fixture.debugElement.query(By.css('input[id=InputEmail1]'));
      passwordEl = fixture.debugElement.query(By.css('input[id=InputPassword1]'));
      submitEl = fixture.debugElement.query(By.css('.login-btn'));
    });
  }));

  beforeEach(inject([LoginService, MockBackend], (Service: LoginService, mockBackend: MockBackend) => {
    loginService = Service;
    backend = mockBackend;
  }));


  it('should create', () => {
    expect(comp).toBeTruthy();
  });

  it('To check the initial value', () => {
    expect(comp.submitted).toBe(false);
    expect(comp.spinnerlogo).toBeFalsy();
    expect(comp.data).toEqual({});
  });

  it(`entering value in username and password input controls`, () => {
    userNameEl.nativeElement.value = 'admin';
    passwordEl.nativeElement.value = 'admin';
    fixture.detectChanges();
  });

  it('after entering value the button should enabled and click Action should happen', () => {
    expect(submitEl.nativeElement.disabled).toBeFalsy();
    const loginButtonSpy = spyOn(comp, 'onSubmit');
    submitEl.triggerEventHandler('click', null);
    expect(loginButtonSpy).toHaveBeenCalled();
  });

  it('calling onSubmit method after clicked the login button', () => {
    comp.submitted = true;
    comp.spinnerlogo = true;
    comp.errorDiagnostic = null;
    comp.mailerrorDiagnostic = null;
    expect(comp.submitted).toBeTruthy();
    expect(comp.spinnerlogo).toBeTruthy();
    expect(comp.errorDiagnostic).toBeNull();
    expect(comp.mailerrorDiagnostic).toBeNull();
  });

  it('#login should call endpoint and return it\'s result', (done) => {
    backend.connections.subscribe((connection: MockConnection) => {
      const options = new ResponseOptions({
        body: JSON.stringify({ success: true })
      });
      connection.mockRespond(new Response(options));

      // Check the request method
      expect(connection.request.method).toEqual(RequestMethod.Post);
      // Check the url
      expect(connection.request.url).toEqual('/auth/login');
      // Check the body
      // expect(connection.request.text())
      expect(connection.request.text()).toEqual(JSON.stringify({ username: 'admin', password: 'admin' }));
      // Check the request headers
      expect(connection.request.headers.get('Content-Type')).toEqual('application/json');
    });

    loginService.login('admin', 'admin')
      .subscribe((response) => {
        console.log('response values are ---####------------ ', response);
        // Check the response
        expect(response.user.username).toEqual('admin');
        expect(response.user.password).toEqual('admin');
        // set value in sessionStorage
        sessionStorage.setItem('currentUser', JSON.stringify(response));
        sessionStorage.setItem('token', JSON.stringify(response.token));
        sessionStorage.setItem('dismissOrders', 'false');

        done();
      },
        (error) => {
          expect(error).toThrowError();
        });
  });

});

主要问题是在执行上述文件之前。执行另一个规范文件

谢谢，基山

标签： unit-testingangular5karma-jasmine