Open themaskedavenger opened 3 years ago
In hopes that it speeds things along and removes any question as to ownership, I forked the repository provided by @themaskedavenger and removed all typescript related stuff to show it's a jest issue.
https://github.com/k2snowman69/tsjestcjerepro
Hopefully this removes any doubt that this is a ts or a ts-jest issue
Tested with node 14.17.1 and node v16.1.0
Okay so dug into this a bit and hopefully my investigation helps whoever ends up fixing this on jest's side.
The first and important thing to note is that jest does not use nodejs to resolve files. This tripped me up a lot until I figured this out. Both jest and nodejs use cjs-module-lexer
which uses basic regex to parse a contents of a file to determine what the exported functions are from a cjs library. The owner of that library had a great explanation that helped guide the rest of this investigation. Now what this means is the same package has the possibility of behaving differently between nodejs and jest and that's really important because that gap between the two is going to cause lots of confusion... so using a few examples let's take this package by package...
Glob's export code looks like module.exports = glob
which would require an eval on the js code to determine what the exports are. This is why cjs-module-lexer
cannot determine the exports, because it's purely basing it off regex for performance reasons required by nodejs. This will fail in both nodejs and jest.
Enzyme's export code looks like
module.exports = {
render: _render2['default'],
shallow: _shallow2['default'],
mount: _mount2['default'],
ShallowWrapper: _ShallowWrapper2['default'],
ReactWrapper: _ReactWrapper2['default'],
configure: _configuration.merge,
EnzymeAdapter: _EnzymeAdapter2['default']
};
however it seems that cjs-module-lexer
is only able to extract the first exported function. I commented about this bug in https://github.com/guybedford/cjs-module-lexer/issues/57 and provided a unit test for reproduction. Hopefully we can see it get fixed.
tslib actually supports cjs, es6 through the module
property (non-standard) and ESM through the exports
property (node compatible) so this should work.
When running the following code in node in either cjs or esm there are no errors (as expected)
import { __assign } from "tslib";
const d = __assign({ a: "a" });
console.log(d.a);
However when running the following test in Jest ESM:
import { __assign } from "tslib";
test.only("General config is working", async () => {
const d = __assign({ a: "a" });
expect(d.a).toBe("a");
});
You'll get the following error:
FAIL src/tslib.test.js
β Test suite failed to run
SyntaxError: The requested module 'tslib' does not provide an export named '__assign'
at Runtime.linkAndEvaluateModule (node_modules/jest-runtime/build/index.js:669:5)
Which means that jest's resolver isn't resolving the same file that node js is resolving that eventually gets sent to cjs-module-lexer
so that it can correctly determine the exports.
Hopefully that gives some guidance to someone who investigates this and maybe we can at least fix this for tslib. To fix this for glob however, you'll need to fix it in cjs-module-lexer
. I'd still leave this ticket open to hopefully fix it for tslib though.
This happens to me even with react.
Can't use import {useState} from 'react'
Have to write it this way
import React from 'react'
const {useState} = React
And react-use
has the same problem
Just ran into this myself...incredibly frustrating bug.
+1 I am seeing the same issue with a very similar setup (jest with ESM, relying on named exports from a CJS module).
Is there no fix for this yet?
+1 also wondering if there is a solution for this?
@k2snowman69 Thanks for your detailed analysis of the root cause of the problem.
Like @yqrashawn i am also facing Jest not able to do perform named export even in react package.
Current Temp solution is to import the whole package default and extract individual exports
import React from 'react'
React.useEffect
But its a pain staking process, and i would like to automate somehow, any suggestion.
This issue is stale because it has been open for 1 year with no activity. Remove stale label or comment or this will be closed in 30 days.
not stale
Can anyone provide an example of where node is able to import using native ESM, but Jest fails?
E.g. React does not support native ESM: https://github.com/facebook/react/issues/11503
π Bug Report
Using TS, exports from CJS modules can be imported with syntax as if they were named ES module exports, e.g.:
However, with Jest and ES modules, when this style of import is in a test file or in a dependency of a test file, it says
SyntaxError: The requested module 'glob' does not provide an export named 'sync'
Going through all one by one and changing them to
import glob from 'glob';
and then callingglob.sync()
seems to work, however when migrating some legacy stuff from another test runner to Jest this may not be an option, because there are a lot of those such imports in the codebase.Is there a way around this, so that
import { whatever } from 'whatever';
will work for CJS modules?To Reproduce
Steps to reproduce the behavior:
Running jest with:
node --experimental-vm-modules node_modules/jest/bin/jest.js
(as described in https://jestjs.io/docs/ecmascript-modules), and using Jest config:Expected behavior
import { sync } from 'glob'
and similar imports from CJS modules work.Link to repl or repo (highly encouraged)
https://github.com/themaskedavenger/tsjestcjerepro
envinfo