React Jest tests failing on CircleCI but passing locally

Build Environment Running Tests
1

I have a bunch of jest tests in my React project that are all passing on my local env but are failing on CircleCI because somehow the hooks that update state aren’t executing fast enough on circle, but are executing fast enough locally. Anyone else run into something similar? I’m using react-testing-library for my tests. Here’s an example of a failing test. The Subscription component contains a useEffect hook that calls setMyState, but the state isn’t being set in time for the expect statement to be truthy.

test("this test fails on CircleCI", async done => {
  render(<Subscription {...testProps} />);
  expect(myState).toEqual([]);
  done();
}

I have to add a rerender call in order for the test to pass:

test("this test passes on CircleCI", async done => {
    const { rerender } = render(<Subscription {...testProps} />);
    rerender(<Subscription {...testProps} />);
    expect(myState).toEqual([]);
    done();
}

I’d really like to not have to rewrite all my failing tests with rerender just to get tests to pass on CircleCI. Anyone run into something similar? I’m running the same version of nodejs locally as on CircleCI (11.4)

2

That sounds like a race condition that would make the tests flaky anyway. I’m not familiar with React, but can you add in the necessary waits for the DOM to change as appropriate? That way the tests will run on your machine and also on whatever CI infra you have.