angular 中 router.events.subscribe 的單元測試

Question

我訂閱 router.events 來設置變量的值。 在我的名為 getLastUpdatedTime 的服務中使用。 我想為此編寫單元測試。 我的服務返回 object。

  lastUpdatedSubcription: Subscription;
  hours: string;
  days: string;

  constructor(
    public router: Router,
    public activatedRoute: ActivatedRoute,
    public utilService: UtilService) {
      this.routerEvent();
  }

 /**
  * @description Update the last updated hours in footer
  */
  routerEvent() {
    this.router.events.subscribe(event => {
      let page: string;
      if (event instanceof NavigationEnd) {
        if (event.urlAfterRedirects === '/account/region/detail' || event.urlAfterRedirects === '/account/currency/detail') {
          page = 'accountDetail';
        } else {
          page = 'account';
        }
        this.lastUpdatedSubcription = this.utilService.getLastUpdatedTime(url.getLastUpdatedTime, page)
          .subscribe((lastUpdatedTime: LastUpdatedTime) => {
            this.hours = lastUpdatedTime.hours;
            this.days = lastUpdatedTime.days;
          });
      }
    });
  }```

Answer 1

import { CommonModule } from '@angular/common';
import { HttpClientModule } from '@angular/common/http';
import { RouterTestingModule } from '@angular/router/testing';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

import { SharedModule } from 'src/app/shared/shared.module';
import { NavigationEnd, Router } from '@angular/router';
import { UtilService } from 'src/app/shared/services';
import { of, Observable } from 'rxjs';
import { ConsoleReporter } from 'jasmine';

fdescribe('NxAccountComponent', () => {
  let component: NxAccountComponent;
  let fixture: ComponentFixture<NxAccountComponent>;
  let util: UtilService;

  class MockRouter {
    public ne = new NavigationEnd(0, 'account/region/detail', '/account/region/detail');
    public events = new Observable(observer => {
      console.log('in class ob');
      observer.next(this.ne);
      observer.complete();
    });
  }


  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [NxAccountComponent],
      imports: [
        HttpClientModule,
        CommonModule,
        SharedModule,
        BrowserAnimationsModule,
        RouterTestingModule,
        NxAccountRoutingModule
      ],
      providers: [NxAccountService, UtilService,
        { provide: RouterTestingModule, useClass: MockRouter}]
    })
      .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(NxAccountComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
    util = TestBed.get(UtilService);
  });

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

  it('test', () => {
    const mockData = {
      hours: '1',
      days: '2'
    };
    spyOn(util, 'getLastUpdatedTime').and.returnValue(of(mockData));
    component.routerEvent();
    expect(component.hours).toEqual(mockData.hours);
  });
});