Модульное тестирование React с использованием Socket.io - PullRequest
Новая
       69

Модульное тестирование React с использованием Socket.io

0 голосов
/ 20 июня 2020

Я пытаюсь выполнить модульное тестирование компонента реакции, который использует socket.io-client, но что-то не так. Я не могу понять, что это такое. Последняя тестовая строка не работает, но предыдущая работает. Лучше тест с интеграционным тестом? 

// App.js

import React, { useState, useEffect } from 'react'
import io from 'socket.io-client'

const App = () => {
  const [show, setShow] = useState(false)
  const socket = io("http://localhost:3001")

  useEffect(() => {
    socket.on('match-is-ready', (payload) => {
      setShow(true)
    })
  }, [])

  return (
    <div className="App">
      { show && <button data-testid='start-match'>Start Match</button> }
    </div>
  )
}

export default App

// App.spec.js
import React from 'react'
import { render } from '@testing-library/react'
import io from 'socket.io-client'
import MockedSocket from 'socket.io-mock'

import App from '@/App'

jest.mock('socket.io-client', () => {
  const socket = { on: jest.fn() }
  return jest.fn(() => socket)
})

describe(`<App/>`, () => {
  it(`should enable 'start match' button when it is ready`, async () => {
    let socket = new MockedSocket()
    const utils = render(<App/>)
    expect(utils.queryByTestId('start-match')).toBeFalsy()
    socket.emit('match-is-ready', 'player 2')
    expect(io.mock.results[0].value.on).toHaveBeenCalled()
    expect(utils.queryByTestId('start-match')).toBeTruthy()
  })
})
...