Zenn
🐷

jest実行時にsentry-expoに関連するエラー

2022/11/18に公開
Expo
Jest
Sentry
tech

経緯

jestを実行する際に、sentry-expoに関する下記のようなエラーが出ていた。
いくつかの記事を参考にテストが通るように修正したので、その手順を記録として残しておこうと思います。

  ● 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, ignoring "node_modules".

    Here's what you can do:
     • If you are trying to use ECMAScript Modules, see https://jestjs.io/docs/en/ecmascript-modules for how to enable it.
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html

    Details:

    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){export { Severity, Status, } from "@sentry/types";
                                                                                             ^^^^^^

    SyntaxError: Unexpected token 'export'

      at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1350:14)
      at Object.<anonymous> (node_modules/sentry-expo/src/integrations/bare.ts:5:

テストを通すためにやったこと

  1. jest.setup.js の作成

アプリのルートディレクトリ配下に、 jest.setup.js ファイルを作成する。
ファイル内に下記を記載する。

jest.mock("sentry-expo", () => ({
  init: () => jest.fn(),
  captureException: () => jest.fn(),
}));⏎

package.json 内のjestの設定に jest.setup.js を読み込む設定を追加

  "jest": {
    "preset": "jest-expo",
    "setupFiles": ["./jest.setup.js"] // <- 追加
  },
  1. AsyncStorage用のMockの作成

この時点で下記のようなエラーが出ていたためエラーメッセージ中のリンクを参考に、AsyncStorageをモック化する。

  ● Test suite failed to run

    [@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.

    To fix this issue try these steps:

      • Rebuild and restart the app.

      • Run the packager with `--reset-cache` flag.

      • If you are using CocoaPods on iOS, run `pod install` in the `ios` directory and then rebuild and re-run the app.

      • If this happens while testing with Jest, check out docs how to integrate AsyncStorage with it: https://react-native-async-storage.github.io/async-storage/docs/advanced/jest

    If none of these fix the issue, please open an issue on the Github repository: https://github.com/react-native-async-storage/async-storage/issues

      at Object.<anonymous> (node_modules/@react-native-async-storage/async-storage/lib/commonjs/AsyncStorage.native.ts:23:9)
      at Object.<anonymous> (node_modules/@react-native-async-storage/async-storage/lib/commonjs/index.ts:1:1)

__mocks__/@react-native-async-storage/async-storage.js というディレクトリおよびファイルを作成する。
ファイル内に下記を記載する。

export { default } from '@react-native-async-storage/async-storage/jest/async-storage-mock'
  1. もしうまく動かない場合、node_modulesを再インストール
rm -rf node_modules
yarn

参考リンク

Discussion