From 37203793ee4194097926f806d10d18152b65f873 Mon Sep 17 00:00:00 2001 From: umaranis Date: Tue, 7 May 2024 21:34:40 +1000 Subject: [PATCH] test: add more regression tests from lexical --- ...3-backspace-with-element-at-front.spec.mjs | 7 +- .../regression/1384-insert-nodes.spec.mjs | 47 +++--- .../regression/221-editing-hashtags.spec.mjs | 1 - .../230-navigation-around-hashtags.spec.mjs | 61 ++++--- .../regression/231-empty-text-nodes.spec.mjs | 49 +++--- ...6-insert-nodes-adjacent-to-inline.spec.mjs | 7 +- .../3433-merge-markdown-lists.spec.mjs | 1 - .../379-backspace-with-mentions.spec.mjs | 7 +- .../4661-insert-column-selection.spec.mjs | 152 ++++++++++++++++++ .../4697-repeated-table-selection.spec.mjs | 53 ++++++ .../4872-full-row-span-cell-merge.spec.mjs | 55 +++++++ .../regression/4876-unmerge-cell.spec.mjs | 53 ++++++ .../5251-paste-into-inline-element.spec.mjs | 114 +++++++++++++ ...ect-list-followed-by-element-node.spec.mjs | 64 ++++++++ 14 files changed, 581 insertions(+), 90 deletions(-) create mode 100644 demos/playground/src/__tests__/regression/4661-insert-column-selection.spec.mjs create mode 100644 demos/playground/src/__tests__/regression/4697-repeated-table-selection.spec.mjs create mode 100644 demos/playground/src/__tests__/regression/4872-full-row-span-cell-merge.spec.mjs create mode 100644 demos/playground/src/__tests__/regression/4876-unmerge-cell.spec.mjs create mode 100644 demos/playground/src/__tests__/regression/5251-paste-into-inline-element.spec.mjs create mode 100644 demos/playground/src/__tests__/regression/5583-select-list-followed-by-element-node.spec.mjs diff --git a/demos/playground/src/__tests__/regression/1083-backspace-with-element-at-front.spec.mjs b/demos/playground/src/__tests__/regression/1083-backspace-with-element-at-front.spec.mjs index 4c4a4305..adca688f 100644 --- a/demos/playground/src/__tests__/regression/1083-backspace-with-element-at-front.spec.mjs +++ b/demos/playground/src/__tests__/regression/1083-backspace-with-element-at-front.spec.mjs @@ -21,7 +21,6 @@ import { } from '../utils/index.mjs'; test.describe('Regression test #1083', () => { - test.fixme(); test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); test(`Backspace with ElementNode at the front of the paragraph`, async ({ page, @@ -33,6 +32,7 @@ test.describe('Regression test #1083', () => { await page.keyboard.type('Hello'); await selectAll(page); await click(page, '.link'); + await click(page, '.link-confirm'); await moveToLineEnd(page); await page.keyboard.type('World'); @@ -45,7 +45,7 @@ test.describe('Regression test #1083', () => { dir="ltr"> Hello @@ -78,6 +78,7 @@ test.describe('Regression test #1083', () => { await page.keyboard.type('Hello'); await selectCharacters(page, 'left', 'Hello'.length); await click(page, '.link'); + await click(page, '.link-confirm'); await moveToLineEnd(page); await page.keyboard.type('World'); @@ -91,7 +92,7 @@ test.describe('Regression test #1083', () => { Say Hello diff --git a/demos/playground/src/__tests__/regression/1384-insert-nodes.spec.mjs b/demos/playground/src/__tests__/regression/1384-insert-nodes.spec.mjs index a4194e1c..3982e30d 100644 --- a/demos/playground/src/__tests__/regression/1384-insert-nodes.spec.mjs +++ b/demos/playground/src/__tests__/regression/1384-insert-nodes.spec.mjs @@ -18,27 +18,28 @@ import { test.describe('Regression test #1384', () => { test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); - test.fixme( - `Properly pastes in code blocks`, - async ({page, isPlainText, isCollab}) => { - test.skip(isPlainText || isCollab); - await focusEditor(page); - await page.keyboard.type('``` alert(1);'); - await page.keyboard.press('Enter'); - await page.keyboard.type('alert(2);'); - await page.keyboard.press('Enter'); - await page.keyboard.type('alert(3);'); - await page.keyboard.press('ArrowUp'); - await page.keyboard.press('ArrowUp'); - await page.keyboard.press('ArrowLeft'); - await selectCharacters(page, 'left', 8); - const clipboard = await copyToClipboard(page); - await page.keyboard.press('ArrowLeft'); - await pasteFromClipboard(page, clipboard); - await assertHTML( - page, - `alert(1)alert(1);
alert(2);
alert(3);`, - ); - }, - ); + test(`Properly pastes in code blocks`, async ({ + page, + isPlainText, + isCollab, + }) => { + test.skip(isPlainText || isCollab); + await focusEditor(page); + await page.keyboard.type('``` alert(1);'); + await page.keyboard.press('Enter'); + await page.keyboard.type('alert(2);'); + await page.keyboard.press('Enter'); + await page.keyboard.type('alert(3);'); + await page.keyboard.press('ArrowUp'); + await page.keyboard.press('ArrowUp'); + await page.keyboard.press('ArrowLeft'); + await selectCharacters(page, 'left', 8); + const clipboard = await copyToClipboard(page); + await page.keyboard.press('ArrowLeft'); + await pasteFromClipboard(page, clipboard); + await assertHTML( + page, + `alert(1)alert(1);
alert(2);
alert(3);`, + ); + }); }); diff --git a/demos/playground/src/__tests__/regression/221-editing-hashtags.spec.mjs b/demos/playground/src/__tests__/regression/221-editing-hashtags.spec.mjs index a1f4e12b..43c43caf 100644 --- a/demos/playground/src/__tests__/regression/221-editing-hashtags.spec.mjs +++ b/demos/playground/src/__tests__/regression/221-editing-hashtags.spec.mjs @@ -18,7 +18,6 @@ import { } from '../utils/index.mjs'; test.describe('Regression test #221', () => { - test.fixme(); test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); test(`Can handle space in hashtag`, async ({page}) => { await focusEditor(page); diff --git a/demos/playground/src/__tests__/regression/230-navigation-around-hashtags.spec.mjs b/demos/playground/src/__tests__/regression/230-navigation-around-hashtags.spec.mjs index b8764350..02b4ea76 100644 --- a/demos/playground/src/__tests__/regression/230-navigation-around-hashtags.spec.mjs +++ b/demos/playground/src/__tests__/regression/230-navigation-around-hashtags.spec.mjs @@ -19,36 +19,33 @@ import { test.describe('Regression test #230', () => { test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); - test.fixme( - `Is able to right arrow before hashtag after inserting text node`, - async ({page}) => { - await focusEditor(page); - await page.keyboard.type('#foo'); - await waitForSelector(page, '.PlaygroundEditorTheme__hashtag'); - await moveLeft(page, 4); - await page.keyboard.type('a'); - await page.keyboard.press('Backspace'); - await page.keyboard.press('ArrowRight'); - await assertHTML( - page, - html` -

- - #foo - -

- `, - ); - await assertSelection(page, { - anchorOffset: 1, - anchorPath: [0, 0, 0], - focusOffset: 1, - focusPath: [0, 0, 0], - }); - }, - ); + test(`Is able to right arrow before hashtag after inserting text node`, async ({ + page, + }) => { + await focusEditor(page); + await page.keyboard.type('#foo'); + await waitForSelector(page, '.PlaygroundEditorTheme__hashtag'); + await moveLeft(page, 4); + await page.keyboard.type('a'); + await page.keyboard.press('Backspace'); + await page.keyboard.press('ArrowRight'); + await assertHTML( + page, + html` +

+ + #foo + +

+ `, + ); + await assertSelection(page, { + anchorOffset: 1, + anchorPath: [0, 0, 0], + focusOffset: 1, + focusPath: [0, 0, 0], + }); + }); }); diff --git a/demos/playground/src/__tests__/regression/231-empty-text-nodes.spec.mjs b/demos/playground/src/__tests__/regression/231-empty-text-nodes.spec.mjs index d15a1672..05ef9263 100644 --- a/demos/playground/src/__tests__/regression/231-empty-text-nodes.spec.mjs +++ b/demos/playground/src/__tests__/regression/231-empty-text-nodes.spec.mjs @@ -23,29 +23,28 @@ import { test.describe('Regression test #231', () => { test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); - test.fixme( - `Does not generate segment error when editing empty text nodes`, - async ({page}) => { - await focusEditor(page); - await page.keyboard.type('#foo'); - await waitForSelector(page, '.PlaygroundEditorTheme__hashtag'); - await moveLeft(page, 4); - await page.keyboard.type('a'); - await page.keyboard.press('Backspace'); - await moveRight(page, 5); - await pressBackspace(page, 5); - await assertHTML( - page, - html` -


- `, - ); - await assertSelection(page, { - anchorOffset: 0, - anchorPath: [0], - focusOffset: 0, - focusPath: [0], - }); - }, - ); + test(`Does not generate segment error when editing empty text nodes`, async ({ + page, + }) => { + await focusEditor(page); + await page.keyboard.type('#foo'); + await waitForSelector(page, '.PlaygroundEditorTheme__hashtag'); + await moveLeft(page, 4); + await page.keyboard.type('a'); + await page.keyboard.press('Backspace'); + await moveRight(page, 5); + await pressBackspace(page, 5); + await assertHTML( + page, + html` +


+ `, + ); + await assertSelection(page, { + anchorOffset: 0, + anchorPath: [0], + focusOffset: 0, + focusPath: [0], + }); + }); }); diff --git a/demos/playground/src/__tests__/regression/3136-insert-nodes-adjacent-to-inline.spec.mjs b/demos/playground/src/__tests__/regression/3136-insert-nodes-adjacent-to-inline.spec.mjs index fd7ce279..91eb4c9d 100644 --- a/demos/playground/src/__tests__/regression/3136-insert-nodes-adjacent-to-inline.spec.mjs +++ b/demos/playground/src/__tests__/regression/3136-insert-nodes-adjacent-to-inline.spec.mjs @@ -22,7 +22,6 @@ import { } from '../utils/index.mjs'; test.describe('Regression test #3136', () => { - test.fixme(); test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); test('Correctly pastes rich content when the selection is followed by an inline element', async ({ isPlainText, @@ -39,6 +38,7 @@ test.describe('Regression test #3136', () => { await page.keyboard.type('link'); await selectCharacters(page, 'left', 'link'.length); await click(page, '.link'); + await click(page, '.link-confirm'); // Select non-link text so that selection ends just before the link await moveLeft(page, 5); @@ -59,7 +59,7 @@ test.describe('Regression test #3136', () => { class="PlaygroundEditorTheme__link PlaygroundEditorTheme__ltr" dir="ltr" href="https://" - rel="noopener"> + rel="noreferrer"> link

@@ -79,6 +79,7 @@ test.describe('Regression test #3136', () => { await page.keyboard.type('link'); await selectCharacters(page, 'left', 'link'.length); await click(page, '.link'); + await click(page, '.link-confirm'); // Non-link text await moveRight(page, 1); @@ -102,7 +103,7 @@ test.describe('Regression test #3136', () => { class="PlaygroundEditorTheme__link PlaygroundEditorTheme__ltr" dir="ltr" href="https://" - rel="noopener"> + rel="noreferrer"> link replaced diff --git a/demos/playground/src/__tests__/regression/3433-merge-markdown-lists.spec.mjs b/demos/playground/src/__tests__/regression/3433-merge-markdown-lists.spec.mjs index e11e860f..728a6c08 100644 --- a/demos/playground/src/__tests__/regression/3433-merge-markdown-lists.spec.mjs +++ b/demos/playground/src/__tests__/regression/3433-merge-markdown-lists.spec.mjs @@ -15,7 +15,6 @@ import { } from '../utils/index.mjs'; test.describe('Regression test #3433', () => { - test.fixme(); test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); test('can merge markdown lists created immediately before existing lists', async ({ page, diff --git a/demos/playground/src/__tests__/regression/379-backspace-with-mentions.spec.mjs b/demos/playground/src/__tests__/regression/379-backspace-with-mentions.spec.mjs index b20a56a1..a4a37db9 100644 --- a/demos/playground/src/__tests__/regression/379-backspace-with-mentions.spec.mjs +++ b/demos/playground/src/__tests__/regression/379-backspace-with-mentions.spec.mjs @@ -23,8 +23,11 @@ test.describe('Regression test #379', () => { `Is able to correctly handle backspace press at the line boundary`, async ({page}) => { await focusEditor(page); - await page.keyboard.type('Luke'); - await waitForSelector(page, '#typeahead-menu ul li'); + await page.keyboard.type('@Luke'); + await waitForSelector( + page, + '#typeahead-menu ul li:has-text("Luke Skywalker")', + ); await page.keyboard.press('Enter'); await assertHTML( page, diff --git a/demos/playground/src/__tests__/regression/4661-insert-column-selection.spec.mjs b/demos/playground/src/__tests__/regression/4661-insert-column-selection.spec.mjs new file mode 100644 index 00000000..ac905ff8 --- /dev/null +++ b/demos/playground/src/__tests__/regression/4661-insert-column-selection.spec.mjs @@ -0,0 +1,152 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + */ + +import { + assertHTML, + click, + focusEditor, + html, + initialize, + insertTable, + insertTableColumnAfter, + insertTableColumnBefore, + selectCellsFromTableCords, + test, +} from '../utils/index.mjs'; + +test.describe('Regression test #4661', () => { + test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); + test.fixme( + 'inserting 2 columns before inserts before selection', + async ({page, isPlainText, isCollab}) => { + test.skip(isPlainText); + + await focusEditor(page); + + await insertTable(page, 2, 2); + + await click(page, '.PlaygroundEditorTheme__tableCell'); + await selectCellsFromTableCords( + page, + {x: 0, y: 0}, + {x: 1, y: 0}, + true, + true, + ); + + await insertTableColumnBefore(page); + + await assertHTML( + page, + html` +


+ + + + + + + + + + + + + +
+


+ 		+


+ 		+


+ 		+


+
+


+ 		+


+ 		+


+ 		+


+
+


+ `, + ); + }, + ); + test.fixme( + 'inserting 2 columns after inserts after selection', + async ({page, isPlainText, isCollab}) => { + test.skip(isPlainText); + + await focusEditor(page); + + await insertTable(page, 2, 2); + + await click(page, '.PlaygroundEditorTheme__tableCell'); + await selectCellsFromTableCords( + page, + {x: 1, y: 0}, + {x: 0, y: 0}, + true, + true, + ); + + await insertTableColumnAfter(page); + + await assertHTML( + page, + html` +


+ + + + + + + + + + + + + +
+


+ 		+


+ 		+


+ 		+


+
+


+ 		+


+ 		+


+ 		+


+
+


+ `, + ); + }, + ); +}); diff --git a/demos/playground/src/__tests__/regression/4697-repeated-table-selection.spec.mjs b/demos/playground/src/__tests__/regression/4697-repeated-table-selection.spec.mjs new file mode 100644 index 00000000..2fc3ff6a --- /dev/null +++ b/demos/playground/src/__tests__/regression/4697-repeated-table-selection.spec.mjs @@ -0,0 +1,53 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + */ + +import { + assertTableSelectionCoordinates, + click, + focusEditor, + initialize, + insertTable, + selectCellsFromTableCords, + test, +} from '../utils/index.mjs'; + +test.describe('Regression test #4697', () => { + test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); + test.fixme( + 'repeated table selection results in table selection', + async ({page, isPlainText, isCollab}) => { + test.skip(isPlainText); + + await focusEditor(page); + + await insertTable(page, 4, 4); + + await click(page, '.PlaygroundEditorTheme__tableCell'); + await selectCellsFromTableCords( + page, + {x: 1, y: 1}, + {x: 2, y: 2}, + false, + false, + ); + + await selectCellsFromTableCords( + page, + {x: 2, y: 1}, + {x: 2, y: 2}, + false, + false, + ); + + await assertTableSelectionCoordinates(page, { + anchor: {x: 2, y: 1}, + focus: {x: 2, y: 2}, + }); + }, + ); +}); diff --git a/demos/playground/src/__tests__/regression/4872-full-row-span-cell-merge.spec.mjs b/demos/playground/src/__tests__/regression/4872-full-row-span-cell-merge.spec.mjs new file mode 100644 index 00000000..8d2f2c3e --- /dev/null +++ b/demos/playground/src/__tests__/regression/4872-full-row-span-cell-merge.spec.mjs @@ -0,0 +1,55 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + */ +import { + assertTableSelectionCoordinates, + click, + focusEditor, + initialize, + insertTable, + mergeTableCells, + selectCellsFromTableCords, + test, +} from '../utils/index.mjs'; + +test.describe('Regression test #4872', () => { + test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); + test.fixme( + 'merging two full rows does not break table selection', + async ({page, isPlainText, isCollab}) => { + test.skip(isPlainText); + + await focusEditor(page); + + await insertTable(page, 5, 5); + + await click(page, '.PlaygroundEditorTheme__tableCell'); + await selectCellsFromTableCords( + page, + {x: 0, y: 1}, + {x: 4, y: 2}, + true, + false, + ); + + await mergeTableCells(page); + + await selectCellsFromTableCords( + page, + {x: 1, y: 4}, + {x: 2, y: 4}, + false, + false, + ); + + await assertTableSelectionCoordinates(page, { + anchor: {x: 1, y: 4}, + focus: {x: 2, y: 4}, + }); + }, + ); +}); diff --git a/demos/playground/src/__tests__/regression/4876-unmerge-cell.spec.mjs b/demos/playground/src/__tests__/regression/4876-unmerge-cell.spec.mjs new file mode 100644 index 00000000..6fa9e334 --- /dev/null +++ b/demos/playground/src/__tests__/regression/4876-unmerge-cell.spec.mjs @@ -0,0 +1,53 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + */ +import { + click, + expect, + focusEditor, + initialize, + insertTable, + locate, + mergeTableCells, + selectCellsFromTableCords, + test, + unmergeTableCell, +} from '../utils/index.mjs'; + +test.describe('Regression test #4876', () => { + test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); + test.fixme( + 'unmerging cells should add cells to correct rows', + async ({page, isPlainText, isCollab}) => { + test.skip(isPlainText); + + await focusEditor(page); + + await insertTable(page, 4, 4); + + await click(page, '.PlaygroundEditorTheme__tableCell'); + await selectCellsFromTableCords( + page, + {x: 0, y: 1}, + {x: 1, y: 3}, + true, + false, + ); + + await mergeTableCells(page); + + await unmergeTableCell(page); + + const tableRow = await locate(page, 'tr'); + expect(await tableRow.count()).toBe(4); + for (let i = 0; i < 4; i++) { + const tableCells = tableRow.nth(i).locator('th, td'); + expect(await tableCells.count()).toBe(4); + } + }, + ); +}); diff --git a/demos/playground/src/__tests__/regression/5251-paste-into-inline-element.spec.mjs b/demos/playground/src/__tests__/regression/5251-paste-into-inline-element.spec.mjs new file mode 100644 index 00000000..7a638b59 --- /dev/null +++ b/demos/playground/src/__tests__/regression/5251-paste-into-inline-element.spec.mjs @@ -0,0 +1,114 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + */ + +import { + moveToLineBeginning, + moveToNextWord, + moveToPrevWord, + selectCharacters, +} from '../keyboardShortcuts/index.mjs'; +import { + assertHTML, + click, + copyToClipboard, + focusEditor, + html, + initialize, + IS_WINDOWS, + pasteFromClipboard, + pressToggleBold, + test, +} from '../utils/index.mjs'; + +test.describe('Regression test #5251', () => { + test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); + test.fixme( + 'Correctly pastes rich content inside an inline element', + async ({isPlainText, page}) => { + test.skip(isPlainText); + await focusEditor(page); + + // Root + // |- Paragraph + // |- Text "Hello " + // |- Text "bold" { format: bold } + // |- Text " " + // |- Link + // |- Text "World" + await page.keyboard.type('Hello '); + await pressToggleBold(page); + await page.keyboard.type('bold'); + await pressToggleBold(page); + await page.keyboard.type(' World'); + await moveToPrevWord(page); + await selectCharacters(page, 'right', 'World'.length); + await click(page, '.link'); + await click(page, '.link-confirm'); + + // Copy "Hello bold" + await moveToLineBeginning(page); + await selectCharacters(page, 'right', 'Hello bold'.length); + const clipboard = await copyToClipboard(page); + + // Drop "bold" + await page.keyboard.press('ArrowLeft'); + await moveToNextWord(page); + await selectCharacters(page, 'right', 'bold '.length); + await page.keyboard.press('Delete'); + + // Check our current state + await assertHTML( + page, + html` +

+ Hello + + World + +

+ `, + ); + + // Replace "Wor" with the contents of the clipboard + if (!IS_WINDOWS) { + await page.keyboard.press('ArrowRight'); + } + await selectCharacters(page, 'right', 'Wor'.length); + await pasteFromClipboard(page, clipboard); + + await assertHTML( + page, + html` +

+ Hello Hello + + bold + + + ld + +

+ `, + ); + }, + ); +}); diff --git a/demos/playground/src/__tests__/regression/5583-select-list-followed-by-element-node.spec.mjs b/demos/playground/src/__tests__/regression/5583-select-list-followed-by-element-node.spec.mjs new file mode 100644 index 00000000..3ccc3bfe --- /dev/null +++ b/demos/playground/src/__tests__/regression/5583-select-list-followed-by-element-node.spec.mjs @@ -0,0 +1,64 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + */ + +import { + click, + dragMouse, + focusEditor, + initialize, + mouseMoveToSelector, + selectFromInsertDropdown, + selectorBoundingBox, + test, + waitForSelector, +} from '../utils/index.mjs'; + +async function toggleBulletList(page) { + await click(page, '.block-controls'); + await click(page, '.dropdown .icon.bullet-list'); +} +test.describe('Regression test #5251', () => { + test.beforeEach(({isCollab, page}) => initialize({isCollab, page})); + test(`Element node in the middle of a bullet list and selecting doesn't crash`, async ({ + page, + isPlainText, + }) => { + test.skip(isPlainText); + await focusEditor(page); + + page.on('console', (msg) => { + if (msg.type() === 'error') { + if ( + msg.text().includes('error #68') || + msg.text().includes('getNodesBetween: ancestor is null') + ) { + test.fail(); + } + } + }); + + await toggleBulletList(page); + await page.keyboard.type('one'); + await page.keyboard.press('Enter'); + await page.keyboard.type('two'); + await page.keyboard.press('Enter'); + await selectFromInsertDropdown(page, '.horizontal-rule'); + await waitForSelector(page, 'hr'); + await page.keyboard.type('three'); + await page.keyboard.press('Enter'); + await mouseMoveToSelector(page, 'li:has-text("one")'); + await page.mouse.down(); + await dragMouse( + page, + await selectorBoundingBox(page, 'li:has-text("one")'), + await selectorBoundingBox(page, 'li:has-text("three")'), + 'middle', + 'end', + ); + }); +});