Lexical version: 0.23.1
Steps To Reproduce
- Import Lexical modules
- Run tests in Vitest 3
- Unexpected modules get imported.
For example, I've seen these 3 files get imported for @lexical/react/LexicalComposerContext when running tests:
node_modules/@lexical/react/LexicalComposerContext.dev.mjs goodnode_modules/@lexical/react/LexicalComposerContext.node.mjs unclear why this is importednode_modules/@lexical/react/LexicalComposerContext.prod.mjs bad, we're not in prod, and leads to conflicts/crashes
Link to code example: https://stackblitz.com/edit/facebook-lexical-daeb4mtf?file=vite.config.ts,src%2Fmy.test.tsx
Run npm t in the code example above, you should get this error:
Error: Minified Lexical error #8; visit https://lexical.dev/docs/error?code=8 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
at eval (file:///home/projects/facebook-lexical-daeb4mtf/node_modules/@lexical/react/LexicalComposerContext.prod.mjs:26:297)
at u (file:///home/projects/facebook-lexical-daeb4mtf/node_modules/@lexical/react/LexicalComposerContext.prod.mjs:26:702)
at ToolbarPlugin (/home/projects/facebook-lexical-daeb4mtf/src/my.test.tsx:7:3)
at renderWithHooks (/home/projects/facebook-lexical-daeb4mtf/node_modules/react-dom/cjs/react-dom.development.js:15486:18)
at mountIndeterminateComponent (/home/projects/facebook-lexical-daeb4mtf/node_modules/react-dom/cjs/react-dom.development.js:20103:13)
at beginWork (/home/projects/facebook-lexical-daeb4mtf/node_modules/react-dom/cjs/react-dom.development.js:21626:16)
at HTMLUnknownElement.callCallback (/home/projects/facebook-lexical-daeb4mtf/node_modules/react-dom/cjs/react-dom.development.js:4164:14)
at HTMLUnknownElement.callTheUserObjectsOperation (/home/projects/facebook-lexical-daeb4mtf/node_modules/jsdom/lib/jsdom/living/generated/EventListener.js:26:30)
at innerInvokeEventListeners (/home/projects/facebook-lexical-daeb4mtf/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:350:25)
at invokeEventListeners (/home/projects/facebook-lexical-daeb4mtf/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:286:3)
Error: Uncaught [Error: Minified Lexical error #8; visit https://lexical.dev/docs/error?code=8 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.]
at reportException (/home/projects/facebook-lexical-daeb4mtf/node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:66:24)
at innerInvokeEventListeners (/home/projects/facebook-lexical-daeb4mtf/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:353:9)
at invokeEventListeners (/home/projects/facebook-lexical-daeb4mtf/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:286:3)
at HTMLUnknownElementImpl._dispatch (/home/projects/facebook-lexical-daeb4mtf/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:233:9)
at HTMLUnknownElementImpl.dispatchEvent (/home/projects/facebook-lexical-daeb4mtf/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:104:17)
at HTMLUnknownElement.dispatchEvent (/home/projects/facebook-lexical-daeb4mtf/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:241:34)
at Object.invokeGuardedCallbackDev (/home/projects/facebook-lexical-daeb4mtf/node_modules/react-dom/cjs/react-dom.development.js:4213:16)
at invokeGuardedCallback (/home/projects/facebook-lexical-daeb4mtf/node_modules/react-dom/cjs/react-dom.development.js:4277:31)
at beginWork$1 (/home/projects/facebook-lexical-daeb4mtf/node_modules/react-dom/cjs/react-dom.development.js:27490:7)
at performUnitOfWork (/home/projects/facebook-lexical-daeb4mtf/node_modules/react-dom/cjs/react-dom.development.js:26599:12) Error: Minified Lexical error #8; visit https://lexical.dev/docs/error?code=8 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
at eval (file:///home/projects/facebook-lexical-daeb4mtf/node_modules/@lexical/react/LexicalComposerContext.prod.mjs:26:297)
at u (file:///home/projects/facebook-lexical-daeb4mtf/node_modules/@lexical/react/LexicalComposerContext.prod.mjs:26:702)
at ToolbarPlugin (/home/projects/facebook-lexical-daeb4mtf/src/my.test.tsx:7:3)
at renderWithHooks (/home/projects/facebook-lexical-daeb4mtf/node_modules/react-dom/cjs/react-dom.development.js:15486:18)
at mountIndeterminateComponent (/home/projects/facebook-lexical-daeb4mtf/node_modules/react-dom/cjs/react-dom.development.js:20103:13)
at beginWork (/home/projects/facebook-lexical-daeb4mtf/node_modules/react-dom/cjs/react-dom.development.js:21626:16)
at HTMLUnknownElement.callCallback (/home/projects/facebook-lexical-daeb4mtf/node_modules/react-dom/cjs/react-dom.development.js:4164:14)
at HTMLUnknownElement.callTheUserObjectsOperation (/home/projects/facebook-lexical-daeb4mtf/node_modules/jsdom/lib/jsdom/living/generated/EventListener.js:26:30)
at innerInvokeEventListeners (/home/projects/facebook-lexical-daeb4mtf/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:350:25)
at invokeEventListeners (/home/projects/facebook-lexical-daeb4mtf/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:286:3)
The above error occurred in the <ToolbarPlugin> component:
at ToolbarPlugin
at p
at Component
The current behavior
Both development and production modules get imported in tests.
The expected behavior
Only development modules should be imported in tests.
Impact of fix
This is breaking tests when I tried updating from Vitest 2 to Vitest 3.
In node_modules/@lexical/react/LexicalComposerContext.node.mjs, the prod module is imported because NODE_ENV is "test".
The fix would look like this:
-const mod = await (process.env.NODE_ENV === 'development' ? import('./LexicalComposerContext.dev.mjs') : import('./LexicalComposerContext.prod.mjs'));
+const mod = await (process.env.NODE_ENV === 'production' ? import('./LexicalComposerContext.prod.mjs') : import('./LexicalComposerContext.dev.mjs'));This should be applied in all the other files where NODE_ENV is checked.
Related issue in Vitest: vitest-dev/vitest#7070
Regardless of whether or not this should be fixed in Vitest, I think tests should use the development modules, not the production modules.
Lexical version: 0.23.1
Steps To Reproduce
For example, I've seen these 3 files get imported for
@lexical/react/LexicalComposerContextwhen running tests:node_modules/@lexical/react/LexicalComposerContext.dev.mjsgoodnode_modules/@lexical/react/LexicalComposerContext.node.mjsunclear why this is importednode_modules/@lexical/react/LexicalComposerContext.prod.mjsbad, we're not in prod, and leads to conflicts/crashesLink to code example: https://stackblitz.com/edit/facebook-lexical-daeb4mtf?file=vite.config.ts,src%2Fmy.test.tsx
Run
npm tin the code example above, you should get this error:The current behavior
Both development and production modules get imported in tests.
The expected behavior
Only development modules should be imported in tests.
Impact of fix
This is breaking tests when I tried updating from Vitest 2 to Vitest 3.
In
node_modules/@lexical/react/LexicalComposerContext.node.mjs, theprodmodule is imported becauseNODE_ENVis"test".The fix would look like this:
This should be applied in all the other files where
NODE_ENVis checked.Related issue in Vitest: vitest-dev/vitest#7070
Regardless of whether or not this should be fixed in Vitest, I think tests should use the development modules, not the production modules.