React/Jest How to wait until useEffect has run?

Question

I have the following code:

const doSomething = useCallback(someFunction);

useEffect(() => {
  // doSomething takes in the data and invokes the callback at the end as newData
  doSomething(data, (newData: string) => {
    setData(newData);
  });
}, [data, doSomething]);

When I want to test this, it only works when I use setTimeout with 1 or more ms. I suppose this is because the function in useEffect has not run yet and thus has not updated the component, correct me if I'm wrong. How can I work around this without setTimeout? Or do I need a completely different approach? Help is appreciated.

Answer 1

maybe try a wrapper function, for example:

async function handleSomething(){
    const res = await doSomthing()
    setData(res)
}

then call this function inside useEffect.