Question

我的Angular组件依赖使用一个使用解析器服务设置数据参数的activatedRoute。对于我的单元测试，我喜欢嘲笑这个，就像这样：

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 }), } };

这在以前用于存储简单服务时有用，更改方法的定义以返回不同的值是相当微不足道的。

有任何建议/指示吗？

Answer 1

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

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

Flux

ActivatedRoute.data是一个RxJS Observable，因此您需要创建一个observable来模拟它。

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

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

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

然后，只要您想要更改返回的数据，就可以调用myData.next（data），如下所示：

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);

祝你好运！

为Angular4单元测试更改模拟activatedRoute的值

1 个答案: