Skip to content

Commit

Permalink
test: table cell merge
Browse files Browse the repository at this point in the history
  • Loading branch information
@umaranis
umaranis committed Dec 6, 2023
1 parent 5ec4c9b commit ed51962
Show file tree
Hide file tree
Showing 3 changed files with 169 additions and 12 deletions.
173 changes: 162 additions & 11 deletions demos/playground/src/__tests__/e2e/Tables.spec.mjs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,11 +64,12 @@ async function fillTablePartiallyWithText(page) {

test.describe('Tables', () => {
test.fixme();
test.beforeEach(({ isCollab, page }) => initialize({ isCollab, page }));
test(`Can a table be inserted from the toolbar`, async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);
await focusEditor(page);

Expand Down Expand Up @@ -103,7 +104,12 @@ test.describe('Tables', () => {
);
});

test(`Can type inside of table cell`, async ({ page, isPlainText }) => {
test(`Can type inside of table cell`, async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);

await focusEditor(page);
Expand Down Expand Up @@ -140,7 +146,12 @@ test.describe('Tables', () => {
);
});

test(`Can navigate table with keyboard`, async ({ page, isPlainText }) => {
test(`Can navigate table with keyboard`, async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);

await focusEditor(page);
Expand Down Expand Up @@ -186,7 +197,9 @@ test.describe('Tables', () => {
test(`Can select cells using Table selection`, async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);

await focusEditor(page);
Expand Down Expand Up @@ -270,7 +283,9 @@ test.describe('Tables', () => {
test(`Can select cells using Table selection via keyboard`, async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);

await focusEditor(page);
Expand Down Expand Up @@ -385,7 +400,12 @@ test.describe('Tables', () => {
);
});

test(`Can style text using Table selection`, async ({ page, isPlainText }) => {
test(`Can style text using Table selection`, async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);

await focusEditor(page);
Expand Down Expand Up @@ -474,7 +494,9 @@ test.describe('Tables', () => {
test(`Can copy + paste (internal) using Table selection`, async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);

await focusEditor(page);
Expand Down Expand Up @@ -551,7 +573,12 @@ test.describe('Tables', () => {
);
});

test(`Can clear text using Table selection`, async ({ page, isPlainText }) => {
test(`Can clear text using Table selection`, async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);

await focusEditor(page);
Expand Down Expand Up @@ -609,6 +636,7 @@ test.describe('Tables', () => {
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);

await focusEditor(page);
Expand Down Expand Up @@ -660,6 +688,7 @@ test.describe('Tables', () => {
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);

await focusEditor(page);
Expand Down Expand Up @@ -737,7 +766,8 @@ test.describe('Tables', () => {
);
});

test(`Horizontal rule inside cell`, async ({ page, isPlainText }) => {
test(`Horizontal rule inside cell`, async ({ page, isPlainText, isCollab }) => {
await initialize({ isCollab, page });
test.skip(isPlainText);
await focusEditor(page);

Expand Down Expand Up @@ -771,7 +801,9 @@ test.describe('Tables', () => {
test('Grid selection: can select multiple cells and insert an image', async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);

await focusEditor(page);
Expand Down Expand Up @@ -845,7 +877,9 @@ test.describe('Tables', () => {
test('Grid selection: can backspace lines, backspacing empty cell does not destroy it #3278', async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);

await focusEditor(page);
Expand Down Expand Up @@ -918,7 +952,8 @@ test.describe('Tables', () => {
);
});

test('Merge/unmerge cells (1)', async ({ page, isPlainText }) => {
test('Merge/unmerge cells (1)', async ({ page, isPlainText, isCollab }) => {
await initialize({ isCollab, page });
test.skip(isPlainText);
if (IS_COLLAB) {
// The contextual menu positioning needs fixing (it's hardcoded to show on the right side)
Expand Down Expand Up @@ -1004,7 +1039,8 @@ test.describe('Tables', () => {
);
});

test('Merge/unmerge cells (2)', async ({ page, isPlainText }) => {
test('Merge/unmerge cells (2)', async ({ page, isPlainText, isCollab }) => {
await initialize({ isCollab, page });
test.skip(isPlainText);
if (IS_COLLAB) {
// The contextual menu positioning needs fixing (it's hardcoded to show on the right side)
Expand Down Expand Up @@ -1130,7 +1166,8 @@ test.describe('Tables', () => {
);
});

test('Merge with content', async ({ page, isPlainText }) => {
test('Merge with content', async ({ page, isPlainText, isCollab }) => {
await initialize({ isCollab, page });
test.skip(isPlainText);
if (IS_COLLAB) {
// The contextual menu positioning needs fixing (it's hardcoded to show on the right side)
Expand Down Expand Up @@ -1223,7 +1260,9 @@ test.describe('Tables', () => {
test('Select multiple merged cells (selection expands to a rectangle)', async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);

await focusEditor(page);
Expand Down Expand Up @@ -1349,7 +1388,9 @@ test.describe('Tables', () => {
test('Insert row above (with conflicting merged cell)', async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);
if (IS_COLLAB) {
// The contextual menu positioning needs fixing (it's hardcoded to show on the right side)
Expand Down Expand Up @@ -1407,7 +1448,9 @@ test.describe('Tables', () => {
test('Insert column before (with conflicting merged cell)', async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);
if (IS_COLLAB) {
// The contextual menu positioning needs fixing (it's hardcoded to show on the right side)
Expand Down Expand Up @@ -1465,7 +1508,9 @@ test.describe('Tables', () => {
test('Insert column before (with selected cell with rowspan > 1)', async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);
if (IS_COLLAB) {
// The contextual menu positioning needs fixing (it's hardcoded to show on the right side)
Expand All @@ -1486,7 +1531,6 @@ test.describe('Tables', () => {
);
await mergeTableCells(page);
await insertTableColumnBefore(page);
await page.pause();

await assertHTML(
page,
Expand Down Expand Up @@ -1517,7 +1561,9 @@ test.describe('Tables', () => {
test('Delete rows (with conflicting merged cell)', async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);
if (IS_COLLAB) {
// The contextual menu positioning needs fixing (it's hardcoded to show on the right side)
Expand Down Expand Up @@ -1576,7 +1622,9 @@ test.describe('Tables', () => {
test('Delete columns (with conflicting merged cell)', async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);
if (IS_COLLAB) {
// The contextual menu positioning needs fixing (it's hardcoded to show on the right side)
Expand Down Expand Up @@ -1635,7 +1683,9 @@ test.describe('Tables', () => {
test('Deselect when click outside #3785 #4138', async ({
page,
isPlainText,
isCollab,
}) => {
await initialize({ isCollab, page });
test.skip(isPlainText);
if (IS_COLLAB) {
// The contextual menu positioning needs fixing (it's hardcoded to show on the right side)
Expand All @@ -1658,7 +1708,8 @@ test.describe('Tables', () => {
});
});

test('Background color to cell', async ({ page, isPlainText }) => {
test('Background color to cell', async ({ page, isPlainText, isCollab }) => {
await initialize({ isCollab, page });
test.skip(isPlainText);
if (IS_COLLAB) {
// The contextual menu positioning needs fixing (it's hardcoded to show on the right side)
Expand Down Expand Up @@ -1689,4 +1740,104 @@ test.describe('Tables', () => {
`,
);
});

test('Cell merge feature disabled', async ({ page, isPlainText, isCollab }) => {
await initialize({ isCollab, page, tableCellMerge: false });
test.skip(isPlainText);

await focusEditor(page);
await pasteFromClipboard(page, {
'text/html': `<div dir="ltr">
<table>
<tbody>
<tr>
<td colspan="2" rowspan="2">
<p dir="ltr">Hello world</p>
</td>
<td>
<p dir="ltr">a</p>
</td>
</tr>
<tr>
<td>
<p dir="ltr">b</p>
</td>
</tr>
<tr>
<td>
<p dir="ltr">c</p>
</td>
<td>
<p dir="ltr">d</p>
</td>
<td>
<p dir="ltr">e</p>
</td>
</tr>
</tbody>
</table>
</div>`,
});

await page.pause();

await assertHTML(
page,
html`
<table class="PlaygroundEditorTheme__table">
<tr>
<td class="PlaygroundEditorTheme__tableCell">
<p
class="PlaygroundEditorTheme__paragraph PlaygroundEditorTheme__ltr"
dir="ltr">
<span data-lexical-text="true">Hello world</span>
</p>
</td>
<td class="PlaygroundEditorTheme__tableCell"><br /></td>
<td class="PlaygroundEditorTheme__tableCell">
<p
class="PlaygroundEditorTheme__paragraph PlaygroundEditorTheme__ltr"
dir="ltr">
<span data-lexical-text="true">a</span>
</p>
</td>
</tr>
<tr>
<td class="PlaygroundEditorTheme__tableCell"><br /></td>
<td class="PlaygroundEditorTheme__tableCell"><br /></td>
<td class="PlaygroundEditorTheme__tableCell">
<p
class="PlaygroundEditorTheme__paragraph PlaygroundEditorTheme__ltr"
dir="ltr">
<span data-lexical-text="true">b</span>
</p>
</td>
</tr>
<tr>
<td class="PlaygroundEditorTheme__tableCell">
<p
class="PlaygroundEditorTheme__paragraph PlaygroundEditorTheme__ltr"
dir="ltr">
<span data-lexical-text="true">c</span>
</p>
</td>
<td class="PlaygroundEditorTheme__tableCell">
<p
class="PlaygroundEditorTheme__paragraph PlaygroundEditorTheme__ltr"
dir="ltr">
<span data-lexical-text="true">d</span>
</p>
</td>
<td class="PlaygroundEditorTheme__tableCell">
<p
class="PlaygroundEditorTheme__paragraph PlaygroundEditorTheme__ltr"
dir="ltr">
<span data-lexical-text="true">e</span>
</p>
</td>
</tr>
</table>
`,
);
});
});
4 changes: 4 additions & 0 deletions demos/playground/src/__tests__/utils/index.mjs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ export async function initialize({
isCharLimitUtf8,
isMaxLength,
showNestedEditorTreeView,
tableCellMerge,
}) {
const appSettings = {};
appSettings.isRichText = IS_RICH_TEXT;
Expand All @@ -58,6 +59,9 @@ export async function initialize({
appSettings.isCharLimit = !!isCharLimit;
appSettings.isCharLimitUtf8 = !!isCharLimitUtf8;
appSettings.isMaxLength = !!isMaxLength;
if (tableCellMerge !== undefined) {
appSettings.tableCellMerge = tableCellMerge;
}

const urlParams = appSettingsToURLParams(appSettings);
const url = `http://localhost:${E2E_PORT}/${isCollab ? 'split/' : ''
Expand Down
Loading

0 comments on commit ed51962

Please sign in to comment.