在 React Native 中使用笑话进行故事书快照测试时出现问题

Question

我拥有的

\n

我正在尝试在我的反应本机/打字稿应用程序中使用笑话和 Storybook 以及 Storyshots 插件进行快照测试，但是当我尝试运行简单测试时遇到一些问题。

\n

根据故事书文档中的快照测试部分，您唯一需要做的就是创建一个storybook.test.js包含以下内容的文件：

\n

故事书.test.js

\n

import initStoryshots from \'@storybook/addon-storyshots\';\ninitStoryshots();\n

\n

之后，一切都应该按预期工作，但控制台会抛出以下错误：

\n

\xe2\x97\x8f Test suite failed to run\n\n    Jest encountered an unexpected token\n\n    This usually means that you are trying to\n import a file which Jest cannot parse, e.g.\nit\'s not plain JavaScript.\n\n    By default, if Jest sees a Babel config,\nit will use that to transform your files, ign\noring "node_modules".\n\n    Here\'s what you can do:\n     \xe2\x80\xa2 If you are trying to use ECMAScript Mo\ndules, see https://jestjs.io/docs/en/ecmascri\npt-modules for how to enable it.\n     \xe2\x80\xa2 To have some of your "node_modules" fi\nles transformed, you can specify a custom "tr\nansformIgnorePatterns" in your config.\n     \xe2\x80\xa2 If you need a custom transformation sp\necify a "transform" option in your config.\n     \xe2\x80\xa2 If you simply want to mock your non-JS\n modules (e.g. binary assets) you can stub th\nem out with the "moduleNameMapper" config opt\nion.\n\n    You\'ll find more details and examples of\nthese config options in the docs:\n    https://jestjs.io/docs/en/configuration.h\ntml\n\n    Details:\n\n    C:\\Users\\myuser\\Desktop\\myapp\\node_m\nodules\\react-native-swipe-gestures\\index.js:3\n    import React, { Component } from "react";\n    ^^^^^^\n\n    SyntaxError: Cannot use import statement\noutside a module\n\n      at Runtime.createScriptFromCode (node_m\nodules/jest-runtime/build/index.js:1350:14)\n      at Object.<anonymous> (node_modules/@st\norybook/react-native/dist/preview/components/\nOnDeviceUI/navigation/index.js:29:53)\n\nTest Suites: 1 failed, 1 total\nTests:       0 total\nSnapshots:   0 total\nTime:        11.468 s\nRan all test suites.\nerror Command failed with exit code 1.\ninfo Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.\n

\n

笑话配置.js

\n

module.exports = {\n  preset: \'react-native\',\n  moduleFileExtensions: [\'ts\', \'tsx\', \'js\', \'jsx\', \'json\', \'node\']\n};\n

\n

babel.config.js

\n

module.exports = {\n  presets: [\'module:metro-react-native-babel-preset\']\n};\n\n

\n

如果我@storybook/addon-storyshots从测试中删除相关内容，一切都会正常工作，没有任何问题。所以我不知道是否需要一些额外的配置来使用本机反应进行工作故事书/笑话快照测试。

\n

Answer 1

够了。添加react-native-swipe-gestures到transformIgnorePatterns您的jest.config.js.

  transformIgnorePatterns: ['node_modules/(?!(react-native|@react-navigation|@react-native|react-native-swipe-gestures)/)'],

这对我来说是一个伎俩。