From version reactotron-react-native 5.0.5

[Iuriy-Budnikov]

Describe the bug

I'm getting an error when I run tests via jest in react native. I used an empty react native project with the latest react native.

SyntaxError: Cannot use import statement outside a module

Reactotron version

5.1.3

[phatmovista]

I just installed the new version now and having the same issue as well

[jonqwerty]

I have the same issue with "reactotron-react-native": "^5.1.7".

[morganick]

After spinning up a fresh app with the following: https://reactnative.dev/docs/environment-setup#start-a-new-react-native-project-with-expo

I'm using yarn version 3.4.1 from corepack.

I'm able to run yarn test with passing tests while also having reactotron-react-native installed and running.

I think the missing piece may be the conditional require from here: https://docs.infinite.red/reactotron/quick-start/react-native/#step-3---add-reactotron-to-your-app

[jonqwerty]

Here is my case.
App is create with expo + Type Script.
package.json:
"dependencies": {
"@babel/plugin-proposal-export-namespace-from": "^7.18.9",
"@react-native-async-storage/async-storage": "1.21.0",
"@react-native-clipboard/clipboard": "^1.11.2",
"@react-native-community/blur": "^4.3.2",
"@react-native-community/hooks": "^2.8.1",
"@react-native-community/netinfo": "11.1.0",
"@react-native-masked-view/masked-view": "0.3.0",
"@react-navigation/native": "^6.0.12",
"@react-navigation/stack": "^6.2.3",
"@reduxjs/toolkit": "^1.8.5",
"@shopify/flash-list": "1.6.3",
"axios": "^0.27.2",
"babel-plugin-module-resolver": "^5.0.0",
"expo": "^50.0.2",
"expo-app-loading": "~2.1.0",
"expo-application": "~5.8.3",
"expo-build-properties": "~0.11.1",
"expo-clipboard": "~5.0.1",
"expo-constants": "~15.4.5",
"expo-crypto": "~12.8.1",
"expo-dev-client": "~3.3.11",
"expo-device": "~5.9.3",
"expo-font": "~11.10.2",
"expo-linear-gradient": "~12.7.2",
"expo-linking": "~6.2.2",
"expo-location": "~16.5.5",
"expo-notifications": "~0.27.6",
"expo-secure-store": "~12.8.1",
"expo-splash-screen": "~0.26.4",
"expo-system-ui": "~2.9.3",
"expo-tracking-transparency": "~3.3.0",
"expo-web-browser": "~12.8.2",
"i18next": "^23.7.12",
"jest-expo": "~50.0.4",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-hook-form": "^7.34.2",
"react-i18next": "^11.18.5",
"react-native": "0.73.6",
"react-native-dotenv": "^3.3.1",
"react-native-mmkv": "^2.11.0",
"react-native-onboarding-swiper": "^1.2.0",
"react-native-phone-number-input": "^2.1.0",
"react-native-reanimated": "~3.6.2",
"react-native-safe-area-context": "4.8.2",
"react-native-screens": "~3.29.0",
"react-native-svg": "14.1.0",
"react-native-web": "~0.19.6",
"react-redux": "^8.0.2"
},
"devDependencies": {
"@babel/core": "^7.12.9",
"@react-native-community/eslint-config": "^3.2.0",
"@testing-library/react-hooks": "^8.0.1",
"@testing-library/react-native": "^12.4.4",
"@types/babel__core": "^7.1.20",
"@types/jest": "^29.2.4",
"@types/react": "~18.2.45",
"@types/react-native": "^0.71.1",
"@types/react-test-renderer": "^18.0.7",
"@types/redux-mock-store": "^1.0.6",
"@typescript-eslint/eslint-plugin": "^5.46.1",
"eslint": "^8.29.0",
"husky": "^8.0.0",
"jest": "^29.2.1",
"prettier": "^2.7.1",
"react-devtools": "^5.0.0",
"react-test-renderer": "18.2.0",
"reactotron-react-native": "^5.1.7",
"reactotron-react-native-mmkv": "^0.2.6",
"reactotron-redux": "^3.1.9",
"redux-mock-store": "^1.5.4",
"ts-jest": "^29.1.1",
"typescript": "^5.3.0"}

I have jest tests.
Tests had passed. But after I had connected Reactotron some of my tests failed.

I configured Reactotron with your project:

Step 1 - Add Reactotron as DEV dependency
I have added Reactotron on my React Native project as a dev dependency.

Step 2 - Initialization.
My ReactotronConfig.js looks like :
`
import Reactotron, { asyncStorage } from 'reactotron-react-native';
import { reactotronRedux } from 'reactotron-redux';
import mmkvPlugin from 'reactotron-react-native-mmkv';

import storageMMKV from '@services/mmkv/storageMMKV';

const storage = storageMMKV.storage;

const reactotron = Reactotron.configure({
name: 'Name app',
})
.use(asyncStorage())
.use(mmkvPlugin({ storage }))
.use(reactotronRedux())
.useReactNative({
asyncStorage: false,
networking: {
ignoreUrls: /symbolicate/,
},
editor: false,
errors: { veto: stackFrame => false },
overlay: false,
})
.connect();
export default reactotron;`

Step 3 - Add Reactotron to your app
I have imported ReactotronConfig.js in my App.ts