Running tests with ES6 import statements node

Question

I'm using node v15.0.1, and jest 26.6.0 on ubuntu 18.04.5.

I have setup a simple test case, and at the top of the file I'm trying to use an ES6 import statement:

import Color from './color.js'

test("Initialized properly after construction", () => {
    expect(1 + 1).toBe(2);
});

Additionally, here's the code for color.js:

class Color {
    constructor(r, g, b, a) {
        this.r = r;
        this.g = g;
        this.b = b;
        this.a = a;
    }
}

export {
    Color
};

When I run jest I get the following error output:


 FAIL  src/modules/color.test.js
  ● 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:
     • 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:

    /home/daniel/Documents/raycaster/src/modules/color.test.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import Color from './color.js'
                                                                                             ^^^^^^

    SyntaxError: Cannot use import statement outside a module

      at new Script (node:vm:100:7)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        0.288 s
Ran all test suites.
npm ERR! code 1

Based on the Jest documentation https://jestjs.io/docs/en/ecmascript-modules, I have added the following to my package.json file:

"type": "module",
"jest": {
        "testEnvironment": "jest-environment-node",
        "transform": {}
}

Despite these configurations it appears that jest is unable to run in an ES6 compliant mode. What configurations would I need to do to enable the import statements?

kindly share the content of color.js – chyke007 Oct 22 '20 at 22:00 — chyke007, Oct 22 '20 at 22:00
@chyke007 have added the contents of color.js now – Daniel Oct 22 '20 at 22:05 — Daniel, Oct 22 '20 at 22:05

score 3 · Answer 1 · answered Oct 22 '20 at 22:19

I found Node v13 / Jest / ES6 — native support for modules without babel or esm

which highlighted the piece that I needed:

In my package.json file, I needed to specify the following:

"test": "node --experimental-vm-modules node_modules/jest/bin/jest.js"

Estus Flask · Answer 2 · 2020-10-22T22:23:06.150

As the reference states,

babel-jest is automatically installed when installing Jest and will automatically transform files if a babel configuration exists in your project. To avoid this behavior, you can explicitly reset the transform configuration option:

<...>

transform: {},

This is exactly what this config does, it disables Babel and prevents import from being transpiled.

The solution is to remove transform: {} and use transform only on purpose.

The mentioned reference section is dedicated to native ES module support in Node. It suggests that transform: {} requires to enable them with:

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

This cannot be recommended for regualr use as ESM support in both Node and Jest is experimental, may cause issues and lack features as Jest already heavily relies on CommonJS modules.

score 0 · Answer 3 · answered Oct 22 '20 at 22:11

0

Since you are importing the class as a default export, you need to a default value. For more insight check this out https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export

 class Color {
            constructor(r, g, b, a) {
                this.r = r;
                this.g = g;
                this.b = b;
                this.a = a;
            }
        }
    
        export default  Color;

answered Oct 22 '20 at 22:11

chyke007

1,478
1
8
16

Thanks for calling this out, once I changed the command used to trigger jest in my package.json file, I ran into this so it was very helpful! – Daniel Oct 22 '20 at 22:20

Running tests with ES6 import statements node

3 Answers3