jest-fetch-mock
jest-fetch-mock copied to clipboard
Import errors caused by node-fetch 2.6.0 (dependency of the cross-fetch dependency)
Hi,
i have some problems with jest-fetch-mock
from the 3.0.x
version range. It is not a problem with this package directly, it is caused by a dependency of a dependency of this package. When I update I get this Error:
...projectpath.../node_modules/node-fetch/lib/index.mjs:1
import Stream from 'stream';
^^^^^^
SyntaxError: Cannot use import statement outside a module
4 | import {GlobalWithFetchMock} from "jest-fetch-mock";
5 | const customGlobal: GlobalWithFetchMock = global as GlobalWithFetchMock;
> 6 | customGlobal.fetch = require("jest-fetch-mock");
| ^
7 | customGlobal.fetchMock = customGlobal.fetch;
If I downgrade jest-fetch-mock
back to 2.1.2 then it works again. I am using this package together with typescript, jest, ts-jest, babel-jest. Another workaround can be found at the end of this Issue.
Environment
package.json
(only unit test relevant dependencies)
"devDependencies": {
"@babel/core": "^7.9.6",
"@babel/preset-env": "^7.9.6",
"@types/enzyme": "^3.10.5",
"@types/jest": "^25.2.1",
"babel-jest": "^26.0.1",
"babel-plugin-transform-react-jsx": "^6.24.1",
"core-js": "^3.6.5",
"enzyme": "^3.11.0",
"enzyme-adapter-preact-pure": "^2.2.0",
"enzyme-to-json": "^3.4.4",
"jest": "^26.0.1",
"jest-environment-jsdom-sixteen": "^1.0.3",
"jest-fetch-mock": "^3.0.3",
"jest-junit": "^10.0.0",
"ts-jest": "^25.5.1-alpha.0",
"typescript": "^3.8.3",
},
"browserslist": [
"since 2018-11 and >0%",
"node >= 12"
],
tsconfig.json
{
"compilerOptions": {
"target": "esnext",
"module": "esnext",
"moduleResolution": "node",
"esModuleInterop": true,
"rootDir": "src",
"baseUrl": "src",
"sourceMap": true,
"experimentalDecorators": true,
"strict": true,
"noImplicitReturns": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"removeComments": false,
"noEmitHelpers": false,
"declaration": false,
"jsx": "react",
"jsxFactory": "h",
"resolveJsonModule": true
},
"include": [
"src"
],
"exclude": [
"**/*.test.ts"
]
}
jest.config.js
(part of it)
module.exports = {
preset: "ts-jest",
testEnvironment: "jest-environment-jsdom-sixteen",
globals: {
"ts-jest": {
babelConfig: ".babelrc",
},
},
moduleDirectories: ["src", "node_modules"],
moduleFileExtensions: ["ts", "tsx", "mjs", "js"],
moduleNameMapper: {
"\\.(jpg|png|otf|svg|ttf|woff|woff2)$": "<rootDir>/test/jest-file-stub.js",
"\\.(css)$": "identity-obj-proxy",
},
rootDir: "src",
setupFiles: ["<rootDir>/test/jest-setup.js"],
testMatch: ["**/**\\.test\\.ts", "**/**\\.test\\.tsx"],
testPathIgnorePatterns: ["/node_modules/"],
transform: {
"^.+\\.ts$": "ts-jest",
"^.+\\.tsx$": "ts-jest",
"^.+\\.js$": "babel-jest",
},
};
.babelrc
{
"presets": [
[
"@babel/preset-env",
{
"useBuiltIns": "usage",
"shippedProposals": true,
"corejs": 3
}
]
],
"plugins": [
["transform-react-jsx", {"pragma": "h"}],
"@babel/plugin-proposal-optional-chaining"
]
}
This version and its dependencies work:
-
jest-fetch-mock
2.1.2- depends on
cross-fetch
^2.2.3 (results in 2.2.3)- depends on
node-fetch
2.1.2
- depends on
- depends on
package.json
of node-fetch
2.1.2
{
"main": "lib/index.js",
"module": "lib/index.es.js",
}
This version fails:
-
jest-fetch-mock
3.0.3- depends on
cross-fetch
^3.0.4- depends on
node-fetch
2.6.0
- depends on
- depends on
package.json
of node-fetch
2.6.0
{
"main": "lib/index",
"module": "lib/index.mjs",
}
This is the problem AFAIK. I had the same problem with a dependency of another dependency while compiling with Webpack if it has a module with the mjs
extension.
The maintainers of node-fetch
seems to found the problem or fixed it by accident in the @next version my setting module to a file with a js extension:
package.json
of node-fetch
@next
{
"main": "./dist/index.js",
"module": "./src/index.js",
}
Changing the dependency of cross-fetch
to node-fetch@next
then it works again. (aside of the Fact that it wants absolute urls so fetch("some-file.json") will not work. If that got fixed the tests run again)
Workaround
Removing the
mjs
extension frommoduleFileExtensions
injest.config.js
works. I found this while putting this report together... ^^
I will open this issue nevertheless because it might help someone find a solution for this or a similar problem. I needed a while... :D
If I'm understanding this correctly... If this is being caused by node-fetch/blob/v2.6.1/package.json#L5
not having a .js
extension, I think this issue should be filed in node-fetch
instead to report the accidental breaking change.
2.6.2 now has extension in the main file