Приложение. js выдает ошибку теста относительно вызова ajax подкомпонента. - PullRequest
Новая
       12

Приложение. js выдает ошибку теста относительно вызова ajax подкомпонента.

0 голосов
/ 13 марта 2020

У меня есть приложение acreate реагирует, есть базовое приложение c. js и некоторые подкомпоненты, один из этих подкомпонентов делает запрос ajax на загрузку некоторых фильмов.

Я учусь для тестирования с реагирующей-библиотекой, и я добавил тест для компонента с запросом ajax. Так что эта часть проверена. Кроме того, я добавил тест для других компонентов.

Теперь последнее, что я хочу сделать, это приложение. js. Я был доволен проверкой, что он там есть, и он действительно работает sh, так как большая часть функциональности тестируется на других компонентах.

Итак, это мое приложение. js test: 

test('<App />', async  () => {
  const {debug, getByText, getByTestId} = render(<App />)
  expect(getByTestId('app')).toBeTruthy()
})

Но выдает ошибку относительно компонента MoviesList.js. В частности, о вызове ajax.

Как будто он хотел, чтобы я сделал то же самое, что я делал в тесте MoviesList.js, который выглядит следующим образом:

MoviesList.test.js:

// use fetch mock
global.fetch = require('jest-fetch-mock')

afterEach(() => {
  cleanup
  console.error.mockClear()
})

console.error = jest.fn()

const movies = {
  success: true,
  results: [
    {
      id: 'hi1',
      title: 'title1',
      poster_path: 'gfdsftg'
    },
    {
      id: 'hi2',
      title: 'title2',
      poster_path: 'gfdsftg'
    }
  ]
}


test('<MoviesList />', async  () => {
  fetch.mockResponseOnce(JSON.stringify(movies))
  const {getByTestId, queryByTestId, getAllByTestId} = render(
    <MemoryRouter>
      <MoviesList />
    </MemoryRouter>
  )
  expect(getByTestId('loading')).toBeTruthy()
  await waitForElement(() => getByTestId('movie-link'))
  expect(getByTestId('movie-grid').children).toHaveLength(movies.results.length) 
  expect(getAllByTestId('movie-link')).toHaveLength(movies.results.length) 
  expect(queryByTestId('loading')).toBeFalsy()
})

Итак, если я go добавлю смоделированный ответ в приложение. js, он перестанет жаловаться: 

global.fetch = require('jest-fetch-mock')

afterEach(() => {
  cleanup
})


const movies = {
  success: true,
  results: [
    {
      id: 'hi1',
      title: 'title1',
      poster_path: 'gfdsftg'
    },
    {
      id: 'hi2',
      title: 'title2',
      poster_path: 'gfdsftg'
    }
  ]
}

test('<App />', async  () => {
  fetch.mockResponseOnce(JSON.stringify(movies))
  const {debug, getByText, getByTestId} = render(<App />)
  expect(getByTestId('app')).toBeTruthy()
})

Мой вопрос: правильно ли добавить еще раз? то же самое про насмешливый ответ в App.test.js. Кажется неправильным иметь этот лог c дважды один раз в App.test.js, а также в MoviesList.test.js

...