Skip to content

Commit 77bcf3a

Browse files
committed
test: update snapshots
1 parent 0edc0a2 commit 77bcf3a

33 files changed

Lines changed: 1538 additions & 17 deletions

File tree

Lines changed: 233 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,233 @@
1+
{
2+
"type": "doc",
3+
"content": [
4+
{
5+
"type": "blockGroup",
6+
"content": [
7+
{
8+
"type": "blockContainer",
9+
"attrs": {
10+
"id": "0"
11+
},
12+
"content": [
13+
{
14+
"type": "table",
15+
"attrs": {
16+
"textColor": "default"
17+
},
18+
"content": [
19+
{
20+
"type": "tableRow",
21+
"content": [
22+
{
23+
"type": "tableCell",
24+
"attrs": {
25+
"textColor": "default",
26+
"backgroundColor": "default",
27+
"textAlignment": "left",
28+
"colspan": 1,
29+
"rowspan": 1,
30+
"colwidth": null
31+
},
32+
"content": [
33+
{
34+
"type": "tableParagraph"
35+
}
36+
]
37+
},
38+
{
39+
"type": "tableCell",
40+
"attrs": {
41+
"textColor": "default",
42+
"backgroundColor": "default",
43+
"textAlignment": "left",
44+
"colspan": 1,
45+
"rowspan": 1,
46+
"colwidth": null
47+
},
48+
"content": [
49+
{
50+
"type": "tableParagraph"
51+
}
52+
]
53+
},
54+
{
55+
"type": "tableCell",
56+
"attrs": {
57+
"textColor": "default",
58+
"backgroundColor": "default",
59+
"textAlignment": "left",
60+
"colspan": 1,
61+
"rowspan": 1,
62+
"colwidth": null
63+
},
64+
"content": [
65+
{
66+
"type": "tableParagraph"
67+
}
68+
]
69+
},
70+
{
71+
"type": "tableCell",
72+
"attrs": {
73+
"textColor": "default",
74+
"backgroundColor": "default",
75+
"textAlignment": "left",
76+
"colspan": 1,
77+
"rowspan": 1,
78+
"colwidth": null
79+
},
80+
"content": [
81+
{
82+
"type": "tableParagraph"
83+
}
84+
]
85+
}
86+
]
87+
},
88+
{
89+
"type": "tableRow",
90+
"content": [
91+
{
92+
"type": "tableCell",
93+
"attrs": {
94+
"textColor": "default",
95+
"backgroundColor": "default",
96+
"textAlignment": "left",
97+
"colspan": 1,
98+
"rowspan": 1,
99+
"colwidth": null
100+
},
101+
"content": [
102+
{
103+
"type": "tableParagraph"
104+
}
105+
]
106+
},
107+
{
108+
"type": "tableCell",
109+
"attrs": {
110+
"textColor": "default",
111+
"backgroundColor": "default",
112+
"textAlignment": "left",
113+
"colspan": 1,
114+
"rowspan": 1,
115+
"colwidth": null
116+
},
117+
"content": [
118+
{
119+
"type": "tableParagraph"
120+
}
121+
]
122+
},
123+
{
124+
"type": "tableCell",
125+
"attrs": {
126+
"textColor": "default",
127+
"backgroundColor": "default",
128+
"textAlignment": "left",
129+
"colspan": 1,
130+
"rowspan": 1,
131+
"colwidth": null
132+
},
133+
"content": [
134+
{
135+
"type": "tableParagraph"
136+
}
137+
]
138+
},
139+
{
140+
"type": "tableCell",
141+
"attrs": {
142+
"textColor": "default",
143+
"backgroundColor": "default",
144+
"textAlignment": "left",
145+
"colspan": 1,
146+
"rowspan": 1,
147+
"colwidth": null
148+
},
149+
"content": [
150+
{
151+
"type": "tableParagraph"
152+
}
153+
]
154+
}
155+
]
156+
},
157+
{
158+
"type": "tableRow",
159+
"content": [
160+
{
161+
"type": "tableCell",
162+
"attrs": {
163+
"textColor": "default",
164+
"backgroundColor": "default",
165+
"textAlignment": "left",
166+
"colspan": 1,
167+
"rowspan": 1,
168+
"colwidth": null
169+
},
170+
"content": [
171+
{
172+
"type": "tableParagraph"
173+
}
174+
]
175+
},
176+
{
177+
"type": "tableCell",
178+
"attrs": {
179+
"textColor": "default",
180+
"backgroundColor": "default",
181+
"textAlignment": "left",
182+
"colspan": 1,
183+
"rowspan": 1,
184+
"colwidth": null
185+
},
186+
"content": [
187+
{
188+
"type": "tableParagraph"
189+
}
190+
]
191+
},
192+
{
193+
"type": "tableCell",
194+
"attrs": {
195+
"textColor": "default",
196+
"backgroundColor": "default",
197+
"textAlignment": "left",
198+
"colspan": 1,
199+
"rowspan": 1,
200+
"colwidth": null
201+
},
202+
"content": [
203+
{
204+
"type": "tableParagraph"
205+
}
206+
]
207+
},
208+
{
209+
"type": "tableCell",
210+
"attrs": {
211+
"textColor": "default",
212+
"backgroundColor": "default",
213+
"textAlignment": "left",
214+
"colspan": 1,
215+
"rowspan": 1,
216+
"colwidth": null
217+
},
218+
"content": [
219+
{
220+
"type": "tableParagraph"
221+
}
222+
]
223+
}
224+
]
225+
}
226+
]
227+
}
228+
]
229+
}
230+
]
231+
}
232+
]
233+
}

