callstack / react-native-testing-library

🦉 Simple and complete React Native testing utilities that encourage good testing practices.
https://callstack.github.io/react-native-testing-library/
MIT License
3.07k stars 271 forks source link

Incorrect automatic cleanup order #1565

Closed alpha0010 closed 4 months ago

alpha0010 commented 7 months ago

Describe the bug

While running tests, I get:

ReferenceError: You are trying to access a property or method of the Jest environment after it has been torn down.

This appears to be due to the useEffect() cleanup being called after Jest has done its own cleanup; manually unmount()ing the component before exiting the test resolves the issue.

This is problematic since jest --runInBand exits non-zero, causing pipeline failures (even though all tests pass).

Expected behavior

Automatic cleanup has access to the Jest environment, so I do not need to manually unmount().

Steps to Reproduce

// Add to `MyComponent`
  useEffect(() => {
    const handle = InteractionManager.runAfterInteractions(async () => {
      let nextFrame = new Promise((resolve) => requestAnimationFrame(() => resolve()));
      await nextFrame();
    });
    return () => {
      handle.cancel();
    };
  }, []);
test('Render example', async () => {
  const {toJSON, unmount} = render( <MyComponent /> );

  expect(toJSON()).toMatchSnapshot();

  // Uncomment to resolve access Jest environment after teardown.
  //unmount();
});

Screenshots

Versions

  npmPackages:
    @testing-library/react-native: ^12.4.3 => 12.4.3 
    react: 18.2.0 => 18.2.0 
    react-native: 0.73.4 => 0.73.4 
    react-test-renderer: 18.2.0 => 18.2.0 
mdjastrzebski commented 6 months ago

@alpha0010 thank you for reporting this.

As far as I can see:

What you are doing in the workaround is that you are calling unmount() directly in the test, so before afterEach. That causes the useEffect cleanup be called inside the test, and not in "after test" phase.

I'm not sure if cleanup could technically be called by RNLT "inside" the test, as that is controlled by Jest (and you as the user). So the manual unmount() workaround seems the best we can do now. Let me know if you see other options.

mdjastrzebski commented 4 months ago

Closing as stale. Workaround available (manual calling of unmount.