Question

我有一个测试，需要从react redux中模拟useSelector，现在，当我完成这些工作时，我遇到一个问题，即渲染总是返回一个未定义的问题，这些发生在创建redux的模拟-> useSelector之后。

jest.mock('react-redux', () => ({
  useSelector: jest.fn(fn => fn()),
  useDispatch: () => jest.fn(),
}));

当我实现这些时会出现错误：

const wrapper = render

渲染->未定义

元素类型无效：预期为字符串（对于内置组件）或类/函数（用于复合组件），但得到：未定义。您可能忘记了从定义文件中导出组件，否则您可能混淆了默认导入和命名导入。

我在此行中收到此错误：

  const wrapper = render(
    <Provider store={store}>
      <BrowserRouter>
        <EventsList></EventsList>
      </BrowserRouter>
    </Provider>
  );

当我调试这些而没有玩笑的jest.mock('react-redux', ...时工作正常。

但还有另一个错误：

选择存储状态时发生错误：无法读取属性“数据”未定义。

在要测试的组件中，我创建一个列表，并使用useSelector和useDispatch获取此Redux存储列表。这些是我的测试完成的。

jest.mock('react-redux', () => ({
  useSelector: jest.fn(fn => fn()),
  useDispatch: () => jest.fn(),
}));

afterEach(cleanup);

describe('<EventList />', () => {
  afterEach(() => {
    jest.clearAllMocks();
  });

  afterAll(() => {
    jest.restoreAllMocks();
  });

  const mockStore = configureStore([]);
  const events: Array<IEvent> = [
    {
      title: 'Evento de prueba 1',
      description: '<p>Evento de prueba 1</p>',
      venue: 'Lab 2 Jalasoft La paz',
      date: new Date(),
      booking: false,
      typeEvent: eventType.online,
      state: 'PUBLISHED',
      url: '',
      ownerId: '5e4d74a2a258adb30001962f80',
      id: '5e4e91a3c3145e0ds0016100e6',
    },
    {
      title: 'Evento de prueba 2',
      description: '<p>Evento de prueba 2</p>',
      venue: 'Lab 2 Jalasoft La paz',
      date: new Date(),
      booking: false,
      typeEvent: eventType.online,
      state: 'PUBLISHED',
      url: '',
      ownerId: '5e4d74a2a258b30001962f80',
      id: '5e4e91a3c3145e00016100e6',
    },
  ];

  const store = mockStore((state: any) => {
    return {
      data: events,
      loading: false,
      error: false,
    };
  });

  const wrapper = render(
    <Provider store={store}>
      <BrowserRouter>
        <EventsList></EventsList>
      </BrowserRouter>
    </Provider>
  );

  test('descripv', () => {
    expect(wrapper.getByRole(/form/i)).toBeInTheDocument;
  });
});

反应测试librarie模拟useSelector redux错误

0 个答案: