Javascript 如何为服务的订阅回调编写单元测试

我正在学习如何用Angular编写单元测试。 我创建了一个具有方法sendToServer的httpService。每个组件都使用它向服务器发送请求：

sendToServer(method, url, body, header, onSuccessCallback, onErrorCallback?);

这是我的组件

export class LoginComponent implements OnInit {

  constructor(private http: HttpService) {
   }
   data ;

  ngOnInit() {
    this.getToken();
  }

  getToken(){
    this.http.sendToServer("GET", "/api/tokent",{}, null, data=>{
      this.data = data;
    });
  }

}

以下是我的单元测试代码：

it("should call getTokent and return data", fakeAsync(() => {
    const response = "abc";
    component.getToken();
    spyOn(service, 'sendToServer').and.returnValue(of(response));
    tick(); 

    fixture.detectChanges();

    expect(component.data).toEqual(response);
  }));

---

如何在http.senntoServer的回调函数中进行测试

您需要在模拟数据服务中触发回调函数，而不是返回固定值。使用

returnValue

顾名思义，如果调用该方法而不执行其他操作，则返回该值

在您的情况下，您希望使用的是

callFake

，然后在该假函数中可以触发回调

组件规格ts

it('test callback', () => {
  spyOn(TestBed.get(DataService), 'sendToServer').and.callFake((parm1: string, param2: string, param3: any, param4: any, callback: (data) => {}) => {
        callback('DATA_RESULT');
  })
  fixture.detectChanges();
  expect(component.data).toEqual('DATA_RESULT');
});

---

下面是一个。

通过监视sendToServer调用，实际函数不会被执行，而是返回一个可观察值，它会立即发出响应字符串。所以你的回调永远不会执行。您可能可以使用

spyOn（服务，'sendToServer'）。和.callFake（…）

来实际触发回调函数。

spyOn（http，'sendToServer'）。和.callFake（（）=>{return of（“data”）；}）；guard1.getData（）；console.log（“数据”，guard1.permissions）它无法调用回调函数
getData（）{this.http.sendToServer（“GET”，API.ACCESS_PERMISSION，{}，null，data=>{this.permissions=data；this.aa（）；}）}