[lexical-code][breaking change] Bug Fix: explicitly import instead of window. to support code nodes in nodejs

[nadine-nguyen]

Description

Describe the changes in this pull request

Remove reference to window in CodeNode so the package can be used in node js. This is done by referencing Prism conditionally using global.Prism if it is in an environment where window is undefined

Closes #6563

Test plan

Before

Insert relevant screenshots/recordings/automated-tests

window is undefined error appears when creating a code node in a headless editor in a nodejs environment

After

Insert relevant screenshots/recordings/automated-tests

No error appears

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
lexical	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 29, 2024 0:30am
lexical-playground	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 29, 2024 0:30am

[github-actions]

size-limit report 📦

Path	Size
lexical - cjs	29.38 KB (0%)
lexical - esm	29.22 KB (0%)
@lexical/rich-text - cjs	37.87 KB (0%)
@lexical/rich-text - esm	31.08 KB (0%)
@lexical/plain-text - cjs	36.45 KB (0%)
@lexical/plain-text - esm	28.44 KB (0%)
@lexical/react - cjs	39.64 KB (0%)
@lexical/react - esm	32.52 KB (0%)

[ivailop7]

There seems to be a build issue with Astro in the integration tests

scripts/tests/integration/fixtures/lexical-esm-astro-react › install & build succeeded

ChildProcessError: Command failed: npm run build
Named export 'languages' not found. The requested module 'prismjs' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'prismjs';

PrismJS is kind of abandoned and doesn't support ESM, we should probably move to Shiki at this point.

[ivailop7]

For this particular case, to unblock, since all the supported languages are listed in here: https://github.com/facebook/lexical/blob/main/packages/lexical-code/src/CodeHighlighterPrism.ts
You can export a const set with the listed languages here and check that particular set. Suboptimal, but should get things working.

[etrepum]

For what it's worth, last time I tried to make improvements to the way code highlighting imports prism it got undone by meta

[etrepum]

See also #5828

[nadine-nguyen]

@etrepum Thanks for the link!
@ivailop7 I've decided to switch between window.Prism vs global.Prism, depending on whether window is defined. The integration check is now passing with this change. Let me know your thoughts

[etrepum]

Looks good to me, but no idea if it will break Meta's build or not

[ivailop7]

@potatowagon could you check if this change would work for you internally?

[potatowagon]

@potatowagon could you check if this change would work for you internally?

@potatowagon could you check if this change would work for you internally?

thanks for the headsup, labeled this as breaking change as a memo for further testing internally