Блог

Я хочу написать тест моментального снимка для своего Footer компонента, но он выдает ошибку: You should not use <Link> outside a <Router> . Вот мой код:

 import React from 'react'
import renderer from 'react-test-renderer'

import Footer from '../footer'

it('Footer renders correctly', () => {
    const tree = renderer
        .create(<Footer />)
        .toJSON()

    expect(tree).toMatchSnapshot()
})
  

Я знаю, что это происходит потому, что Footer компонент использует Link from react-router-dom . Чтобы решить эту проблему, я завернул Footer компонент в BrowserRouter :

 const tree = renderer
    .create(
        <BrowserRouter>
            <Footer />
        </BrowserRouter>
    )
    .toJSON()
  

но теперь он выдает ошибку: Browser history needs a DOM

Я использовал MemoryRouter вместо BrowserRouter , и это решило проблему.

 import React from 'react'
import { MemoryRouter } from 'react-router-dom'
import renderer from 'react-test-renderer'

import Footer from '../footer'

it('Footer renders correctly', () => {
const tree = renderer
    .create(
        <MemoryRouter>
            <Footer />
        </MemoryRouter>
    )
    .toJSON()

    expect(tree).toMatchSnapshot()
})