Testing history.goback с тестовой библиотекой и реагировать

Я пытаюсь проверить обратную навигацию в этом компоненте:

class BackMore extends Component {
  render() {
    return (
      <div className="backMore">
        <div className="back" onClick={ this.props.history.goBack } data-testid="go-back">
          <FontAwesomeIcon icon={faArrowLeft} />
        </div>
        <span className="title">{ this.props.title }</span>
        <More/>
      </div>)
  }
}

export default withRouter(BackMore)

я использую testing-libraryи рецепт со страницы https://testing-library.com/docs/example-react-router

// test utils file
function renderWithRouter(
  ui,
  {
    route = '/',
    history = createMemoryHistory({ initialEntries: [route] }),
  } = {}
) {
  const Wrapper = ({ children }) => (
    <Router history={history}>{children}</Router>
  )
  return {
    ...render(ui, { wrapper: Wrapper }),
    // adding `history` to the returned utilities to allow us
    // to reference it in our tests (just try to avoid using
    // this to test implementation details).
    history,
  }
}

И это мой тест:

test('Go back in the history', () =>{
  const browserHistory = createMemoryHistory()
  browserHistory.push('/my-learning');
  const { history } = RenderWithRouter(<BackMore />, { route: ['my-learning'], history: browserHistory });
  userEvent.click(screen.getByTestId(/go-back/i));
  expect(history.location.pathname).toBe('/')
})

В history.location.pathname переменная 'my-learning' и должна быть '/'

Что не так?

0 ответов

Другие вопросы по тегам