I upgraded my react project to use monaco-editor version 0.21.0, since then the jest tests for files where monaco-editor is being imported have started to fail with the following error:
ā Test suite failed to run
/Users/omerharoon/Documents/code/packages/webapp/node_modules/monaco-editor/esm/vs/editor/editor.api.js:20
const global = self; // Set defaults for standalone editor
^
SyntaxError: Identifier 'global' has already been declared
at compileFunction (<anonymous>)
2 |
3 | import React from 'react';
> 4 | import * as monaco from 'monaco-editor';
| ^
5 | import { Resizable } from 're-resizable';
6 | import {
7 | getLanguageFromFilename,
at Runtime._execModule (node_modules/jest-runtime/build/index.js:1179:56)
at Object.<anonymous> (src/components/helpers/MonacoEditor/index.tsx:4:1)
at Object.<anonymous> (src/components/helpers/MonacoEditor/monaco_colorization.spec.tsx:6:1)
This started occurring right after the upgrade, the old version was 0.19.3 and all the tests worked fine on that version. monaco-editor-webpack-plugin was also upgraded from 1.9.0 to 2.0.0
We're importing monaco directly from
node_modules/monaco-editor/esm/vs/editor/editor.api
in order to overcome lazy loading issues.
Jest Config:
"jest": {
"modulePaths": [
"<rootDir>/src"
],
"collectCoverageFrom": [
"**/*.{js,jsx,ts,tsx}",
"!**/*.d.ts",
"!**/node_modules/**",
"!**/public/**",
"!**/next.config.js",
"!**/server.js"
],
"setupFilesAfterEnv": [
"<rootDir>/setupTests.js"
],
"testPathIgnorePatterns": [
"<rootDir>/node_modules/",
"<rootDir>/.next/",
"<rootDir>/public/",
"<rootDir>/config/",
"<rootDir>/next.config.js",
"<rootDir>/server.js",
"<rootDir>/build/"
],
"transform": {
"^.+\\.[jt]sx?$": "babel-jest",
"^.+\\.css$": "<rootDir>/config/jest/cssTransform.js"
},
"transformIgnorePatterns": [
"/node_modules/(?!monaco-editor)/",
"^.+\\.module\\.(css|sass|scss)$"
],
"moduleNameMapper": {
"^monaco-editor$": "monaco-editor/esm/vs/editor/editor.api",
"^.+\\.module\\.(css|sass|scss)$": "identity-obj-proxy"
},
"coverageReporters": [
"text",
[
"lcov",
{
"projectRoot": "../../"
}
]
]},