React testing library-涉及redux的组件测试用例时报错解决

565 阅读1分钟

1、包含redux代码的组件的正常编写单元测试时会报错,需被一个Provider包裹 报错:Uncaught [Error: could not find react-redux context value; please ensure the component is wrapped in a ] image.png 2、解决:重写render方法,参考网址(redux.js.org/usage/writi…

import React from 'react';
import { render as rtlRender } from '@testing-library/react';
import { Provider } from 'react-redux';
import { createStore } from 'redux';

/**
 * @Description:  redux组件包裹provide-重写render方法
 * @param ui compoment - 组件
 * @param initialState object 初始state
 * @param reducer function 需要用到的reducer
 * @author: XuLijuan
 */
function render(ui, { initialState = {}, reducer = (state) => state, ...renderOptions } = {}) {
  const store = createStore(reducer, initialState);
  function Wrapper({ children }) {
    return <Provider store={store}>{children}</Provider>;
  }
  return rtlRender(ui, { wrapper: Wrapper, ...renderOptions });
}
export default render;