Reactotron: Reactotron becomes undefined when mocking with jest

[hannojg]

I have issues to get Reactotron working in my jest react-native test environment.
Before running a test I simply do
jest.mock("reactotron-react-native");, but then I receive an error stating
TypeError: Cannot read property 'useReactNative' of undefined

Unfortunately, I don't find any recommendation in your docs for setting reactotron up for testing.

Really appreciate your help in advance! :)

[rmevans9]

We probably should do some good docs here. I will see if I can get something together soon.

[alycecristines]

i'm having the same issue here. :/

[BoKKeR]

Same issue, any workaround?

[pedrolobato]

Try:

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

jest.mock("reactotron-react-native", () => reactotron);

[bvodola]

What worked for me:

// ReactotronConfig.js
import Reactotron, { asyncStorage } from 'reactotron-react-native';
import { AsyncStorage } from 'react-native';
import { reactotronRedux } from 'reactotron-redux';

const IP_ADDRESS = '192.168.15.88';

const reactotron = Reactotron.setAsyncStorageHandler(AsyncStorage)
  .configure({ host: IP_ADDRESS })
  .useReactNative({})
  .use(asyncStorage())
  .use(reactotronRedux())
  .connect();

export default reactotron;

//__mocks__/reactotron-react-native.js

/* eslint-disable no-undef */

export default {
  setAsyncStorageHandler: () => ({
    configure: () => ({
      useReactNative: () => ({
        use: () => ({
          use: () => ({
            connect: () => ({
              createEnhancer: jest.fn(),
            }),
          }),
        }),
      }),
    }),
  }),
};

export const asyncStorage = jest.fn();

Important: I had to mock the reactotron object in the same order I was calling in ReactotronConfig.js.