19

I got an error when I run test using Jest, I tried to fix this error for 2 hours. But, I couldn't fix it. My module is using gapi-script package and error is occurred in this package. However, I don't know why this is occurred and how to fix it.

jest.config.js

module.exports = {
  "collectCoverage": true,
  "rootDir": "./",
  "testRegex": "__tests__/.+\\.test\\.js",
  "transform": {
    '^.+\\.js?$': "babel-jest"
  },
  "moduleFileExtensions": ["js"],
  "moduleDirectories": [
    "node_modules",
    "lib"
  ]
}

babel.config.js

module.exports = {
  presets: [
    '@babel/preset-env',
  ]
};

methods.test.js

import methods, { typeToActions } from '../lib/methods';

methods.js

import { gapi } from "gapi-script";
...

Error Message

C:\haram\github\react-youtube-data-api\node_modules\gapi-script\index.js:1 ({"Object.":function(module,exports,require,__dirname,__filename,global,jest){import { gapi, gapiComplete } from './gapiScript';

SyntaxError: Cannot use import statement outside a module

What is wrong with my setting?

skyboyer
  • 19,620
  • 7
  • 50
  • 62
undefined
  • 738
  • 1
  • 7
  • 27
  • Maybe you can read the comment here. https://github.com/facebook/jest/issues/9292#issuecomment-569673251 – ERU Jan 23 '20 at 04:52
  • Did you try to import the package inside your test as well? Or mocking the gapi functions? I believe you have to mock it. – Lucas Andrade May 13 '20 at 19:19

3 Answers3

12

As of this writing, Jest is in the process of providing support for ES6 modules. You can track the progress here:

https://jestjs.io/docs/en/ecmascript-modules

For now, you can eliminate this error by running this command:

node --experimental-vm-modules node_modules/.bin/jest

instead of simply:

jest

Be sure to check the link before using this solution.

Seth
  • 5,970
  • 5
  • 43
  • 55
  • 1
    This is HUGE! I spent way too long looking for this solution. All tests were working, and then I did a bunch of hours of code, and everything is failing. Found lots of documentation on how to update your configs to get things to pass - tried and failed for a bit, then found this. – nycynik May 30 '21 at 04:48
6

Jest needs babel to work with modules. For the testing alone, you do not need jest.config.js, just name the testfiles xxx.spec.js or xxx.test.js or put the files in a folder named test.

I use this babel.config.js:

module.exports = function (api) {
  api.cache(true)

  const presets = [
    "@babel/preset-env"
  ]

  return {
    presets
  }
}

Adding "type": "module" in package.json or using mjs as stated in other answers is not necessary when your setup is not too complicated.

Onno van der Zee
  • 174
  • 1
  • 7
5

I solved this with the help of Paulo Coghi's answer to another question -

Does Jest support ES6 import/export?

Step 1:

Add your test environment to .babelrc in the root of your project:

{
  "env": {
    "test": {
      "plugins": ["@babel/plugin-transform-modules-commonjs"]
    }
  }
}

Step 2:

Install the ECMAScript 6 transform plugin:

npm install --save-dev @babel/plugin-transform-modules-commonjs
Marcellia
  • 111
  • 1
  • 6