Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Can't get Jest tests to run with reactotron-redux even after mocking reactotron-react-native with the following error - SyntaxError: Cannot use import statement outside a module #1506

Open
BozhidarKabzamalov opened this issue Sep 20, 2024 · 1 comment
Open

Can't get Jest tests to run with reactotron-redux even after mocking reactotron-react-native with the following error - SyntaxError: Cannot use import statement outside a module #1506

BozhidarKabzamalov opened this issue Sep 20, 2024 · 1 comment

Comments

@BozhidarKabzamalov
Copy link

BozhidarKabzamalov commented Sep 20, 2024 •
edited
Loading

Describe the bug

I have a React Native project and was able to setup reactotron-react-native and my tests were still working fine, but as soon as I installed reactotron-redux and set it up as per documentation, all my tests started failing with the following error - SyntaxError: Cannot use import statement outside a module.

If I remove .use(reactotronRedux()) from ReactotronConfig.js the tests start passing again. There doesn't seem to be any documentation regarding mocking so I've found my mock from other Reactotron github issues, but none of them are working for me.

I am on the latest verions of both reactotron-react-native and reactotron-redux

The error looks like this:

    SyntaxError: Cannot use import statement outside a module

      4 | const reactotron = Reactotron.configure() // controls connection & communication settings
      5 |     .useReactNative() // add all built-in react native plugins
    > 6 |     .use(reactotronRedux())
        |                ^
      7 |     .connect(); // let's connect!
      8 |
      9 | export default reactotron;

ReactotronConfig.js

const Reactotron = require('reactotron-react-native').default;
const { reactotronRedux } = require('reactotron-redux');

const reactotron = Reactotron.configure() // controls connection & communication settings
    .useReactNative() // add all built-in react native plugins
    .use(reactotronRedux())
    .connect(); // let's connect!

export default reactotron;

Store.js

export const store = configureStore({
    reducer: reducers,
    middleware: [],
    enhancers: __DEV__ ? [reactotron.createEnhancer!()] : [],
});

mocks/reactotron-react-native.js

const reactotron = {
    configure: () => reactotron,
    useReactNative: () => reactotron,
    use: () => reactotron,
    connect: () => reactotron,
    clear: () => reactotron,
    createEnhancer: () => reactotron,
};

export default reactotron;

Reactotron version

5.1.8
@robsoden
Copy link

I've gotten it to work successfully mocking it this way:

jest.mock('reactotron-react-native', () => {
  return {
    configure: jest.fn().mockReturnThis(),
    setAsyncStorageHandler: jest.fn().mockReturnThis(),
    useReactNative: jest.fn().mockReturnThis(),
    use: jest.fn().mockReturnThis(),
    connect: jest.fn().mockReturnThis(),
    onCustomCommand: jest.fn(),
  }
})

jest.mock('reactotron-redux', () => {
  return {
    reactotronRedux: jest.fn(),
  }
})

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@BozhidarKabzamalov @robsoden