How to use Jest to check if async loaded content is rendered – ReactJS

I have a component that renders a list of data, given by a hook. My hook returns some data on the component mount so the component always has some items to render.

MyList component:

function MyList() {
  let {data} = useLoadData()
  return (
      <ul>
        {data.map(i => <li key={i}>{i}</li>)}
      </ul>
  )
}

Data loader hook:


function useLoadData() {
  const [data, setData] = useState([])

  const fetchData = useCallback((params) => {
    fetch("url")
        .then(res => res.json())
        .then(res => setData(res))
  }, [])

  useEffect(() => {
    fetchData()
  }, [])

  return {data, fetchData}
}

I want to use jest to check if the initial data was rendered or not, is there any way to do it?