WhoBuilt

React Native Testing Library 2.0 - what's new?

Aug 18, 2020· 8 min· 639 views·Watch on YouTube

An unnamed Callstack speaker explains what changed in React Native Testing Library 2.0.

Automatic cleanup and API alignment

Version 2 added automatic cleanup, which unmounts components after tests and can be enabled or disabled using the same APIs as React Testing Library. The `waitForElement` function was renamed to `waitFor` and given a matching options object. The speaker says most of that change was the rename.

Simpler async testing and debugging

Calls to `waitFor` are now wrapped in `act`, so test authors do not need to handle that themselves. The `findBy` query was added in the final v1 release. The global `debug` function was removed because debugging from the rendered component is more useful.

Removing shallow rendering and legacy queries

Version 2 removed the legacy helper and `shallow` function. The speaker says shallow rendering can complicate tests when components have state; teams can reimplement the simple helper and migrate away later. The library also removed `byName`, which had been deprecated with warnings about a year earlier.

Unsafe queries and other fixes

`getByType` and `getByProps` became `UNSAFE_getByType` and `UNSAFE_getByProps` because they rely on component implementation details, though the speaker says they remain available for now. The release also fixed a long-standing `getByTestId` bug and deprecated `flushMicrotasksQueue`, recommending `findBy` or `waitFor` instead. Other work included dropping Node 8 support and improving compatibility with community testing libraries.

Takeaways

  • Use `waitFor` and `findBy` for asynchronous tests instead of manually flushing microtasks.
  • Automatic cleanup unmounts rendered components after tests.
  • Shallow rendering can cause confusion when tested components have state.
  • Treat `UNSAFE_` queries as a sign that a test depends on implementation details.
  • Check migration points for removed APIs such as `byName` and the global `debug` function.

Mentioned in this talk

Search inside this talk

What was claimed 9

Show all 9 facts

Related talks

React Native Testing Library 2.0 - what's new? · WhoBuilt