Can not get updated generated HTML on beforeChange hook for field type ('richText') in lexical editor

[RiteshMRI]

Link to reproduction

No response

Environment Info

Payload: 3.0.0-beta.68
Node.js: 10.7.0
Next.js: 15.0.0-canary.53

Describe the Bug

I have used lexical editor for field of type 'richText', i am not able to get updated generated html in beforeChange hook on save functionality.

Reproduction Steps

1. create collection which contains richText field using lexical editor.
2. also add before change hook in hooks.
3. inside hook, in data, not able to get updated html .

i have also attached screenshot.

Adapters and Plugins

@payloadcms/richtext-lexical -> version "3.0.0-beta.68"

[github-actions[bot]]

This issue has been marked as stale due to lack of activity.

To keep this issue open, please indicate that it is still relevant in a comment below.

[github-actions[bot]]

This issue was automatically closed due to lack of activity.

[GermanJablo]

The lexicalHTMLField function was never meant to update every time the rich text field changes—it only runs when the HTML field is read. You can see, looking at how this function is used, that the richtext field has no knowledge of the field generated by lexicalHTMLField. Instead, the HTML field uses an afterRead hook to generate its value.

Judging by the amount of feedback in both this issue and this other one, it’s clear that this behavior wasn’t obvious. Since then, we’ve improved the documentation around rich text converters, but I’ll open a new PR soon to better explain the tradeoffs of using lexicalHTMLField.

The recommended way to render rich text on the frontend is to convert it on demand—either at build time with SSG or during server-side fetch with SSR. This avoids duplicating data in your database. For that, you can use our converters:

• convertLexicalToHTML or convertLexicalToHTMLAsync for HTML
• the RichText component for JSX (which we currently use in our website template)

That said, there’s nothing wrong with using lexicalHTMLField—you just need to understand the tradeoffs: it creates an extra DB column that mirrors the rich text in HTML, and it doesn’t update when the rich text changes—only when the HTML is read. This works fine in many cases, but there are exceptions, like client-side live preview.

If you really need an HTML mirror that updates on every edit, you can write your own beforeChange or afterChange hook on the rich text field to copy the content into another field. Basically, it’s like doing what lexicalHTMLField does, but in reverse.

[github-actions[bot]]

🚀 This is included in version v3.39.0

[github-actions[bot]]

This issue has been automatically locked. Please open a new issue if this issue persists with any additional detail.