Модульное тестирование React HashRouter с Jest - PullRequest
Новая
       5

Модульное тестирование React HashRouter с Jest

1 голос
/ 03 октября 2019

Я отчаянно пытаюсь провести модульное тестирование моих маршрутов HashRouter, но не могу понять, как. Мне удалось получить решение с использованием Enzyme, но я вынужден был использовать ReactTestingLibrary по технической инициативе.

Может ли кто-нибудь помочь указать мне правильное направление?

Компонент приложения 

import React, { Component } from 'react';
import { HashRouter } from 'react-router-dom'
import { create } from 'jss';
import { StylesProvider, jssPreset } from '@material-ui/styles';

import './App.css';
import Routes from './Routes';

class App extends Component {

  render() {
    return (
      <HashRouter>
        <Routes />                                      
      </HashRouter>
    );
  }
}

export default App;

Компоненты маршрутов 

import React, { Component } from 'react';
import { Route } from 'react-router-dom';
import { withRouter } from 'react-router';

import NetworksList from './pages/NetworksList';
import DealsList from './pages/DealsList';

class Routes extends Component {

  render() {
    return (
      <div>
        <Route path="/networks" component={NetworksList} />
        <Route path="/deals" component={DealsList} />
      </div>
    );
  }
}

export default withRouter(Routes);

Проверка компонентов приложения 

import React from 'react';
import App from './App';
import { render } from '@testing-library/react';
import { createMemoryHistory } from 'history'
import { Router } from 'react-router-dom'

import Routes from './Routes';


beforeEach(() => {
  jest.resetAllMocks();
});


it.only('should render networks list page at #/networks', () => {

  const history = createMemoryHistory()
  history.push('networks');

  const { container, getByText } = render(
    <Router history={history}>
      <Routes />
    </Router>
  )

});
...