fix(richtext-lexical): empty lines were incorrectly stripped from mdx blocks if doNotTrimChildren was set to true (#10287)

This caused empty lines to disappear from code blocks
This commit is contained in:
Alessio Gravili
2024-12-31 14:58:46 -07:00
committed by GitHub
parent b6de432ab2
commit ee3c2cc16f
6 changed files with 67 additions and 3 deletions

View File

@@ -19,6 +19,7 @@ import { restExamplesTest2 } from './tests/restExamples2.test.js'
import { defaultTests } from './tests/default.test.js'
import { writeFileSync } from 'fs'
import { codeTest1 } from './tests/code1.test.js'
let config: SanitizedConfig
let editorConfig: SanitizedServerEditorConfig
@@ -61,7 +62,12 @@ describe('Lexical MDX', () => {
editorConfig = (richTextField.editor as LexicalRichTextAdapter).editorConfig
})
const INPUT_AND_OUTPUTBase: Tests = [...defaultTests, restExamplesTest1, restExamplesTest2]
const INPUT_AND_OUTPUTBase: Tests = [
...defaultTests,
restExamplesTest1,
restExamplesTest2,
codeTest1,
]
const INPUT_AND_OUTPUT: Tests = INPUT_AND_OUTPUTBase.find((test) => test.debugFlag)
? [INPUT_AND_OUTPUTBase.find((test) => test.debugFlag)]

View File

@@ -10,6 +10,14 @@ export const codeConverter: BlockJSX = {
import: ({ openMatch, children, closeMatch }) => {
const language = openMatch[1]
// Removed first and last \n from children if present
if (children.startsWith('\n')) {
children = children.slice(1)
}
if (children.endsWith('\n')) {
children = children.slice(0, -1)
}
const isSingleLineAndComplete =
!!closeMatch && !children.includes('\n') && openMatch.input?.trim() !== '```' + language

View File

@@ -0,0 +1,12 @@
```ts
import { buildConfig } from 'payload'
import { lexicalEditor } from '@payloadcms/richtext-lexical'
export default buildConfig({
collections: [
// your collections here
],
// Pass the Lexical editor to the root config
editor: lexicalEditor({}),
})
```

View File

@@ -0,0 +1,25 @@
{
"editorState": {
"root": {
"children": [
{
"format": "",
"type": "block",
"version": 2,
"fields": {
"blockType": "Code",
"language": "ts",
"code": "import { buildConfig } from 'payload'\nimport { lexicalEditor } from '@payloadcms/richtext-lexical'\n\nexport default buildConfig({\n collections: [\n // your collections here\n ],\n // Pass the Lexical editor to the root config\n editor: lexicalEditor({}),\n})",
"id": "6774559ba09e004452672523"
}
}
],
"direction": null,
"format": "",
"indent": 0,
"type": "root",
"version": 1
}
},
"frontMatter": []
}

View File

@@ -0,0 +1,14 @@
import { readFileSync } from 'fs'
import path from 'path'
import { fileURLToPath } from 'url'
import type { Test } from '../int.spec.js'
const filename = fileURLToPath(import.meta.url)
const dirname = path.dirname(filename)
export const codeTest1: Test = {
input: readFileSync(path.resolve(dirname, 'code1.input.mdx'), 'utf-8'),
rootChildren: JSON.parse(readFileSync(path.resolve(dirname, 'code1.output.json'), 'utf-8'))
.editorState.root.children,
}