Jest encountered an unexpected token export with the adapter

[tleunen]

I'm trying to set up a new project, and simply adding these give me an error:

import { configure } from "enzyme";
import Adapter from "enzyme-adapter-preact-pure";

configure({ adapter: new Adapter() });

SyntaxError: Unexpected token 'export'

      at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1773:14)
      at Object.<anonymous> (node_modules/enzyme-adapter-preact-pure/build-cjs/src/Adapter.js:8:18)

In the details of the error, it looks like it might be trying to parse the preact.module.js file?

Details:

    /projects/x/node_modules/preact/dist/preact.module.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,jest){var n,l,u,i,t,o,r,f={}....

Not sure exactly what's going on. Am I missing an obvious option?

[robertknight]

SyntaxError: Unexpected token 'export'

This error suggests that Jest is trying to parse an ES module as if it were a CommonJS module. It is loading the CommonJS build of enzyme-adapter-preact-pure (see build-cjs/ in the path) but the ES module build of Preact (preact.module.js).

What I would normally expect to happen is that a bundler / environment either uses the ES module build of both, if it supports that, or the CommonJS build of both.

Can you provide the details needed to recreate your project setup?

[tleunen]

Hmm... I tried a couple things, I initially used @swc/jest and I tried with the jest-preset-preact to see if I had something wrong with my config, but both give me the same error on some of preact files.

Any reason why jest would load the es module version of preact instead of cjs? (Using Node 16, my swc/jest config has module: { type: "commonjs" }. My tsconfig has "module": "esnext",, but even setting it to commonjs doesn't make any changes)

[robertknight]

Any reason why jest would load the es module version of preact instead of cjs?

Can you import functions from the preact package directly, as opposed to the indirect imports that happen when you import this package? What happens if you simplify the system (eg. to take swc or TypeScript out of the picture temporarily)?

[tleunen]

I believe there's a misunderstanding. I'm simply trying to do the initial setup to add the preact adapter for enzyme. Tests are importing preact directly.

After a bit more try and error, starting from scratch again, and removing all complexity (all tests and typescript) , it seems the error arises as soon as I set jest to run in a jsdom environment. testEnvironment: "jsdom"

[tleunen]

After rollback to jest 27, it seems the error is gone. So might be a problem with Jest 28, or somewhere in between Jest and this adapter?
I don't have any problem between Jest 28 and the React adapter.

[shinxi]

Same here, met exactly the same issue after upgrading to jest 28, and have to downgrade back to 27 to make the original tests work...

[robertknight]

If someone could create a gist with the minimal set of files needed to reproduce the problem in a project, that would be helpful. I'm not currently using Jest together with Preact in any projects, so this would save some debugging time.

[rschristian]

Might be related to jestjs/jest#11924

Sounds like Jest is consuming the browser build of Preact while applying Node extension semantics to it.

[TimvdLippe]

After a lot of fiddling, I was able to fix it based on ai/nanoid#363 (comment)

Add the following to moduleNameMapper in your jest.config.js:

"^preact(/(.*)|$)": "preact$1"