-
Notifications
You must be signed in to change notification settings - Fork 455
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Bug]: verbatimModuleSyntax support #4081
Comments
The error says that option only works with ESM mode while you are using commonjs mode. You can check documentation how to enable ESM mode. Thanks. |
Thanks for reply. I have never seen the docs since I've used jest without esm mode until now with no issues. However, I've followed the docs. And getting the same error even wit modified config: /** @type {import('ts-jest').JestConfigWithTsJest} */
module.exports = {
moduleNameMapper: {
'^(\\.{1,2}/.*)\\.js$': '$1',
},
preset: 'ts-jest/presets/default-esm',
transform: {
'^.+\\.tsx?$': [
'ts-jest',
{ useESM: true },
],
},
}; |
Sorry the doc was a bit outdated, there is warning about using the doc for ESM needs to be updated accordingly. the error you saw came from TS type checking similar to you should follow the manual configuration under ESM support doc which gives more control |
I have inspected /** @type {import('ts-jest').JestConfigWithTsJest} */
module.exports = {
extensionsToTreatAsEsm: ['.ts', '.tsx', '.mts'],
moduleNameMapper: {
'^(\\.{1,2}/.*)\\.js$': '$1',
},
transform: {
'^.+\\.tsx?$': [
'ts-jest',
{ useESM: true },
],
},
}; tsconfig has |
Would you please put a reproduce example with this https://github.com/kulshekhar/ts-jest/tree/main/examples/ts-only |
on it |
Hi @ahnpnl , I'm still facing this issue. I've tried the default preset: {
preset: 'ts-jest/presets/default-esm', // or other ESM presets
moduleNameMapper: { '^(\\.{1,2}/.*)\\.js$': '$1' },
testEnvironment: 'node',
testMatch: ['<rootDir>/**/test/*.ts', '<rootDir>/**/test/types/*.ts'],
collectCoverageFrom: ['src/**'],
} and the manual config: {
extensionsToTreatAsEsm: ['.ts', '.tsx', '.mts'],
transform: {
'^.+\\.tsx?$': [
'ts-jest',
{ useESM: true, isolatedModules: false },
],
},
moduleNameMapper: { '^(\\.{1,2}/.*)\\.js$': '$1' },
testEnvironment: 'node',
testMatch: ['<rootDir>/**/test/*.ts', '<rootDir>/**/test/types/*.ts'],
collectCoverageFrom: ['src/**'],
} However, none of them worked. Any suggestion? |
@juanjoDiaz You can use this PR example to try out #4083 note that, this new tsconfig option only works with ESM mode so you need to choose the correct jest config file in one of those |
Hi @ahnpnl , Thanks for the quick response. I tried import preset from 'ts-jest/presets/index.js'
/** @type {import('ts-jest').JestConfigWithTsJest} */
export default {
...preset.defaultsESM,
transform: {
'^.+\\.tsx?$': [
'ts-jest',
{
useESM: true,
},
],
},
} as per the PR but I'm getting the same error. Can you be a bit more specific on where the issue is and what setting in the config would allow me to treat the "jest.config.ts" as an esm module? |
|
But Jest is a js-only solution, right? If my jest config is a TS file, it must be parsed by ts-node isn't it? |
Jest handles loading config while |
Indeed. |
|
I haven't been able to figure out the root cause of this issue, but after reviewing the Below is a summary of the changes that I made to get ts-jest working with TypeScript 5; hopefully this will help some folks who come across this issue in the future. // ./package.json
// (trimmed to just the relevant parts)
"devDependencies": {
"@types/jest": "^29.5.0",
"jest": "^29.5.0",
"ts-jest": "^29.1.0",
"typescript": "^5.0.4"
} // ./tsconfig.json
// (trimmed to just the relevant parts)
"esModuleInterop": true,
- "importsNotUsedAsValues": "error",
- "isolatedModules": true,
"module": "esnext",
"moduleResolution": "node",
"strict": true,
"target": "es2022",
+ "verbatimModuleSyntax": true
}
} // ./config/jest.config.js
// (trimmed to just the relevant parts)
transform: {
- ".ts": ["ts-jest"],
+ ".ts": [
+ "ts-jest",
+ {
+ // Note: We shouldn't need to include `isolatedModules` here because it's a deprecated config option in TS 5,
+ // but setting it to `true` fixes the `ESM syntax is not allowed in a CommonJS module when
+ // 'verbatimModuleSyntax' is enabled` error that we're seeing when running our Jest tests.
+ isolatedModules: true,
+ useESM: true,
+ },
+ ],
}, |
That solution doesn't work for me 🙁 I get the error when parsing the actual |
@dustin-ruetz Thanks, this answer is useful. // jest.config.js
transform: {
+ '.ts': ['ts-jest', { tsconfig: './tsconfig.jest.json' }],
},
{
"extends": "./tsconfig.json",
"compilerOptions": {
"verbatimModuleSyntax": false
}
}
|
If you use a diff --git a/__tests__/tsconfig.json b/__tests__/tsconfig.json
--- /dev/null
+++ b/__tests__/tsconfig.json
@@ -0,0 +1,6 @@
+{
+ "extends": "../tsconfig.json",
+ "compilerOptions": {
+ "verbatimModuleSyntax": false
+ }
+} diff --git a/jest.config.ts b/jest.config.ts
--- a/jest.config.ts
+++ b/jest.config.ts
@@ -55,6 +55,10 @@ const config: Config = {
// process `*.js` files with `babel-jest`
'^.+\\.js$': 'babel-jest',
'^.+\\.vue$': '@vue/vue2-jest',
+ '^.+\\.ts$': ['ts-jest', {
+ // @see https://github.com/kulshekhar/ts-jest/issues/4081
+ tsconfig: './__tests__/tsconfig.json',
+ }],
},
transformIgnorePatterns: [
'node_modules/(?!(' + ignorePatterns.join('|') + ')/)', diff --git a/tsconfig.json b/tsconfig.json
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -19,7 +19,8 @@
// these options are overrides used only by ts-node
// same as our --compilerOptions flag and our TS_NODE_COMPILER_OPTIONS environment variable
"compilerOptions": {
- "module": "commonjs"
+ "module": "commonjs",
+ "verbatimModuleSyntax": false
}
}
} |
yup - same here. the issue always happened when resolving any ESM jest config file (including ts config files), it gave the original error: seems like the issue has to do with parsing the config file in ESM, but typescript is used (I believe) to do so, but TypeScript keeps complaining about // jest.config.cjs
/** @type {import('ts-jest').JestConfigWithTsJest} */
module.exports = {
+ globals: {
+ 'ts-jest': {
+ useESM: true,
+ tsconfig: {
+ verbatimModuleSyntax: false,
+ },
+ },
+ },
- transform: {
- '.ts': ['ts-jest', { tsconfig: './tsconfig.jest.json' }],
- },
preset: 'ts-jest/presets/default-esm',
testEnvironment: 'node',
}; when i run > jest
ts-jest[ts-jest-transformer] (WARN) Define `ts-jest` config under `globals` is deprecated. Please do
transform: {
<transform_regex>: ['ts-jest', { /* ts-jest config goes here in Jest */ }],
},
PASS test/test1.spec.ts
... this method very simply disables the it seems to me likely that don't exactly have time to create a new issue from this, but is very reproducible if you just switch the place of the tsconfig object/path from |
The solution from @seanblonien does not work for me as well. (It's February 2024). I decided to bury Jest and go with Vitest. In my Svelte project that works out of the box. The question remains as to how long this system will work. |
If I have package.json containing "type": "module", node is complaining if .js is missing. Therefore tsconfig.jest.json has to have "verbatimModuleSyntax": true. |
Can you point at an example repository where this is working? |
Just commenting here in case most of you are using https://johnnyreilly.com/typescript-5-importsnotusedasvalues-error-eslint-consistent-type-imports If you are, then it appears that you only need: "rules": {
"@typescript-eslint/consistent-type-imports": "error"
} and if you're using vscode, then also this in "editor.formatOnSave": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "always", // or explicit
"source.fixAll": "always", // or explicit
},
"eslint.enable": true,
"eslint.format.enable": true, You can can avoid all these errors by not using that option, but still get the eslint behaviour. Yes i just suggested fixing the problem by turning the errors off. 😅 |
- Because of error "ESM syntax is not allowed in a CommonJS module when 'verbatimModuleSyntax' is enabled." when running tests. - The GitHub issue also suggested to just use the eslint version: kulshekhar/ts-jest#4081
More precisely transpiled by 'ts-node'. |
This is still an issue in Aug 2024 FYI. Specifically |
|
Why is this issue closed as "completed" ? Suppose you have an ESM module (package.json contains "module": "nodenext",
"moduleResolution": "nodenext",
"verbatimModuleSyntax": true,
"esModuleInterop": true Your jest config (defined in jest.config.js, ie. ts-node not involved), as recommended by the doc (except for the CJS syntax obviously, and without the unnecessary / redundant settings that are already [pre]set) : export default {
preset: 'ts-jest/presets/default-esm'
}; You run your tests and get the error : "ESM syntax is not allowed in a CommonJS module when 'verbatimModuleSyntax' is enabled" 😮. Adding export default {
preset: 'ts-jest/presets/default-esm',
transform: {
'.ts': [
'ts-jest',
{
isolatedModules: true
}
]
}
}; 😮 Would it not be a bug ? We shouldn't have to set This is not a feature request. |
The original report is about jest config in typescript doesn’t work with this option. We closed this issue because However, your issue is a different one which is related to #4198 |
Ok, great. So why the error doesn't reflect that with a clear message : ts-jest doesn’t handle "verbatimModuleSyntax" ?
How is it related ?
|
I think there are 2 things in this issue: one is about Jest config in typescript doesn't work with If you have issues with your If you have transforming issue, for example your other |
All you need to reproduce the issue is in my first comment. The content of my .ts files is not relevant. Just take an esm package with the config I mentioned and an index.ts file that exports something, then try to import it in a test file and see the results. Note I use |
I guess I found a solution.
The above solution will enable ESM syntax in import { createDefaultEsmPreset, type JestConfigWithTsJest } from 'ts-jest';
const preset = createDefaultEsmPreset({
// A separate TypeScript configuration file for Jest.
tsconfig: './tsconfig.jest.json',
});
const jestConfig: JestConfigWithTsJest = {
...preset,
// Other options.
};
export default jestConfig; |
Version
v29.1.0
Steps to reproduce
I have upgraded to TS v5. I had to replace
importsNotUsedAsValues: 'error'
withverbatimModuleSyntax: true
Expected behavior
No error.
Actual behavior
for
import { xxx } from './xxx';
Debug log
https://gist.github.com/simPod/90d2228089b7a8b1b16a827f73aa71f2
Additional context
config
Environment
The text was updated successfully, but these errors were encountered: