javascript - 如何测试商店单例?

标签 javascript reactjs react-native redux jestjs

我已经使用 redux-mock-store 实现单元测试。

我想在使用存储单例的 react native 应用程序上执行集成测试套件。然而,即使console.log达到了reducer函数(并且似乎工作正常)存储上的状态也没有改变。

// __tests__/things.js
jest.mock('../app/store')
import 'react-native'

import * as selectors from '../app/selectors'
import * as sagas from '../app/sagas'
import { store } from '../app/store'

describe('Things', () => {
  it('should toggle', async () => {
    const previousCounter = selectors.count()
    await sagas.increment()
    expect(store.getState().count).toEqual(previousCounter)
  })
})

同时模拟商店实现:

// __mocks__
import { createStore } from 'redux'
import rootReducer from '../reducers'
export const store = createStore(rootReducer, {})

编辑:示例 reducer

// app/reducers.js 
function rootReducer (state = { count: 0 }, action = {}) {
    const count = state.count + 1
    return { ...state, count }
}

一切都很好,但状态没有改变。如果我通过订阅商店来实现观察者,我会看到正在调度的操作系列。

最佳答案

我将回答我的问题,作为其他人研究这个诡辩的一种手段。

与许多其他教程和指南一样,不鼓励存储单例。我的理解是隔离依赖项和组件的问题。但是,如果您仍然决定像我们一样为了舒适而使用它,则需要在其他部门需要时模拟该组件,因为它们不会被递归地模拟。

因此,除了具有与此类似的文件夹结构之外的形式......

.
├── app
|    ├── __mocks__
|    |    |
|    |    └── store.js
|    └── store.js

对于那些同时需要“./store.js”的 deps,您需要导出模拟版本。

// app/store.js

// Choose mock dependency over current store for tests
if (process.env.NODE_ENV === 'test') {
  jest.mock('./store')
}

这样,每当测试期间需要 store.js 时,它都会递归地选择模拟版本而不是真实版本。

可能商店单例需要更多的宣传才能被选择作为主流的 redux 实践。不应被视为反模式。

关于javascript - 如何测试商店单例?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41566719/

相关文章:

objective-c - 将可选的 JSON 从 react-native 传递给 Swift

javascript - 带有 IE(用于延迟加载)问题的脚本 onload/onerror

javascript - 即使在外部或网页上的任何地方单击也隐藏菜单

javascript - 无法在React应用程序中运行puppeteer,找不到模块: Can't resolve 'ws' when compiling

reactjs - useEffect 渲染后不运行

javascript - 如何在嵌入 HTML 链接中添加 React 函数输出

javascript - 需要访问 React Native 中底部选项卡导航器中的状态以实现购物车徽章

javascript - 如何使用钩子(Hook)在 native react 中保存/下载生成二维码?

javascript - 为什么我的 getParentNode 函数返回未定义?

javascript - 服务器端 CSV 文件将其转换为 JavaScript 数组