Skip to content

Commit

Permalink
Revert "[lexical-playground][lexical-table] Bug Fix: Resizing table w…
Browse files Browse the repository at this point in the history 
…ith merged cells (#6200)"

This reverts commit 4af83c1.
  • Loading branch information
@Sahejkm @StyleT
Sahejkm authored and StyleT committed May 31, 2024
1 parent 0885fb2 commit 432681b
Show file tree
Hide file tree
Showing 3 changed files with 69 additions and 316 deletions.
227 changes: 0 additions & 227 deletions packages/lexical-playground/__tests__/e2e/Tables.spec.mjs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,6 @@ import {
selectCellsFromTableCords,
selectFromAdditionalStylesDropdown,
selectFromAlignDropdown,
selectorBoundingBox,
setBackgroundColor,
test,
toggleColumnHeader,
Expand Down Expand Up @@ -1521,232 +1520,6 @@ test.describe('Tables', () => {
);
});

test('Resize merged cells width (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)
page.setViewportSize({height: 1000, width: 3000});
}

await focusEditor(page);

await insertTable(page, 3, 3);
await click(page, '.PlaygroundEditorTheme__tableCell');
await selectCellsFromTableCords(
page,
{x: 0, y: 0},
{x: 1, y: 1},
true,
false,
);
await mergeTableCells(page);
await click(page, 'td:nth-child(3) > .PlaygroundEditorTheme__paragraph');
const resizerBoundingBox = await selectorBoundingBox(
page,
'.TableCellResizer__resizer:first-child',
);
const x = resizerBoundingBox.x + resizerBoundingBox.width / 2;
const y = resizerBoundingBox.y + resizerBoundingBox.height / 2;
await page.mouse.move(x, y);
await page.mouse.down();
await page.mouse.move(x + 50, y);
await page.mouse.up();

await assertHTML(
page,
html`
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
<table class="PlaygroundEditorTheme__table">
<tr>
<th
class="PlaygroundEditorTheme__tableCell PlaygroundEditorTheme__tableCellHeader"
colspan="2"
rowspan="2">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</th>
<th
class="PlaygroundEditorTheme__tableCell PlaygroundEditorTheme__tableCellHeader"
style="width: 125px">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</th>
</tr>
<tr>
<td class="PlaygroundEditorTheme__tableCell" style="width: 125px">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</td>
</tr>
<tr>
<th
class="PlaygroundEditorTheme__tableCell PlaygroundEditorTheme__tableCellHeader">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</th>
<td class="PlaygroundEditorTheme__tableCell">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</td>
<td class="PlaygroundEditorTheme__tableCell" style="width: 125px">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</td>
</tr>
</table>
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
`,
);
});

test('Resize merged cells width (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)
page.setViewportSize({height: 1000, width: 3000});
}

await focusEditor(page);

await insertTable(page, 3, 3);
await click(page, '.PlaygroundEditorTheme__tableCell');
await selectCellsFromTableCords(
page,
{x: 0, y: 0},
{x: 1, y: 1},
true,
false,
);
await mergeTableCells(page);
await page.locator('th').first().click();
const resizerBoundingBox = await selectorBoundingBox(
page,
'.TableCellResizer__resizer:first-child',
);
const x = resizerBoundingBox.x + resizerBoundingBox.width / 2;
const y = resizerBoundingBox.y + resizerBoundingBox.height / 2;
await page.mouse.move(x, y);
await page.mouse.down();
await page.mouse.move(x + 50, y);
await page.mouse.up();

await assertHTML(
page,
html`
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
<table class="PlaygroundEditorTheme__table">
<tr>
<th
class="PlaygroundEditorTheme__tableCell PlaygroundEditorTheme__tableCellHeader"
colspan="2"
rowspan="2">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</th>
<th
class="PlaygroundEditorTheme__tableCell PlaygroundEditorTheme__tableCellHeader">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</th>
</tr>
<tr>
<td class="PlaygroundEditorTheme__tableCell">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</td>
</tr>
<tr>
<th
class="PlaygroundEditorTheme__tableCell PlaygroundEditorTheme__tableCellHeader"
style="width: 125px">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</th>
<td class="PlaygroundEditorTheme__tableCell">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</td>
<td class="PlaygroundEditorTheme__tableCell">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</td>
</tr>
</table>
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
`,
);
});

test('Resize merged cells height', 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)
page.setViewportSize({height: 1000, width: 3000});
}

await focusEditor(page);

await insertTable(page, 3, 3);
await click(page, '.PlaygroundEditorTheme__tableCell');
await selectCellsFromTableCords(
page,
{x: 0, y: 0},
{x: 1, y: 1},
true,
false,
);
await mergeTableCells(page);
await page.locator('th').first().click();
const resizerBoundingBox = await selectorBoundingBox(
page,
'.TableCellResizer__resizer:nth-child(2)',
);
const x = resizerBoundingBox.x + resizerBoundingBox.width / 2;
const y = resizerBoundingBox.y + resizerBoundingBox.height / 2;
await page.mouse.move(x, y);
await page.mouse.down();
await page.mouse.move(x, y + 50);
await page.mouse.up();

await assertHTML(
page,
html`
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
<table class="PlaygroundEditorTheme__table">
<tr style="height: 88px">
<th
class="PlaygroundEditorTheme__tableCell PlaygroundEditorTheme__tableCellHeader"
colspan="2"
rowspan="2">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</th>
<th
class="PlaygroundEditorTheme__tableCell PlaygroundEditorTheme__tableCellHeader">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</th>
</tr>
<tr>
<td class="PlaygroundEditorTheme__tableCell">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</td>
</tr>
<tr>
<th
class="PlaygroundEditorTheme__tableCell PlaygroundEditorTheme__tableCellHeader">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</th>
<td class="PlaygroundEditorTheme__tableCell">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</td>
<td class="PlaygroundEditorTheme__tableCell">
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
</td>
</tr>
</table>
<p class="PlaygroundEditorTheme__paragraph"><br /></p>
`,
);
});

test('Merge/unmerge cells (1)', async ({page, isPlainText, isCollab}) => {
await initialize({isCollab, page});
test.skip(isPlainText);
Expand Down
Loading

0 comments on commit 432681b

Please sign in to comment.