From 46dbdff54a5f260c0337e7dcc0ea32328e49befc Mon Sep 17 00:00:00 2001 From: Maciej Jastrzebski Date: Wed, 17 Aug 2022 12:43:46 +0200 Subject: [PATCH 1/4] docs: troubleshooting guilde --- website/docs/Troubleshooting.md | 27 +++++++++++++++++++++++++++ website/sidebars.js | 1 + 2 files changed, 28 insertions(+) create mode 100644 website/docs/Troubleshooting.md diff --git a/website/docs/Troubleshooting.md b/website/docs/Troubleshooting.md new file mode 100644 index 000000000..902351d18 --- /dev/null +++ b/website/docs/Troubleshooting.md @@ -0,0 +1,27 @@ +--- +id: troubleshooting +title: Troubleshooting +--- + +This guide describes common issues found by users when integrating React Native Test Library to their projects. + +## Matching React Native, React & React Test Renderer versions + +Check that you have matching versions of core dependencies: +- React Native +- React +- React Test Renderer + +React Native uses different versioning scheme from React, you can use [React Native Upgrade Helper](https://react-native-community.github.io/upgrade-helper/) to find the correct matching between React Native & React versions. In case you use Expo, you should use dependency versions recommended by them and set by `expo upgrade` command. + +React Test Renderer usually has same major & minor version as React, as they are closely related and React Test Renderer is part of [React monorepo](https://github.com/facebook/react). + +Related issues: +- [#1061](https://github.com/callstack/react-native-testing-library/issues/1061) +- [#938](https://github.com/callstack/react-native-testing-library/issues/938) + +## Example repository + +We maintain an [example repository](https://github.com/callstack/react-native-testing-library/tree/main/examples/basic) that showcases a modern React Native Testing Library setup with TypeScript, Jest Native, etc. + +In case something does not work in your setup you can refer to this repository for recommended configuration. diff --git a/website/sidebars.js b/website/sidebars.js index d35d024aa..ec1738b48 100644 --- a/website/sidebars.js +++ b/website/sidebars.js @@ -9,6 +9,7 @@ module.exports = { 'migration-v2', 'how-should-i-query', 'faq', + 'troubleshooting', 'eslint-plugin-testing-library', 'understanding-act', ], From 3cb278be4d1d102bf29d6164ebdd63b2c02fc69b Mon Sep 17 00:00:00 2001 From: Maciej Jastrzebski Date: Wed, 17 Aug 2022 12:46:55 +0200 Subject: [PATCH 2/4] docs: add more issues ref --- website/docs/Troubleshooting.md | 1 + 1 file changed, 1 insertion(+) diff --git a/website/docs/Troubleshooting.md b/website/docs/Troubleshooting.md index 902351d18..4601f10eb 100644 --- a/website/docs/Troubleshooting.md +++ b/website/docs/Troubleshooting.md @@ -19,6 +19,7 @@ React Test Renderer usually has same major & minor version as React, as they are Related issues: - [#1061](https://github.com/callstack/react-native-testing-library/issues/1061) - [#938](https://github.com/callstack/react-native-testing-library/issues/938) +- [#920](https://github.com/callstack/react-native-testing-library/issues/920) ## Example repository From 2fb902540a15f4ea87aa0c7e3e40e39dda6d2346 Mon Sep 17 00:00:00 2001 From: Maciej Jastrzebski Date: Thu, 18 Aug 2022 11:11:35 +0200 Subject: [PATCH 3/4] docs: merge troubleshooting contents --- README.md | 2 +- website/docs/Troubleshooting.md | 13 +++++++++++++ 2 files changed, 14 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index df64e87b3..b682220e3 100644 --- a/README.md +++ b/README.md @@ -143,7 +143,7 @@ The [public API](https://callstack.github.io/react-native-testing-library/docs/a ## Troubleshooting -- [Understanding `act` function](https://callstack.github.io/react-native-testing-library/docs/understanding-act) +- [Troubleshooting guide](https://callstack.github.io/react-native-testing-library/docs/troubleshooting) ## Related External Resources diff --git a/website/docs/Troubleshooting.md b/website/docs/Troubleshooting.md index 4601f10eb..d71009128 100644 --- a/website/docs/Troubleshooting.md +++ b/website/docs/Troubleshooting.md @@ -26,3 +26,16 @@ Related issues: We maintain an [example repository](https://github.com/callstack/react-native-testing-library/tree/main/examples/basic) that showcases a modern React Native Testing Library setup with TypeScript, Jest Native, etc. In case something does not work in your setup you can refer to this repository for recommended configuration. + +## Act warnings + +When writing tests you may encounter warnings connected with `act()` function. There are two kinds of these warnings: + +* sync `act()` warning - `Warning: An update to Component inside a test was not wrapped in act(...)` +* async `act()` warning - `Warning: You called act(async () => ...) without await` + +You can read more about `act()` function in our [understanding `act` function guide](https://callstack.github.io/react-native-testing-library/docs/understanding-act). + +Normally, you should not encounter sync `act()` warnings, but if that happens this probably indicate an issue with your test and should be investigated. + +In case of async `act()` function this might happen more or less randomly, especially if your components contain async logic. So far this warning does not seem to affect test correctness. From 9839fffd890b6dcf011e522953e8e67b2296b95c Mon Sep 17 00:00:00 2001 From: Maciej Jastrzebski Date: Thu, 18 Aug 2022 11:12:37 +0200 Subject: [PATCH 4/4] docs: tweaks --- website/docs/Troubleshooting.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/website/docs/Troubleshooting.md b/website/docs/Troubleshooting.md index d71009128..6916c47d9 100644 --- a/website/docs/Troubleshooting.md +++ b/website/docs/Troubleshooting.md @@ -36,6 +36,6 @@ When writing tests you may encounter warnings connected with `act()` function. T You can read more about `act()` function in our [understanding `act` function guide](https://callstack.github.io/react-native-testing-library/docs/understanding-act). -Normally, you should not encounter sync `act()` warnings, but if that happens this probably indicate an issue with your test and should be investigated. +Normally, you should not encounter sync `act()` warnings, but if that happens this probably indicate an issue with your test and should be investigated. In case of async `act()` function this might happen more or less randomly, especially if your components contain async logic. So far this warning does not seem to affect test correctness.