Talo example test

example.test.jsx

import { getSuperThing } from '~/api'

const Talo = () => {
  const [data, setData] = useState(null)
  useEffect(() => {
    getSuperThing().then(setData)
  }, [])

  if(!data) return null

  return <OtherComponent data={data} />
}

// test

import { getSuperThing } from '~/api'
import OtherComponent from '~/components/other-component'

const serverDataMock = [{

}]

jest.mock('~/api', () => ({
  getSuperThing: jest.fn(() => Promise.resolve(serverDataMock))
}))

describe('Talo', () => {
  it('should getSuperThing in the first render', () => {
    act(async () => {
      await renderComponent(<Talo />)
    })

    expect(getSuperThing).toBeCalledOnce()
  })

  it('it should pass the correct props', () => {
    let render;
    act(async () => {
      render = await renderComponent(<Talo />)
    })

    const otherComponent = render.find(OtherComponent)

    expect(otherComponent).props('data').toEqual({ talo: true })
  })
})