Support for screen.debug() in @testing-library/react-native

  09 Aug 2023   1 min read

We are excited to announce support for screen.debug() using @testing-library/react-native in Wallaby. This feature allows developers to easily debug their React Native components and views, improving the overall testing and development experience.

Using screen.debug() allows you to print the current state of the rendered component’s output, making it easier to understand what is being rendered at any point in your test. You can use it with console.log to print the current state of the rendered component’s output to the console. It also supports shallow rendering through screen.debug.shallow().

For those who prefer visual feedback, you can leverage Wallaby’s Live Comments by simply placing //? after the screen.debug() expression. This will show the current state of the rendered component in real-time as you modify your code. Alternatively, you can select the screen.debug() expression and run the Show Value command to view the rendered output.