Error while running Jest with rn-tooltip on my project.

[sanchitos]

I am using the library, it works perfectly. Now I need to do some tests over my component.

My settings:

• react: 18.2.0
• react-native: 0.71.3
• typescript: 4.8.2

I have this error:

Jest failed to parse a file. This happens e.g. when your code or its dependencies use non-standard JavaScript syntax, or when Jest is not configured to support such syntax.

Details:

/Users/pepe/Code/chat/node_modules/rn-tooltip/src/Tooltip.js:3
import * as React from 'react';
^^^^^^

SyntaxError: Cannot use import statement outside a module

  2 | import { FC } from 'react';
  3 | import { StyleSheet, Text, View } from 'react-native';
> 4 | import Tooltip from 'rn-tooltip';

I have tried a lot of things in order to make it work. Any suggestion?

[larry-cherry]

I am having the same issue. I will probably have to mock it in order to get it to pass various tests.

[visormatt]

Just ran into this as well, you can mock it with

jest.mock('rn-tooltip', () => {
  return (props) => {
    return <View>{props.children}</View>;
  };
});

[larry-cherry]

@visormatt unless you have created a div component in react native your code snippet above would probably not work. This is what I had to implement in my projects global mocks to get this passing unit tests.

jest.mock('rn-tooltip', () => {
  const React = require('react');
  const { View } = require('react-native');
  return ({ children }) => {
    <View>{children}</View>;
  };
});

[visormatt]

Thanks, yeah for RN we should be mocking with a View there 👍 . Jumping between platforms 🤷 but appreciate the callout 💯

[rodrigodiasf1984]

@visormatt unless you have created a div component in react native your code snippet above would probably not work. This is what I had to implement in my projects global mocks to get this passing unit tests.

jest.mock('rn-tooltip', () => {
  const React = require('react');
  const { View } = require('react-native');
  return ({ children }) => {
    <View>{children}</View>;
  };
});

This works for me, thx.

[rodrigodiasf1984]

i've got a problem with the ref so i did this mock inside of my jest.setup, hope this helps:

jest.mock('rn-tooltip', () => {
  const { View } = require('react-native');
  const React = require('react');
  return React.forwardRef((props, ref) => {
    if (ref) {
      ref.current = {
        toggleTooltip: jest.fn(),
        showTooltip: jest.fn(),
        hideTooltip: jest.fn(),
      };
    }
    const { children } = props;
    return <View {...props}>{children}</View>;
  });
});