Bug: convertLexicalToHTML returns empty HTML for valid Lexical JSON (Payload 3.46.0/3.47.0)

[fredrickyang]

Describe the Bug

Describe the bug
When using @payloadcms/richtext-lexical/html’s convertLexicalToHTML with a valid Lexical JSON object (exported from a Payload 3.x richText field), the function always returns

, even though the JSON contains valid paragraphs and text nodes.

To Reproduce
All Payload-related packages are set to 3.46.0 or 3.47.0 (see package.json below).
Node version: [your Node version, e.g. 20.11.1]
Use the following test script:

import { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html';
import fs from 'fs';

const lexicalJson = JSON.parse(fs.readFileSync('./sample-lexical.json', 'utf-8'));
const html = convertLexicalToHTML(lexicalJson);
console.log('Generated HTML:', html);

4. Use this sample Lexical JSON (from a real Payload document):

{
"root": {
"children": [
{
"children": [
{
"detail": 0,
"format": 0,
"mode": "normal",
"style": "",
"text": "Rok Beads r39 (aksesories dua layer dibagian depan rok)",
"type": "text",
"version": 1
}
],
"direction": "ltr",
"format": "",
"indent": 0,
"type": "paragraph",
"version": 1,
"textFormat": 0,
"textStyle": ""
}
// ...more paragraphs omitted for brevity...
],
"direction": "ltr",
"format": "",
"indent": 0,
"type": "root",
"version": 1
}
}

Expected behavior
The function should return HTML with

tags for each paragraph, e.g.:

<div class="payload-richtext">
<p>Rok Beads r39 (aksesories dua layer dibagian depan rok)</p>
<!-- ... -->
</div>

Actual behavior
The function always returns:

<div class="payload-richtext"></div>

Environment:

• Payload: 3.46.0 / 3.47.0
• @payloadcms/richtext-lexical: 3.46.0 / 3.47.0
• Node: [your Node version]

package.json dependencies:

{
"@payloadcms/db-mongodb": "3.46.0",
"@payloadcms/next": "3.46.0",
"@payloadcms/payload-cloud": "3.46.0",
"@payloadcms/richtext-lexical": "3.46.0",
"@payloadcms/storage-s3": "3.46.0",
"@payloadcms/ui": "3.46.0",
"payload": "3.46.0",
// ...other dependencies...
}

Additional context

• I have tried with both 3.46.0 and 3.47.0 for all packages.
• I have deleted node_modules and lockfile and reinstalled.
• The Lexical JSON is valid and matches the expected structure.
• This happens both in my Payload hooks and in a standalone Node script.

Please advise if there is a workaround or if this is a known issue.

Link to the code that reproduces this issue

https://github.com/fredrickyang/payload-lexical-html-bug-repro

Reproduction Steps

Reproduction Steps

1. Clone the repo:

   git clone https://github.com/fredrickyang/payload-lexical-html-bug-repro
   cd payload-lexical-html-bug-repro

2. Install dependencies:

   npm install

3. Run the test script:

   node test-lexical-html.mjs

4. Observe the output:
   The script prints:

   Generated HTML: <div class="payload-richtext"></div>
   

   (Expected: HTML with <p> tags for each paragraph in the Lexical JSON.)

---

Environment:

• Node.js version: node -v (please specify your version)
• Payload: 3.46.0
• @payloadcms/richtext-lexical: 3.46.0

Which area(s) are affected? (Select all that apply)

Not sure

Environment Info

├─┬ @payloadcms/richtext-lexical@3.46.0
│ ├─┬ @payloadcms/next@3.46.0
│ │ ├─┬ @payloadcms/graphql@3.46.0
│ │ │ └── payload@3.46.0 deduped
│ │ └── payload@3.46.0 deduped
│ ├─┬ @payloadcms/ui@3.46.0
│ │ └── payload@3.46.0 deduped
│ └── payload@3.46.0 deduped
└── payload@3.46.0