Lexical: Updated tests for node changes

This commit is contained in:
Dan Brown 2024-12-04 20:03:05 +00:00
parent 9fdd100f2d
commit d00cf6e1ba
No known key found for this signature in database
GPG Key ID: 46D9F943C24A2EF9
17 changed files with 301 additions and 380 deletions

File diff suppressed because one or more lines are too long

View File

@ -974,7 +974,7 @@ describe('LexicalEditor tests', () => {
editable ? 'editable' : 'non-editable'
})`, async () => {
const JSON_EDITOR_STATE =
'{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"123","type":"text","version":1}],"direction":null,"format":"","indent":0,"type":"paragraph","version":1,"textStyle":""}],"direction":null,"format":"","indent":0,"type":"root","version":1}}';
'{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"123","type":"text","version":1}],"direction":null,"type":"paragraph","version":1,"textStyle":""}],"direction":null,"type":"root","version":1}}';
init();
const contentEditable = editor.getRootElement();
editor.setEditable(editable);
@ -1047,8 +1047,6 @@ describe('LexicalEditor tests', () => {
__cachedText: null,
__dir: null,
__first: paragraphKey,
__format: 0,
__indent: 0,
__key: 'root',
__last: paragraphKey,
__next: null,
@ -1059,10 +1057,11 @@ describe('LexicalEditor tests', () => {
__type: 'root',
});
expect(parsedParagraph).toEqual({
"__alignment": "",
__dir: null,
__first: textKey,
__format: 0,
__indent: 0,
__id: '',
__inset: 0,
__key: paragraphKey,
__last: textKey,
__next: null,
@ -1070,7 +1069,6 @@ describe('LexicalEditor tests', () => {
__prev: null,
__size: 1,
__style: '',
__textFormat: 0,
__textStyle: '',
__type: 'paragraph',
});
@ -1129,8 +1127,6 @@ describe('LexicalEditor tests', () => {
__cachedText: null,
__dir: null,
__first: paragraphKey,
__format: 0,
__indent: 0,
__key: 'root',
__last: paragraphKey,
__next: null,
@ -1141,10 +1137,11 @@ describe('LexicalEditor tests', () => {
__type: 'root',
});
expect(parsedParagraph).toEqual({
"__alignment": "",
__dir: null,
__first: textKey,
__format: 0,
__indent: 0,
__id: '',
__inset: 0,
__key: paragraphKey,
__last: textKey,
__next: null,
@ -1152,7 +1149,6 @@ describe('LexicalEditor tests', () => {
__prev: null,
__size: 1,
__style: '',
__textFormat: 0,
__textStyle: '',
__type: 'paragraph',
});

View File

@ -54,8 +54,6 @@ describe('LexicalEditorState tests', () => {
__cachedText: 'foo',
__dir: null,
__first: '1',
__format: 0,
__indent: 0,
__key: 'root',
__last: '1',
__next: null,
@ -66,10 +64,11 @@ describe('LexicalEditorState tests', () => {
__type: 'root',
});
expect(paragraph).toEqual({
"__alignment": "",
__dir: null,
__first: '2',
__format: 0,
__indent: 0,
__id: '',
__inset: 0,
__key: '1',
__last: '2',
__next: null,
@ -77,7 +76,6 @@ describe('LexicalEditorState tests', () => {
__prev: null,
__size: 1,
__style: '',
__textFormat: 0,
__textStyle: '',
__type: 'paragraph',
});
@ -113,7 +111,7 @@ describe('LexicalEditorState tests', () => {
});
expect(JSON.stringify(editor.getEditorState().toJSON())).toEqual(
`{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"Hello world","type":"text","version":1}],"direction":null,"format":"","indent":0,"type":"paragraph","version":1,"textFormat":0,"textStyle":""}],"direction":null,"format":"","indent":0,"type":"root","version":1}}`,
`{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"Hello world","type":"text","version":1}],"direction":null,"type":"paragraph","version":1,"id":"","alignment":"","inset":0,"textStyle":""}],"direction":null,"type":"root","version":1}}`,
);
});
@ -140,8 +138,6 @@ describe('LexicalEditorState tests', () => {
__cachedText: '',
__dir: null,
__first: null,
__format: 0,
__indent: 0,
__key: 'root',
__last: null,
__next: null,

File diff suppressed because one or more lines are too long

View File

@ -84,8 +84,6 @@ describe('LexicalElementNode tests', () => {
expect(node.exportJSON()).toStrictEqual({
children: [],
direction: null,
format: '',
indent: 0,
type: 'test_block',
version: 1,
});

View File

@ -48,11 +48,11 @@ describe('LexicalParagraphNode tests', () => {
// logic is in place in the corresponding importJSON method
// to accomodate these changes.
expect(node.exportJSON()).toStrictEqual({
alignment: '',
children: [],
direction: null,
format: '',
indent: 0,
textFormat: 0,
id: '',
inset: 0,
textStyle: '',
type: 'paragraph',
version: 1,
@ -127,6 +127,21 @@ describe('LexicalParagraphNode tests', () => {
});
});
test('id is supported', async () => {
const {editor} = testEnv;
let paragraphNode: ParagraphNode;
await editor.update(() => {
paragraphNode = new ParagraphNode();
paragraphNode.setId('testid')
$getRoot().append(paragraphNode);
});
expect(testEnv.innerHTML).toBe(
'<p id="testid"><br></p>',
);
});
test('$createParagraphNode()', async () => {
const {editor} = testEnv;

View File

@ -77,8 +77,6 @@ describe('LexicalRootNode tests', () => {
expect(node.exportJSON()).toStrictEqual({
children: [],
direction: null,
format: '',
indent: 0,
type: 'root',
version: 1,
});

View File

@ -206,7 +206,7 @@ describe('LexicalHeadlessEditor', () => {
cleanup();
expect(html).toBe(
'<p>hello world</p>',
'<p dir="ltr">hello world</p>',
);
});
});

View File

@ -176,7 +176,7 @@ describe('HTML', () => {
});
expect(html).toBe(
'<p style="text-align: center;">Hello world!</p>',
'<p class="align-center">Hello world!</p>',
);
});
@ -206,7 +206,7 @@ describe('HTML', () => {
});
expect(html).toBe(
'<p style="text-align: center;">Hello world!</p>',
'<p class="align-center">Hello world!</p>',
);
});
});

View File

@ -62,7 +62,7 @@ describe('LexicalListItemNode tests', () => {
expectHtmlToBeEqual(
listItemNode.createDOM(editorConfig).outerHTML,
html`
<li value="1" class="my-listItem-item-class"></li>
<li value="1"></li>
`,
);
@ -90,7 +90,7 @@ describe('LexicalListItemNode tests', () => {
expectHtmlToBeEqual(
domElement.outerHTML,
html`
<li value="1" class="my-listItem-item-class"></li>
<li value="1"></li>
`,
);
const newListItemNode = new ListItemNode();
@ -106,7 +106,7 @@ describe('LexicalListItemNode tests', () => {
expectHtmlToBeEqual(
domElement.outerHTML,
html`
<li value="1" class="my-listItem-item-class"></li>
<li value="1"></li>
`,
);
});
@ -125,7 +125,7 @@ describe('LexicalListItemNode tests', () => {
expectHtmlToBeEqual(
domElement.outerHTML,
html`
<li value="1" class="my-listItem-item-class"></li>
<li value="1"></li>
`,
);
const nestedListNode = new ListNode('bullet', 1);
@ -142,7 +142,7 @@ describe('LexicalListItemNode tests', () => {
expectHtmlToBeEqual(
domElement.outerHTML,
html`
<li value="1" class="my-listItem-item-class my-nested-list-listItem-class"></li>
<li value="1" style="list-style: none;"></li>
`,
);
});
@ -486,53 +486,43 @@ describe('LexicalListItemNode tests', () => {
});
expectHtmlToBeEqual(
testEnv.outerHTML,
testEnv.innerHTML,
html`
<div
contenteditable="true"
style="user-select: text; white-space: pre-wrap; word-break: break-word;"
data-lexical-editor="true">
<ul>
<li value="1">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">x</span>
</li>
<li value="2">
<span data-lexical-text="true">B</span>
</li>
</ul>
</div>
<ul>
<li value="1" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">x</span>
</li>
<li value="2">
<span data-lexical-text="true">B</span>
</li>
</ul>
`,
);
await editor.update(() => x.remove());
expectHtmlToBeEqual(
testEnv.outerHTML,
testEnv.innerHTML,
html`
<div
contenteditable="true"
style="user-select: text; white-space: pre-wrap; word-break: break-word;"
data-lexical-editor="true">
<ul>
<li value="1">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">B</span>
</li>
</ul>
</div>
<ul>
<li value="1" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">B</span>
</li>
</ul>
`,
);
});
@ -566,53 +556,43 @@ describe('LexicalListItemNode tests', () => {
});
expectHtmlToBeEqual(
testEnv.outerHTML,
testEnv.innerHTML,
html`
<div
contenteditable="true"
style="user-select: text; white-space: pre-wrap; word-break: break-word;"
data-lexical-editor="true">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
<li value="2">
<span data-lexical-text="true">x</span>
</li>
<li value="3">
<ul>
<li value="1">
<span data-lexical-text="true">B</span>
</li>
</ul>
</li>
</ul>
</div>
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
<li value="2">
<span data-lexical-text="true">x</span>
</li>
<li value="3" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">B</span>
</li>
</ul>
</li>
</ul>
`,
);
await editor.update(() => x.remove());
expectHtmlToBeEqual(
testEnv.outerHTML,
testEnv.innerHTML,
html`
<div
contenteditable="true"
style="user-select: text; white-space: pre-wrap; word-break: break-word;"
data-lexical-editor="true">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
<li value="2">
<ul>
<li value="1">
<span data-lexical-text="true">B</span>
</li>
</ul>
</li>
</ul>
</div>
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
<li value="2" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">B</span>
</li>
</ul>
</li>
</ul>
`,
);
});
@ -650,57 +630,47 @@ describe('LexicalListItemNode tests', () => {
});
expectHtmlToBeEqual(
testEnv.outerHTML,
testEnv.innerHTML,
html`
<div
contenteditable="true"
style="user-select: text; white-space: pre-wrap; word-break: break-word;"
data-lexical-editor="true">
<ul>
<li value="1">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">x</span>
</li>
<li value="2">
<ul>
<li value="1">
<span data-lexical-text="true">B</span>
</li>
</ul>
</li>
</ul>
</div>
<ul>
<li value="1" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">x</span>
</li>
<li value="2" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">B</span>
</li>
</ul>
</li>
</ul>
`,
);
await editor.update(() => x.remove());
expectHtmlToBeEqual(
testEnv.outerHTML,
testEnv.innerHTML,
html`
<div
contenteditable="true"
style="user-select: text; white-space: pre-wrap; word-break: break-word;"
data-lexical-editor="true">
<ul>
<li value="1">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
<li value="2">
<span data-lexical-text="true">B</span>
</li>
</ul>
</li>
</ul>
</div>
<ul>
<li value="1" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
<li value="2">
<span data-lexical-text="true">B</span>
</li>
</ul>
</li>
</ul>
`,
);
});
@ -746,71 +716,61 @@ describe('LexicalListItemNode tests', () => {
});
expectHtmlToBeEqual(
testEnv.outerHTML,
testEnv.innerHTML,
html`
<div
contenteditable="true"
style="user-select: text; white-space: pre-wrap; word-break: break-word;"
data-lexical-editor="true">
<ul>
<li value="1">
<ul>
<li value="1">
<span data-lexical-text="true">A1</span>
</li>
<li value="2">
<ul>
<li value="1">
<span data-lexical-text="true">A2</span>
</li>
</ul>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">x</span>
</li>
<li value="2">
<ul>
<li value="1">
<span data-lexical-text="true">B</span>
</li>
</ul>
</li>
</ul>
</div>
<ul>
<li value="1" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A1</span>
</li>
<li value="2" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A2</span>
</li>
</ul>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">x</span>
</li>
<li value="2" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">B</span>
</li>
</ul>
</li>
</ul>
`,
);
await editor.update(() => x.remove());
expectHtmlToBeEqual(
testEnv.outerHTML,
testEnv.innerHTML,
html`
<div
contenteditable="true"
style="user-select: text; white-space: pre-wrap; word-break: break-word;"
data-lexical-editor="true">
<ul>
<li value="1">
<ul>
<li value="1">
<span data-lexical-text="true">A1</span>
</li>
<li value="2">
<ul>
<li value="1">
<span data-lexical-text="true">A2</span>
</li>
</ul>
</li>
<li value="2">
<span data-lexical-text="true">B</span>
</li>
</ul>
</li>
</ul>
</div>
<ul>
<li value="1" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A1</span>
</li>
<li value="2" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A2</span>
</li>
</ul>
</li>
<li value="2">
<span data-lexical-text="true">B</span>
</li>
</ul>
</li>
</ul>
`,
);
});
@ -856,71 +816,61 @@ describe('LexicalListItemNode tests', () => {
});
expectHtmlToBeEqual(
testEnv.outerHTML,
testEnv.innerHTML,
html`
<div
contenteditable="true"
style="user-select: text; white-space: pre-wrap; word-break: break-word;"
data-lexical-editor="true">
<ul>
<li value="1">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">x</span>
</li>
<li value="2">
<ul>
<li value="1">
<ul>
<li value="1">
<span data-lexical-text="true">B1</span>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">B2</span>
</li>
</ul>
</li>
</ul>
</div>
<ul>
<li value="1" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">x</span>
</li>
<li value="2" style="list-style: none;">
<ul>
<li value="1" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">B1</span>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">B2</span>
</li>
</ul>
</li>
</ul>
`,
);
await editor.update(() => x.remove());
expectHtmlToBeEqual(
testEnv.outerHTML,
testEnv.innerHTML,
html`
<div
contenteditable="true"
style="user-select: text; white-space: pre-wrap; word-break: break-word;"
data-lexical-editor="true">
<ul>
<li value="1">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
<li value="2">
<ul>
<li value="1">
<span data-lexical-text="true">B1</span>
</li>
</ul>
</li>
<li value="2">
<span data-lexical-text="true">B2</span>
</li>
</ul>
</li>
</ul>
</div>
<ul>
<li value="1" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A</span>
</li>
<li value="2" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">B1</span>
</li>
</ul>
</li>
<li value="2">
<span data-lexical-text="true">B2</span>
</li>
</ul>
</li>
</ul>
`,
);
});
@ -974,81 +924,71 @@ describe('LexicalListItemNode tests', () => {
});
expectHtmlToBeEqual(
testEnv.outerHTML,
testEnv.innerHTML,
html`
<div
contenteditable="true"
style="user-select: text; white-space: pre-wrap; word-break: break-word;"
data-lexical-editor="true">
<ul>
<li value="1">
<ul>
<li value="1">
<span data-lexical-text="true">A1</span>
</li>
<li value="2">
<ul>
<li value="1">
<span data-lexical-text="true">A2</span>
</li>
</ul>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">x</span>
</li>
<li value="2">
<ul>
<li value="1">
<ul>
<li value="1">
<span data-lexical-text="true">B1</span>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">B2</span>
</li>
</ul>
</li>
</ul>
</div>
<ul>
<li value="1" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A1</span>
</li>
<li value="2" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A2</span>
</li>
</ul>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">x</span>
</li>
<li value="2" style="list-style: none;">
<ul>
<li value="1" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">B1</span>
</li>
</ul>
</li>
<li value="1">
<span data-lexical-text="true">B2</span>
</li>
</ul>
</li>
</ul>
`,
);
await editor.update(() => x.remove());
expectHtmlToBeEqual(
testEnv.outerHTML,
testEnv.innerHTML,
html`
<div
contenteditable="true"
style="user-select: text; white-space: pre-wrap; word-break: break-word;"
data-lexical-editor="true">
<ul>
<li value="1">
<ul>
<li value="1">
<span data-lexical-text="true">A1</span>
</li>
<li value="2">
<ul>
<li value="1">
<span data-lexical-text="true">A2</span>
</li>
<li value="2">
<span data-lexical-text="true">B1</span>
</li>
</ul>
</li>
<li value="2">
<span data-lexical-text="true">B2</span>
</li>
</ul>
</li>
</ul>
</div>
<ul>
<li value="1" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A1</span>
</li>
<li value="2" style="list-style: none;">
<ul>
<li value="1">
<span data-lexical-text="true">A2</span>
</li>
<li value="2">
<span data-lexical-text="true">B1</span>
</li>
</ul>
</li>
<li value="2">
<span data-lexical-text="true">B2</span>
</li>
</ul>
</li>
</ul>
`,
);
});

View File

@ -294,24 +294,5 @@ describe('LexicalListNode tests', () => {
expect(bulletList.__listType).toBe('bullet');
});
});
test('ListNode.clone() without list type (backward compatibility)', async () => {
const {editor} = testEnv;
await editor.update(() => {
const olNode = ListNode.clone({
__key: '1',
__start: 1,
__tag: 'ol',
} as unknown as ListNode);
const ulNode = ListNode.clone({
__key: '1',
__start: 1,
__tag: 'ul',
} as unknown as ListNode);
expect(olNode.__listType).toBe('number');
expect(ulNode.__listType).toBe('bullet');
});
});
});
});

View File

@ -2605,7 +2605,7 @@ describe('LexicalSelection tests', () => {
return $createHeadingNode('h1');
});
expect(JSON.stringify(testEditor._pendingEditorState?.toJSON())).toBe(
'{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"","type":"text","version":1},{"detail":0,"format":0,"mode":"normal","style":"","text":"","type":"text","version":1}],"direction":null,"format":"","indent":0,"type":"heading","version":1,"tag":"h1"},{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"","type":"text","version":1},{"detail":0,"format":0,"mode":"normal","style":"","text":"","type":"text","version":1}],"direction":null,"format":"","indent":0,"type":"heading","version":1,"tag":"h1"},{"children":[{"children":[{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"","type":"text","version":1}],"direction":null,"format":"","indent":0,"type":"heading","version":1,"tag":"h1"},{"children":[],"direction":null,"format":"","indent":0,"type":"heading","version":1,"tag":"h1"},{"children":[],"direction":null,"format":"","indent":0,"type":"heading","version":1,"tag":"h1"}],"direction":null,"format":"","indent":0,"type":"tablecell","version":1,"backgroundColor":null,"colSpan":1,"headerState":3,"rowSpan":1},{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"","type":"text","version":1}],"direction":null,"format":"","indent":0,"type":"heading","version":1,"tag":"h1"},{"children":[],"direction":null,"format":"","indent":0,"type":"heading","version":1,"tag":"h1"},{"children":[],"direction":null,"format":"","indent":0,"type":"heading","version":1,"tag":"h1"}],"direction":null,"format":"","indent":0,"type":"tablecell","version":1,"backgroundColor":null,"colSpan":1,"headerState":1,"rowSpan":1}],"direction":null,"format":"","indent":0,"type":"tablerow","version":1}],"direction":null,"format":"","indent":0,"type":"table","version":1},{"children":[],"direction":null,"format":"","indent":0,"type":"heading","version":1,"tag":"h1"}],"direction":null,"format":"","indent":0,"type":"root","version":1}}',
'{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"","type":"text","version":1},{"detail":0,"format":0,"mode":"normal","style":"","text":"","type":"text","version":1}],"direction":null,"type":"heading","version":1,"id":"","alignment":"","inset":0,"tag":"h1"},{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"","type":"text","version":1},{"detail":0,"format":0,"mode":"normal","style":"","text":"","type":"text","version":1}],"direction":null,"type":"heading","version":1,"id":"","alignment":"","inset":0,"tag":"h1"},{"children":[{"children":[{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"","type":"text","version":1}],"direction":null,"type":"heading","version":1,"id":"","alignment":"","inset":0,"tag":"h1"},{"children":[],"direction":null,"type":"heading","version":1,"id":"","alignment":"","inset":0,"tag":"h1"},{"children":[],"direction":null,"type":"heading","version":1,"id":"","alignment":"","inset":0,"tag":"h1"}],"direction":null,"type":"tablecell","version":1,"backgroundColor":null,"colSpan":1,"headerState":3,"rowSpan":1,"styles":{},"alignment":""},{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"","type":"text","version":1}],"direction":null,"type":"heading","version":1,"id":"","alignment":"","inset":0,"tag":"h1"},{"children":[],"direction":null,"type":"heading","version":1,"id":"","alignment":"","inset":0,"tag":"h1"},{"children":[],"direction":null,"type":"heading","version":1,"id":"","alignment":"","inset":0,"tag":"h1"}],"direction":null,"type":"tablecell","version":1,"backgroundColor":null,"colSpan":1,"headerState":1,"rowSpan":1,"styles":{},"alignment":""}],"direction":null,"type":"tablerow","version":1,"styles":{},"height":0}],"direction":null,"type":"table","version":1,"id":"","alignment":"","inset":0,"colWidths":[],"styles":{}},{"children":[],"direction":null,"type":"heading","version":1,"id":"","alignment":"","inset":0,"tag":"h1"}],"direction":null,"type":"root","version":1}}',
);
});
});
@ -2695,7 +2695,7 @@ describe('LexicalSelection tests', () => {
});
});
expect(element.innerHTML).toStrictEqual(
`<h1><span data-lexical-text="true">1</span></h1><h1 style="padding-inline-start: calc(1 * 40px);"><span data-lexical-text="true">1.1</span></h1>`,
`<h1><span data-lexical-text="true">1</span></h1><ul><li value="1"><h1><span data-lexical-text="true">1.1</span></h1></li></ul>`,
);
});
@ -2734,7 +2734,7 @@ describe('LexicalSelection tests', () => {
});
});
expect(element.innerHTML).toStrictEqual(
`<h1 style="padding-inline-start: calc(1 * 40px);"><span data-lexical-text="true">1.1</span></h1>`,
`<ul><li value="1"><h1><span data-lexical-text="true">1.1</span></h1></li></ul>`,
);
});
});

View File

@ -113,9 +113,8 @@ describe('LexicalTableNode tests', () => {
$insertDataTransferForRichText(dataTransfer, selection, editor);
});
// Make sure paragraph is inserted inside empty cells
const emptyCell = '<td><p><br></p></td>';
expect(testEnv.innerHTML).toBe(
`<table><tr><td><p><span style="color: rgb(0, 0, 0);" data-lexical-text="true">Hello there</span></p></td><td><p><span style="color: rgb(0, 0, 0);" data-lexical-text="true">General Kenobi!</span></p></td></tr><tr><td><p><span style="color: rgb(0, 0, 0);" data-lexical-text="true">Lexical is nice</span></p></td>${emptyCell}</tr></table>`,
`<table style="border-collapse: collapse; table-layout: fixed; width: 468pt;"><colgroup><col><col></colgroup><tr style="height: 22.015pt;"><td style="border-left: 1pt solid #000000; border-right: 1pt solid #000000; border-bottom: 1pt solid #000000; border-top: 1pt solid #000000; vertical-align: top; padding: 5pt 5pt 5pt 5pt; overflow: hidden; overflow-wrap: break-word;"><p><span style="color: rgb(0, 0, 0);" data-lexical-text="true">Hello there</span></p></td><td style="border-left: 1pt solid #000000; border-right: 1pt solid #000000; border-bottom: 1pt solid #000000; border-top: 1pt solid #000000; vertical-align: top; padding: 5pt 5pt 5pt 5pt; overflow: hidden; overflow-wrap: break-word;"><p><span style="color: rgb(0, 0, 0);" data-lexical-text="true">General Kenobi!</span></p></td></tr><tr style="height: 22.015pt;"><td style="border-left: 1pt solid #000000; border-right: 1pt solid #000000; border-bottom: 1pt solid #000000; border-top: 1pt solid #000000; vertical-align: top; padding: 5pt 5pt 5pt 5pt; overflow: hidden; overflow-wrap: break-word;"><p><span style="color: rgb(0, 0, 0);" data-lexical-text="true">Lexical is nice</span></p></td><td style="border-left: 1pt solid #000000; border-right: 1pt solid #000000; border-bottom: 1pt solid #000000; border-top: 1pt solid #000000; vertical-align: top; padding: 5pt 5pt 5pt 5pt; overflow: hidden; overflow-wrap: break-word;"><p><br></p></td></tr></table>`,
);
});
@ -136,7 +135,7 @@ describe('LexicalTableNode tests', () => {
$insertDataTransferForRichText(dataTransfer, selection, editor);
});
expect(testEnv.innerHTML).toBe(
`<table><tr style="height: 21px;"><td><p><strong data-lexical-text="true">Surface</strong></p></td><td><p><em data-lexical-text="true">MWP_WORK_LS_COMPOSER</em></p></td><td><p style="text-align: right;"><span data-lexical-text="true">77349</span></p></td></tr><tr style="height: 21px;"><td><p><span data-lexical-text="true">Lexical</span></p></td><td><p><span data-lexical-text="true">XDS_RICH_TEXT_AREA</span></p></td><td><p><span data-lexical-text="true">sdvd </span><strong data-lexical-text="true">sdfvsfs</strong></p></td></tr></table>`,
`<table style="table-layout: fixed; font-size: 10pt; font-family: Arial; width: 0px; border-collapse: collapse;"><colgroup><col style="width: 100px;"><col style="width: 189px;"><col style="width: 171px;"></colgroup><tr style="height: 21px;"><td style="overflow: hidden; padding: 2px 3px 2px 3px; vertical-align: bottom; font-weight: bold;"><p><strong data-lexical-text="true">Surface</strong></p></td><td style="overflow: hidden; padding: 2px 3px 2px 3px; vertical-align: bottom; font-style: italic;"><p><em data-lexical-text="true">MWP_WORK_LS_COMPOSER</em></p></td><td style="overflow: hidden; padding: 2px 3px 2px 3px; vertical-align: bottom; text-decoration: underline; text-align: right;" class="align-right"><p><span data-lexical-text="true">77349</span></p></td></tr><tr style="height: 21px;"><td style="overflow: hidden; padding: 2px 3px 2px 3px; vertical-align: bottom;"><p><span data-lexical-text="true">Lexical</span></p></td><td style="overflow: hidden; padding: 2px 3px 2px 3px; vertical-align: bottom; text-decoration: line-through;"><p><span data-lexical-text="true">XDS_RICH_TEXT_AREA</span></p></td><td style="overflow: hidden; padding: 2px 3px 2px 3px; vertical-align: bottom;"><p><span data-lexical-text="true">sdvd </span><strong data-lexical-text="true">sdfvsfs</strong></p></td></tr></table>`,
);
});
},

View File

@ -101,8 +101,6 @@ describe('table selection', () => {
__cachedText: null,
__dir: null,
__first: paragraphKey,
__format: 0,
__indent: 0,
__key: 'root',
__last: paragraphKey,
__next: null,
@ -113,10 +111,11 @@ describe('table selection', () => {
__type: 'root',
});
expect(parsedParagraph).toEqual({
__alignment: "",
__dir: null,
__first: textKey,
__format: 0,
__indent: 0,
__id: '',
__inset: 0,
__key: paragraphKey,
__last: textKey,
__next: null,
@ -124,7 +123,6 @@ describe('table selection', () => {
__prev: null,
__size: 1,
__style: '',
__textFormat: 0,
__textStyle: '',
__type: 'paragraph',
});

View File

@ -176,7 +176,7 @@ describe('LexicalEventHelpers', () => {
},
{
expectedHTML:
'<div contenteditable="true" style="user-select: text; white-space: pre-wrap; word-break: break-word;" data-lexical-editor="true"><ul class="editor-list-ul"><li value="1" class="editor-listitem"><span data-lexical-text="true">Other side</span></li><li value="2" class="editor-listitem"><span data-lexical-text="true">I must have called</span></li></ul></div>',
'<div contenteditable="true" style="user-select: text; white-space: pre-wrap; word-break: break-word;" data-lexical-editor="true"><ul class="editor-list-ul"><li value="1"><span data-lexical-text="true">Other side</span></li><li value="2"><span data-lexical-text="true">I must have called</span></li></ul></div>',
inputs: [
pasteHTML(
`<meta charset='utf-8'><ul><li>Other side</li><li>I must have called</li></ul>`,
@ -186,7 +186,7 @@ describe('LexicalEventHelpers', () => {
},
{
expectedHTML:
'<div contenteditable="true" style="user-select: text; white-space: pre-wrap; word-break: break-word;" data-lexical-editor="true"><ol class="editor-list-ol"><li value="1" class="editor-listitem"><span data-lexical-text="true">To tell you</span></li><li value="2" class="editor-listitem"><span data-lexical-text="true">Im sorry</span></li></ol></div>',
'<div contenteditable="true" style="user-select: text; white-space: pre-wrap; word-break: break-word;" data-lexical-editor="true"><ol class="editor-list-ol"><li value="1"><span data-lexical-text="true">To tell you</span></li><li value="2"><span data-lexical-text="true">Im sorry</span></li></ol></div>',
inputs: [
pasteHTML(
`<meta charset='utf-8'><ol><li>To tell you</li><li>Im sorry</li></ol>`,
@ -266,7 +266,7 @@ describe('LexicalEventHelpers', () => {
},
{
expectedHTML:
'<div contenteditable="true" style="user-select: text; white-space: pre-wrap; word-break: break-word;" data-lexical-editor="true"><ul class="editor-list-ul"><li value="1" class="editor-listitem"><span data-lexical-text="true">Hello</span></li><li value="2" class="editor-listitem"><span data-lexical-text="true">from the other</span></li><li value="3" class="editor-listitem"><span data-lexical-text="true">side</span></li></ul></div>',
'<div contenteditable="true" style="user-select: text; white-space: pre-wrap; word-break: break-word;" data-lexical-editor="true"><ul class="editor-list-ul"><li value="1"><span data-lexical-text="true">Hello</span></li><li value="2"><span data-lexical-text="true">from the other</span></li><li value="3"><span data-lexical-text="true">side</span></li></ul></div>',
inputs: [
pasteHTML(
`<meta charset='utf-8'><doesnotexist><ul><li>Hello</li><li>from the other</li><li>side</li></ul></doesnotexist>`,
@ -276,7 +276,7 @@ describe('LexicalEventHelpers', () => {
},
{
expectedHTML:
'<div contenteditable="true" style="user-select: text; white-space: pre-wrap; word-break: break-word;" data-lexical-editor="true"><ul class="editor-list-ul"><li value="1" class="editor-listitem"><span data-lexical-text="true">Hello</span></li><li value="2" class="editor-listitem"><span data-lexical-text="true">from the other</span></li><li value="3" class="editor-listitem"><span data-lexical-text="true">side</span></li></ul></div>',
'<div contenteditable="true" style="user-select: text; white-space: pre-wrap; word-break: break-word;" data-lexical-editor="true"><ul class="editor-list-ul"><li value="1"><span data-lexical-text="true">Hello</span></li><li value="2"><span data-lexical-text="true">from the other</span></li><li value="3"><span data-lexical-text="true">side</span></li></ul></div>',
inputs: [
pasteHTML(
`<meta charset='utf-8'><doesnotexist><doesnotexist><ul><li>Hello</li><li>from the other</li><li>side</li></ul></doesnotexist></doesnotexist>`,
@ -611,7 +611,7 @@ describe('LexicalEventHelpers', () => {
},
{
expectedHTML:
'<ol class="editor-list-ol"><li value="1" class="editor-listitem"><span data-lexical-text="true">1</span><br><span data-lexical-text="true">2</span></li><li value="2" class="editor-listitem"><br></li><li value="3" class="editor-listitem"><span data-lexical-text="true">3</span></li></ol>',
'<ol class="editor-list-ol"><li value="1"><span data-lexical-text="true">1</span><br><span data-lexical-text="true">2</span></li><li value="2"><br></li><li value="3"><span data-lexical-text="true">3</span></li></ol>',
inputs: [
pasteHTML('<ol><li>1<div></div>2</li><li></li><li>3</li></ol>'),
],
@ -647,7 +647,7 @@ describe('LexicalEventHelpers', () => {
},
{
expectedHTML:
'<ol class="editor-list-ol"><li value="1" class="editor-listitem"><span data-lexical-text="true">1</span></li><li value="2" class="editor-listitem"><br></li><li value="3" class="editor-listitem"><span data-lexical-text="true">3</span></li></ol>',
'<ol class="editor-list-ol"><li value="1"><span data-lexical-text="true">1</span></li><li value="2"><br></li><li value="3"><span data-lexical-text="true">3</span></li></ol>',
inputs: [pasteHTML('<ol><li>1</li><li><br /></li><li>3</li></ol>')],
name: 'only br in a li',
},

View File

@ -82,10 +82,10 @@ describe('LexicalUtils#splitNode', () => {
expectedHtml:
'<ul>' +
'<li>Before</li>' +
'<li><ul><li>Hello</li></ul></li>' +
'<li style="list-style: none;"><ul><li>Hello</li></ul></li>' +
'</ul>' +
'<ul>' +
'<li><ul><li>world</li></ul></li>' +
'<li style="list-style: none;"><ul><li>world</li></ul></li>' +
'<li>After</li>' +
'</ul>',
initialHtml:

View File

@ -56,11 +56,11 @@ describe('LexicalUtils#insertNodeToNearestRoot', () => {
expectedHtml:
'<ul>' +
'<li>Before</li>' +
'<li><ul><li>Hello</li></ul></li>' +
'<li style="list-style: none;"><ul><li>Hello</li></ul></li>' +
'</ul>' +
'<test-decorator></test-decorator>' +
'<ul>' +
'<li><ul><li>world</li></ul></li>' +
'<li style="list-style: none;"><ul><li>world</li></ul></li>' +
'<li>After</li>' +
'</ul>',
initialHtml: