reactjs - 如何在 Cypress 测试中公开/访问像 Redux 这样的数据存储？

Question

Cypress docs说你可以

Expose data stores (like in Redux) so you can programmatically alter the state of your application directly from your test code.

我还观看了 Kent C. Dodds 先生的测试类(class)，他提到可以使用 Cypress 中的现有数据初始化 redux 存储(不确定是在测试之前还是在测试中)

我浏览了几乎所有的文档并进行了谷歌搜索，除了在介绍页面上被提及为主要区别之一之外，我找不到任何实际执行此操作的引用或示例。

如果可能的话，如何实现这样的目标？

我感兴趣的案例是端到端的测试:

• 首先，我会将我的身份验证/登录功能作为标准 E2E 测试进行测试
• 然后为了测试应用程序的其他部分，我会添加一个 Cypress 命令，它会在我需要登录时直接进行 auth 调用并根据响应设置存储(注销时也是如此)，而不是手动输入凭据并单击登录(这可能是我最终要做的)

这可能不是最好的用例(甚至不是一个好的用例)，但我敢肯定还有其他情况，至少用一些数据初始化你的 redux 状态会非常方便。

谢谢!

Answer 1

根据关于 Vuex 的答案，我这样做了，效果很好:

// after createStore(...)
if (window.Cypress) {
  window.__store__ = store;
}

// in cypress tests
cy.window().should('have.property', '__store__');
cy.window().its('__store__')
  .then(
    store => store.dispatch({ type: 'UPDATE_CURRENT_PROFILE' })
  );

在对商店进行任何操作之前不要忘记cy.visit('anyRoute')，这样当您尝试访问它时，React 应用程序已启动并且 redux 商店已经创建。