tests/src/end-to-end/tables/tables.test.tsx

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,52 @@ import { mouseSequence, moveMouseOverElement } from "../../utils/mouse.js";
1212
import { executeSlashCommand } from "../../utils/slashmenu.js";
1313
import { insertParagraph } from "../../utils/copypaste.js";
1414

15+
// Hovers `cell` to reveal the table handles, then returns the row or
16+
// column handle. The column handle is rendered with a
17+
// `transform: rotate(0.25turn)` on the `.bn-table-handle` element
18+
// itself; the row handle has no transform.
19+
async function getTableHandle(
20+
cell: HTMLElement,
21+
orientation: "row" | "column",
22+
): Promise<HTMLElement> {
23+
await moveMouseOverElement(cell);
24+
return vi.waitFor(() => {
25+
const candidate = Array.from(
26+
document.querySelectorAll<HTMLElement>(".bn-table-handle"),
27+
).find((el) => {
28+
const isColumn = el.style.transform.includes("rotate");
29+
return orientation === "column" ? isColumn : !isColumn;
30+
});
31+
if (!candidate) {
32+
throw new Error(`${orientation} table handle not visible`);
33+
}
34+
return candidate;
35+
});
36+
}
37+
38+
// Opens the handle's menu and clicks the menu item whose text matches
39+
// `label` (menu items have no test id / aria-label, only text).
40+
async function clickTableHandleMenuItem(
41+
handle: HTMLElement,
42+
label: string,
43+
): Promise<void> {
44+
const box = handle.getBoundingClientRect();
45+
await mouseSequence([
46+
{ type: "click", x: box.x + box.width / 2, y: box.y + box.height / 2 },
47+
]);
48+
const menu = await waitForSelector(".bn-table-handle-menu");
49+
const item = await vi.waitFor(() => {
50+
const candidate = Array.from(
51+
menu.querySelectorAll<HTMLElement>(".mantine-Menu-item"),
52+
).find((el) => el.textContent?.trim() === label);
53+
if (!candidate) {
54+
throw new Error(`Menu item "${label}" not found`);
55+
}
56+
return candidate;
57+
});
58+
await userEvent.click(item);
59+
}
60+
1561
beforeEach(async () => {
1662
await render(<App />);
1763
await waitForSelector(EDITOR_SELECTOR);
@@ -222,4 +268,30 @@ describe("Check Table interactions", () => {
222268
expect(order).toEqual(["R1", "R3", "R4", "R5", "R2"]);
223269
},
224270
);
271+
// Drives the table handle menus to grow the table: first add a
272+
// column to the right, then add a row below. Playwright doesn't
273+
// correctly simulate the hover/drag interactions for table handles
274+
// in Firefox.
275+
test.skipIf(browserName === "firefox")(
276+
"Add column then add row via table handle menus",
277+
async () => {
278+
await focusOnEditor();
279+
await executeSlashCommand("table");
280+
await waitForSelector(TABLE_SELECTOR);
281+
282+
const firstCell = document.querySelector(
283+
`${TABLE_SELECTOR} tbody tr td`,
284+
) as HTMLElement;
285+
286+
// Add a column to the right of the first column.
287+
const columnHandle = await getTableHandle(firstCell, "column");
288+
await clickTableHandleMenuItem(columnHandle, "Add column right");
289+
290+
// Add a row below the first row.
291+
const rowHandle = await getTableHandle(firstCell, "row");
292+
await clickTableHandleMenuItem(rowHandle, "Add row below");
293+
294+
await compareDocToSnapshot("addColumnThenRow");
295+
},
296+
);
225297
});
-29 Bytes
Loading
2 Bytes
Loading
73 Bytes
Loading
188 Bytes
Loading
125 Bytes
Loading
166 Bytes
Loading
-182 Bytes
Loading
321 Bytes
Loading

0 commit comments

Comments
 (0)