Problem using jest with storybook snapshot testing in react native - react-native

Question

What I have
I'm trying to use jest and Storybook with Storyshots addon for snapshot test in my react-native/typescript app, but I'm having some issues when I try to run simple test.
According to Snapshot testing section in storybook documentation, the only thing you need to do is create an storybook.test.js file with the following:
storybook.test.js
import initStoryshots from '#storybook/addon-storyshots';
initStoryshots();
After this, everything is supposed to work as expected, but the console throws the following error:
● Test suite failed to run
Jest encountered an unexpected token
This usually means that you are trying to
import a file which Jest cannot parse, e.g.
it's not plain JavaScript.
By default, if Jest sees a Babel config,
it will use that to transform your files, ign
oring "node_modules".
Here's what you can do:
• If you are trying to use ECMAScript Mo
dules, see https://jestjs.io/docs/en/ecmascri
pt-modules for how to enable it.
• To have some of your "node_modules" fi
les transformed, you can specify a custom "tr
ansformIgnorePatterns" in your config.
• If you need a custom transformation sp
ecify a "transform" option in your config.
• If you simply want to mock your non-JS
modules (e.g. binary assets) you can stub th
em out with the "moduleNameMapper" config opt
ion.
You'll find more details and examples of
these config options in the docs:
https://jestjs.io/docs/en/configuration.h
tml
Details:
C:\Users\myuser\Desktop\myapp\node_m
odules\react-native-swipe-gestures\index.js:3
import React, { Component } from "react";
^^^^^^
SyntaxError: Cannot use import statement
outside a module
at Runtime.createScriptFromCode (node_m
odules/jest-runtime/build/index.js:1350:14)
at Object.<anonymous> (node_modules/#st
orybook/react-native/dist/preview/components/
OnDeviceUI/navigation/index.js:29:53)
Test Suites: 1 failed, 1 total
Tests: 0 total
Snapshots: 0 total
Time: 11.468 s
Ran all test suites.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
jest.config.js
module.exports = {
preset: 'react-native',
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node']
};
babel.config.js
module.exports = {
presets: ['module:metro-react-native-babel-preset']
};
If I remove #storybook/addon-storyshots relate things from my tests, everything is working normally without any problem. So I don't know if I need some extra configuration to make work storybook/jest snapshoot testing with react native.

Answer 1

It's enough. Add react-native-swipe-gestures to transformIgnorePatterns of your jest.config.js.
transformIgnorePatterns: ['node_modules/(?!(react-native|#react-navigation|#react-native|react-native-swipe-gestures)/)'],
This did a trick for me.