Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Lexical Editor: Link and AutoLink not converting to markdown with lexical $convertToMarkdownString #6507

Closed
shawnvogt opened this issue May 25, 2024 · 3 comments · Fixed by #6543
Assignees
Labels
plugin: richtext-lexical @payloadcms/richtext-lexical

Comments

@shawnvogt
Copy link
Contributor

Link to reproduction

https://github.com/TMRRWinc/PayloadLexicalLinkConvertToMarkdownIssue

Describe the Bug

When using the $convertToMarkdownString_function from @lexical/markdown, the Link and AutoLink nodes do not correctly convert.

expected output [link](https://payloadcms.com) actual output link

if the Link and AutoLink nodes from @lexical/link are subbed into the headless editor nodes, the the actual output changes to [link](undefined)

To Reproduce

run the "local API example" test in test/_community/int.spec.ts of the linked reproduction

A richtext field with lexical editor was added to the posts collection. The richtext field has a field hook to convert the lexical state to markdown and attach it to context. A collection AfterChangeHook adds the markdown value to the returned document to make the markdown value available to test against.

OR (follow the steps from the docs and then try to convert a link)

Lexical => Markdown

Export content from the Lexical editor into Markdown format using these steps:

  1. Import your current editor state into the headless editor.
  2. Convert and fetch the resulting markdown string.

Here's the code for it:

import { $convertToMarkdownString } from '@lexical/markdown'
import { sanitizeEditorConfig } from '@payloadcms/richtext-lexical'
import type { SerializedEditorState } from "lexical"

const yourSanitizedEditorConfig = sanitizeEditorConfig(yourEditorConfig) // <= your editor config here
const yourEditorState: SerializedEditorState // <= your current editor state here

// Import editor state into your headless editor
try {
  headlessEditor.setEditorState(headlessEditor.parseEditorState(yourEditorState)) // This should commit the editor state immediately
} catch (e) {
  logger.error({ err: e }, 'ERROR parsing editor state')
}

// Export to markdown
let markdown: string
headlessEditor.getEditorState().read(() => {
  markdown = $convertToMarkdownString(yourSanitizedEditorConfig?.features?.markdownTransformers)
})

Payload Version

2.18.3

Adapters and Plugins

db-mongodb, @payload/richtext-lexical, @lexical/headless, @lexical/markdown

@AlessioGr AlessioGr self-assigned this May 25, 2024
@AlessioGr AlessioGr added the plugin: richtext-lexical @payloadcms/richtext-lexical label May 25, 2024
@denolfe denolfe added the status: needs-triage Possible bug which hasn't been reproduced yet label May 26, 2024
@AlessioGr AlessioGr added status: verified If an issue has been reproduced and removed status: needs-triage Possible bug which hasn't been reproduced yet labels May 29, 2024
@AlessioGr AlessioGr linked a pull request May 29, 2024 that will close this issue
@AlessioGr
Copy link
Member

Thank you for the detailed and helpful issue! Will be fixed in lexical 3.0.0-beta.37 :)

AlessioGr added a commit that referenced this issue May 29, 2024
@AlessioGr
Copy link
Member

Fixed by #6543

@github-actions github-actions bot removed the status: verified If an issue has been reproduced label May 29, 2024
Copy link
Contributor

github-actions bot commented Sep 7, 2024

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

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Sep 7, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
plugin: richtext-lexical @payloadcms/richtext-lexical
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants