5

我们最近开始使用 Cypress 通过 Angular 6 UI 进行 E2E 测试。事实证明它很棒，而且在我们看来，它比 Protractor 好用得多。

我们的计划是模拟与服务器的所有交互。对于使用 cy.route() 和固定装置的所有 REST/XHR 调用来说，这很容易。

但是，我们也使用网络套接字。事实证明，嘲笑与它的交互并不是那么容易。

从我目前所做的研究来看，我能找到的唯一建议是使用 cy.stub()。原则上这听起来不错，但我找不到任何详细说明，理想情况下有一些使用它来模拟网络套接字的例子。

我认为可能有效的另一种方法是使用 Angular 的 TestBed 服务。注入我们自己的服务来处理我们与 Web 套接字的交互。

但是，其中任何一条都是正确的路线吗？任何人都可以提供任何应该完成的最佳方式的例子吗？

任何让我朝着正确的方向前进以帮助我开始的指示将不胜感激。谢谢。

4

2 回答 2

1

我在工作中遇到了类似的问题，最终得到了与您类似的解决方案（我认为）。

我们的应用程序依赖于另一个库，它做一些网络工作。我没有使用 TestBed 或类似工具，而是使用 Angular 的环境文件为 e2e 测试提供不同的服务，该服务遵循与真实服务相同的接口。

然后在存根服务（返回固定数据）中，我在窗口对象上公开了用于在运行时与存根交互的方法，以使其返回不同的数据等。

我已经发表了一篇博文，解释了这种方法以及提交。

http://wtfisanapi.com/htf-do-i-write-e2e-tests-with-a-stubbed-dependency-angular-nrwl-nx-edition/

完整代码可以在这里找到https://github.com/robt1019/e2e-stub-demo

您的解决方案对您有何影响？

于 2019-04-28T22:30:43.170 回答
0

在玩了这么多之后，我终于想出了自己的解决方案。本质上，这来自使用 ng.probe()。

特别是对于赛普拉斯，对 ng 的访问是通过 cy.window() 函数获得的，例如：

cy.window().then((win: any) => {
    const ngComponent = win.ng.probe(win.document.getElementsByTagName("component-name")[0].componentInstance;
    const myService = ngComponent.myService;
    myService.doSomething();
});

请注意，您通过首先获取注入该服务的组件的句柄来获得服务。在我的例子中，我所追求的服务被注入到 app-root 组件中，所以我得到了一个处理，然后我想要调用或模拟我的测试的 websocket 服务。

于 2018-07-17T09:55:58.893 回答