角度单元测试：未调用函数

Question

我正在尝试对我的服务进行单元测试，但似乎无法使其正常工作。这个概念是当setEmployees() 被一个空数组调用时，服务会从服务器获取员工。

服务

  setEmployees( employees : Employee[] ) {
    console.log("Setting employees...", employees)
    if (employees && employees.length) {
      this.employees.next(employees)
      this.storage.set('employees', employees);
    } else {
      this.getEmployees().subscribe()
    }
  }

  getEmployees() {
    console.log("getting employees...")
    let url = `${this.base_url}/employees`;
    return this.http.get<Employee[]>(url).pipe(
      tap(employees => {
        console.log("got em", employees)
        this.setEmployees(employees)
        this.storage.set('employees', employees)
      })
    )
  }

  returnEmployees() : IEmployee[] {
    return Object.assign([], this.employees.getValue())
  }

测试

it('should set employees correctly', fakeAsync(() => {
  let dummy = [{id: 1, name: 'Jeremy'}, {id: 2, name: 'Paige'}]
  spyOn(employeeService, 'getEmployees').and.returnValue(of(dummy));
  employeeService.setEmployees([]);
  tick();
  expect(employeeService.returnEmployees()).toEqual(dummy)
}))

测试响应

Expected $.length = 0 to equal 2.
Expected $[0] = undefined to equal Object({ id: 1, name: 'Jeremy' }).
Expected $[1] = undefined to equal Object({ id: 2, name: 'Paige' }).

还值得注意的是，console.log() 语句未按预期顺序出现。运行此测试时，我在控制台中看到以下内容：

getting employees...
Setting employees... []

...当我期望看到时：

Setting employees... []
getting employees...
got em [{id: 1, name: 'Jeremy'}, {id: 2, name: 'Paige'}]
Setting employees... [{id: 1, name: 'Jeremy'}, {id: 2, name: 'Paige'}]

显然有些东西没有按预期触发，但我不确定问题出在哪里。

Answer 1

异步函数的测试有一些问题，你的截图似乎容易受到其中一些的影响...... 我建议更标准地使用 Observables。并使用ReplaySubject 在服务中保留最新的员工数组值。类似的东西：

服务：

employees$ = new ReplaySubject<Employee[]>(); 

setEmployees( employees : Employee[] ) {
  if (employees && employees.length) {
    this.employees$.next(employees)
  } else {
    this.getEmployees()
  }
}

getEmployees() {
  let url = `${this.base_url}/employees`;
  return this.http.get<Employee[]>(url).pipe(take(1))
         .subscribe(employees => this.employees$.next(employees))
}

你的测试：

it('should set employees correctly', done => { // the 'done' helper function ensures necessary async callbacks are waited for
  let dummy = [{id: 1, name: 'Jeremy'}, {id: 2, name: 'Paige'}]

  employeeService.setEmployees(dummy)

  employeeService.employees$.subscribe(employees => {
    expect(employees).toEqual(dummy) // you might want to do a better element comparison here
    done()
  })
}))