Фермент `mount` не отображает элементы` Route` - PullRequest
0 голосов
/ 28 августа 2018

У меня есть этот упрощенный render() метод:

render() {
    return (
        <React.Fragment>
            <Router>
                <div>
                    <Route path='/abc' component={Test} />
                    <Route path='/def' render={() => (
                        <div>Hello</div>
                    )} />
                </div>
            </Router>
        </React.Fragment>
    )
}

И этот ферментный тест:

test('Render <Test> on /abc', () => {
    const wrapper = mount(
        <MemoryRouter initialEntries={['/abc']} >
            <App />
        </MemoryRouter>
    );
    console.log(wrapper.debug());
    expect(wrapper.find(Test)).to.have.lengthOf(1);
});

Однако mount() не выполняет рендеринг ни компонента Test на маршруте /abc, ни <div>Hello</div> на маршруте /def.

Вывод из console.log(wrapper.debug());:

  <MemoryRouter initialEntries={{...}}>
    <Router history={{...}}>
      <App>
        <BrowserRouter>
          <Router history={{...}}>
            <div>
              <Route path="/abc" component={[Function: Test]} />
              <Route path="/def" render={[Function: render]} />
            </div>
          </Router>
        </BrowserRouter>
      </App>
    </Router>
  </MemoryRouter>

Как проверить, что приложение будет отображать Test компонент на /abc маршруте?

1 Ответ

0 голосов
/ 28 августа 2018

Мне удалось найти решение моего издевательства над роутером:

import React from 'react';
const reactRouterDom = require('react-router-dom');

// Render plain div with children
reactRouterDom.BrowserRouter = ({children}) => <div>{children}</div>
module.exports = reactRouterDom;
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...