Фермент имитирует событие нажатия, которое делает вызовы API не работающими - PullRequest
Новая
       36

Фермент имитирует событие нажатия, которое делает вызовы API не работающими

0 голосов
/ 26 мая 2018

В одном из моих проектов, React-Instagram-Clone-2.0 , я добавил функцию, позволяющую пользователям добавлять других пользователей в избранное.

У меня есть тест, которыйимитирует событие нажатия кнопки, которая отправляет запрос POST и добавляет пользователя в избранное.Но он не достигает сервера и тест всегда проходит.

Вот код.

Add-to-favourites.js 

const AddToFavourites = ({ user, username }) => {

let add = e => {
  e.preventDefault()
  addToFavourites(user)   // util function
  new d('.af_btn').blur()
}

return (
  <div>
    <div className='recomm_teaser'>
      <span>Wanna add {username} to your favourites list.</span>
      <SecondaryButton
        label='Add'
        onClick={add}
      />
    </div>
  </div>
)
}

функция addToFavourites 

export const addToFavourites = async user => {
  let {
    data: { success, mssg }
  } = await post('/api/add-to-favourites', { user }) // POST request

  if (success) {
    insta_notify({
      to: user,
      type: 'favourites'
    })
  }

  console.log('Test debugging')  // Never logged
  // But I remove the request, The above message is logged out.
  Notify({ value: mssg })
  }

И мой тестовый файл 

describe('AddToFavourites Component', () => {

const comp = (
  <AddToFavourites
    user={7}
    username='ghalib'
  />
)

it('should match snapshot', () => {
  const tree = create(comp).toJSON()
  expect(tree).toMatchSnapshot()
})

it('should add user to favs when clicked', () => {
  const wrapper = mount(comp)

  wrapper.find('SecondaryButton').simulate(
    'click',
    { preventDefault() {} }
  )

  expect(true).toBe(true)
 })

})

Любое решение?

Thnx взаранее:)

1 Ответ

0 голосов
/ 28 ноября 2018

Я видел несколько проблем в вашем коде.Первая проблема - вы используете асинхронный метод.Поэтому весьма вероятно, что тест завершится до того, как вызов API будет решен.Вы можете исправить это с помощью setTimeout: 

it('should add user to favs when clicked', () => {
  const wrapper = mount(comp)

  wrapper.find('SecondaryButton').simulate(
    'click',
    { preventDefault() {} }
  )

  setTimeout(() => console.log("I'm dirty js hack"), 4500)

  expect(true).toBe(true)
 })

})

Здесь используется 4500 мс из-за внутреннего ограничения Jest на 5000 мс.Но вы можете расширить его настройками, так что вы увидите вторую проблему.

Это ваш относительный путь к API.Я не думаю, что Jest работает на localhost, поэтому вы не сможете добраться до сервера.Вам нужно будет смоделировать запрос к серверу, но я думаю, что он описан в документации .Хотя я думаю, что вы не сможете избежать setTimeout, потому что вызов API выполняется внутри.

...