Typescript Angular测试如何防止ngOnInit调用直接测试方法

上下文

我有一个组件.在它内部，ngOnInit函数调用组件的另一个函数来检索用户列表.我想做两个系列的TET:

• 首先测试ngOnInit是否正确触发，并填充用户列表
• 第二次我想测试我的刷新函数，它也调用getUserList()

第一个测试是ngOnInit触发器，当我调用fixture时.detectChanges()工作正常.

问题

我的问题是在测试刷新功能时:只要我调用fixture.detectChanges()，ngOnInit被触发，然后我无法知道我的结果来自哪里，以及我的refresh()函数是否会被正确测试.

Is there any way, before my second series of tests on 100 method, to "delete" or "block" the 101 so it's not called on 102?

我试着看override组成部分，但似乎它不允许删除ngOnInit().

Or is there any way to detect changes other than using 100 in my case?

密码

下面是组件、存根服务和我的规范文件的代码.

组成部分

import { 组成部分, OnInit, ViewContainerRef } from '@angular/core';

import { UserManagementService } from '../../shared/services/global.api';
import { UserListItem组成部分 } from './user-list-item.component';

@组成部分({
  selector: 'app-user-list',
  templateUrl: './user-list.component.html'
})
export class UserList组成部分 implements OnInit {
  public userList = [];

  constructor(
    private _userManagementService: UserManagementService,    
  ) { }

  ngOnInit() {
    this.getUserList();
  }

  onRefreshUserList() {
    this.getUserList();
  }

  getUserList(notifyWhenComplete = false) {
    this._userManagementService.getListUsers().subscribe(
      result => {
        this.userList = result.objects;
      },
      error => {
        console.error(error);        
      },
      () => {
        if (notifyWhenComplete) {
          console.info('Notification');
        }
      }
    );
  }
}

组成部分 spec file

import { NO_ERRORS_SCHEMA } from '@angular/core';
import {
  async,
  fakeAsync,
  组成部分Fixture,
  TestBed,
  tick,
  inject
} from '@angular/core/testing';

import { Observable } from 'rxjs/Observable';

// 组成部分s
import { UserList组成部分 } from './user-list.component';

// Services
import { UserManagementService } from '../../shared/services/global.api';
import { UserManagementServiceStub } from '../../testing/services/global.api.stub';

let comp:    UserList组成部分;
let fixture: 组成部分Fixture<UserList组成部分>;
let service: UserManagementService;

describe('UserList组成部分', () => {
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [UserList组成部分],
      imports: [],
      providers: [
        {
          provide: UserManagementService,
          useClass: UserManagementServiceStub
        }
      ],
      schemas: [ NO_ERRORS_SCHEMA ]
    })
    .compile组成部分s();
  }));

  tests();
});

function tests() {
  beforeEach(() => {
    fixture = TestBed.create组成部分(UserList组成部分);
    comp = fixture.componentInstance;

    service = TestBed.get(UserManagementService);
  });

  it(`should be initialized`, () => {
    expect(fixture).toBeDefined();
    expect(comp).toBeDefined();
  });

  it(`should NOT have any user in list before ngOnInit`, () => {
    expect(comp.userList.length).toBe(0, 'user list is empty before init');
  });

  it(`should get the user List after ngOnInit`, async(() => {
    fixture.detectChanges(); // This triggers the ngOnInit and thus the getUserList() method

    // Works perfectly. ngOnInit was triggered and my list is OK
    expect(comp.userList.length).toBe(3, 'user list exists after init');
  }));

  it(`should get the user List via refresh function`, fakeAsync(() => {
    comp.onRefreshUserList(); // Can be commented, the test will pass because of ngOnInit trigger
    tick();

    // This triggers the ngOnInit which ALSO call getUserList()
    // so my result can come from getUserList() method called from both source: onRefreshUserList() AND through ngOnInit().
    fixture.detectChanges(); 

    // If I comment the first line, the expectation is met because ngOnInit was triggered!    
    expect(comp.userList.length).toBe(3, 'user list after function call');
  }));
}

存根服务(如果需要)

import { Observable } from 'rxjs/Observable';

export class UserManagementServiceStub {
  getListUsers() {
    return Observable.from([      
      {
        count: 3, 
        objects: 
        [
          {
            id: "7f5a6610-f59b-4cd7-b649-1ea3cf72347f",
            name: "user 1",
            group: "any"
          },
          {
            id: "d6f54c29-810e-43d8-8083-0712d1c412a3",
            name: "user 2",
            group: "any"
          },
          {
            id: "2874f506-009a-4af8-8ca5-f6e6ba1824cb", 
            name: "user 3",
            group: "any"
          }
        ]
      }
    ]);
  }
}

我的审判

我try 了一些"变通方法"，但我发现有点....长篇大论，也许是矫枉过正！

例如:

it(`should get the user List via refresh function`, fakeAsync(() => {
    expect(comp.userList.length).toBe(0, 'user list must be empty');

    // Here ngOnInit is called, so I override the result from onInit
    fixture.detectChanges();
    expect(comp.userList.length).toBe(3, 'ngOnInit');

    comp.userList = [];
    fixture.detectChanges();
    expect(comp.userList.length).toBe(0, 'ngOnInit');

    // Then call the refresh function
    comp.onRefreshUserList(true);
    tick();
    fixture.detectChanges();

    expect(comp.userList.length).toBe(3, 'user list after function call');
}));