reactjs - 用 enzyme 测试链接

Question

我正在尝试使用 Enzyme 测试组件，但收到以下错误:

Warning: Failed context type: The context `history` is marked as required in `Link`, but its value is `undefined`.
        in Link (at UserTable.js:30)
        in button (created by Button)
        in Button (at UserTable.js:29)
        in td (at UserTable.js:28)
        in tr (at UserTable.js:24)
        in tbody (at UserTable.js:43)
        in table (created by Table)
        in Table (at UserTable.js:41)
        in UserTable (at UserTable.test.js:19)

这是我的测试:

import React from 'react';
import { render } from 'enzyme';
import { fromJS } from 'immutable';
import { Table } from 'react-bootstrap';
import UserTable from '../UserTable';

const users = fromJS([{
    id: 2026429,
    login: 'rahulthewall',
    avatar_url: 'https://avatars1.githubusercontent.com/u/2026429?v=3',
    login: 'rahulthewall',
    html_url: 'https://github.com/rahulthewall',
}]);

describe('<UserTable />', () => {
    // Prepare the components
    const context = { router: { isActive: (a, b) => true } };
    const wrapper = render(
        <UserTable users={users} />,
        { context }
    );
    const table = wrapper.find('table');
    const thead = table.find('thead');
    const tbody = table.find('tbody');
    const headerRow = thead.find('tr');
    const bodyRows = tbody.find('tr');

    it('renders the table header', () => {
    expect(headerRow.length).toEqual(1);
        expect(headerRow.find('th').length).toEqual(4);
  });

    it('renders the table data', () => {
        expect(bodyRows.length).toEqual(1);
        expect(bodyRows.find('td').length).toEqual(4);
    });
});

所以我的问题是，渲染时如何将历史上下文传递给组件？我有点迷失在这里。

Answer 1

这是由于没有Router引起的。如果你用 <MemoryRouter> 包装你的组件喜欢````

<MemoryRouter>
    <ComponentClass/>
</MemoryRouter>

```

它应该可以解决问题。值得创建帮助程序来处理这个问题，因为它会在您的所有情况下发生(至少是与路由器 v4 相关的情况)。