1

我的 Angular 组件依赖于使用解析器服务设置数据参数的激活路由。对于我的单元测试，我喜欢模拟它，如下所示：

activatedRouteStub = { data: { subscribe: (fn: (value: Data) => void) => fn({ someObject: SomeObjectMock // hard coded JSON value }), } }; TestBed.configureTestingModule({ declarations: [SomeComponent], providers: [ { provide: ActivatedRoute, useValue: activatedRouteStub } ] }); route = fixture.debugElement.injector.get(ActivatedRoute);// where route is in an instance of ActivatedRoute that is injected into SomeComponent as a dependency

这对于依赖于activatedRoute 的这种行为的初始测试集很有效。但是现在，我需要更改实际返回的内容，基本上，我需要使用修改后的 SomeObjectMock 并将其设置为 someObject。

而且我对如何做到这一点缺乏想法，我尝试过以下操作：

route = { data: { subscribe: (fn: (value: Data) => void) => fn({ someObject: SomeObjectMock // hard coded JSON value }), } };

以前，当我对一个简单的服务进行存根时，这已经奏效了，更改方法的定义以返回不同的值是相当微不足道的。

任何建议/指针？

4

1 回答 1

2

听起来您想在测试过程中更改 ActivatedRoute.data 返回的数据。

我假设在你的被测组件中你有这样的东西：

this.route.data.subscribe(data => {
    // do something
})

ActivatedRoute.data 是一个 RxJS Observable，所以你需要创建一个 observable 来模拟它。

您可能永远不会想要覆盖 subscribe 方法。相反，您可能希望提供订阅者可以使用的正确数据。

我会做类似的事情： Observable vs Subject and asObservable

const myData = new Subject(); // import { Subject } from 'rxjs/Subject'; 

activatedRouteStub = {
     data: myData.asObservable()
    };
     TestBed.configureTestingModule({
      declarations: [SomeComponent],
      providers: [
        { provide: ActivatedRoute, useValue: activatedRouteStub }
      ]
    });
route = fixture.debugElement.injector.get(ActivatedRoute);

然后，您可以在希望更改返回的数据时调用 myData.next(data) ，如下所示：

const dataYouWantReturned = {};
myData.next(dataYouWantReturned)

祝你好运！

于 2018-06-04T18:15:47.010 回答