Skip to content

Commit b196840

Browse files
authored
Merge branch 'main' into externaldimensions
2 parents ed656fe + c7a24d1 commit b196840

13 files changed

Lines changed: 76 additions & 96 deletions

package.json

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -56,29 +56,29 @@
5656
"@types/node": "^25.5.0",
5757
"@types/react": "^19.2.14",
5858
"@types/react-dom": "^19.2.3",
59-
"@typescript/native-preview": "^7.0.0-dev.20260401.1",
59+
"@typescript/native-preview": "^7.0.0-dev.20260407.1",
6060
"@vitejs/plugin-react": "^6.0.1",
61-
"@vitest/browser-playwright": "^4.1.2",
62-
"@vitest/coverage-istanbul": "^4.1.2",
63-
"@vitest/eslint-plugin": "^1.6.13",
61+
"@vitest/browser-playwright": "^4.1.3",
62+
"@vitest/coverage-istanbul": "^4.1.3",
63+
"@vitest/eslint-plugin": "^1.6.14",
6464
"clsx": "^2.1.1",
6565
"ecij": "^0.4.1",
6666
"eslint": "^10.0.3",
6767
"eslint-plugin-react-hooks": "^7.0.1",
6868
"eslint-plugin-sonarjs": "^4.0.2",
6969
"jspdf": "^4.2.0",
7070
"jspdf-autotable": "^5.0.7",
71-
"oxfmt": "0.43.0",
71+
"oxfmt": "0.44.0",
7272
"playwright": "~1.59.0",
7373
"postcss": "^8.5.2",
7474
"react": "^19.2.4",
7575
"react-dom": "^19.2.4",
7676
"tsdown": "^0.21.7",
7777
"typescript": "~6.0.2",
7878
"typescript-eslint": "^8.58.0",
79-
"vite": "^8.0.3",
80-
"vitest": "^4.1.2",
81-
"vitest-browser-react": "^2.1.0"
79+
"vite": "^8.0.6",
80+
"vitest": "^4.1.3",
81+
"vitest-browser-react": "^2.2.0"
8282
},
8383
"peerDependencies": {
8484
"react": "^19.2",

test/browser/column/cellClass.test.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -35,8 +35,8 @@ test('cellClass is a string', async () => {
3535
await setup({ columns, rows });
3636
const cell1 = page.getCell({ name: '0' });
3737
const cell2 = page.getCell({ name: '1' });
38-
await expect.element(cell1).toHaveClass(`${cellClassname} my-cell`, { exact: true });
39-
await expect.element(cell2).toHaveClass(`${cellClassname} my-cell`, { exact: true });
38+
await expect.element(cell1).toHaveClass(cellClassname, 'my-cell', { exact: true });
39+
await expect.element(cell2).toHaveClass(cellClassname, 'my-cell', { exact: true });
4040
});
4141

4242
test('cellClass returns a string', async () => {
@@ -50,8 +50,8 @@ test('cellClass returns a string', async () => {
5050
await setup({ columns, rows });
5151
const cell1 = page.getCell({ name: '0' });
5252
const cell2 = page.getCell({ name: '1' });
53-
await expect.element(cell1).toHaveClass(`${cellClassname} my-cell-0`, { exact: true });
54-
await expect.element(cell2).toHaveClass(`${cellClassname} my-cell-1`, { exact: true });
53+
await expect.element(cell1).toHaveClass(cellClassname, 'my-cell-0', { exact: true });
54+
await expect.element(cell2).toHaveClass(cellClassname, 'my-cell-1', { exact: true });
5555
});
5656

5757
test('cellClass returns undefined', async () => {

test/browser/column/frozen.test.ts

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -38,12 +38,8 @@ test('frozen column have a specific class, and are stable-sorted before non-froz
3838
await expect.element(cell3).toHaveTextContent('col2');
3939
await expect.element(cell4).toHaveTextContent('col4');
4040

41-
await expect
42-
.element(cell1)
43-
.toHaveClass(`${cellClassname} ${cellFrozenClassname}`, { exact: true });
44-
await expect
45-
.element(cell2)
46-
.toHaveClass(`${cellClassname} ${cellFrozenClassname}`, { exact: true });
41+
await expect.element(cell1).toHaveClass(cellClassname, cellFrozenClassname, { exact: true });
42+
await expect.element(cell2).toHaveClass(cellClassname, cellFrozenClassname, { exact: true });
4743
await expect.element(cell3).toHaveClass(cellClassname, { exact: true });
4844
await expect.element(cell4).toHaveClass(cellClassname, { exact: true });
4945
});

test/browser/column/headerCellClass.test.ts

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -21,9 +21,7 @@ test('headerCellClass is either nullish or a string', async () => {
2121

2222
await setup({ columns, rows: [] });
2323
await expect.element(headerCells.nth(0)).toHaveClass(cellClassname, { exact: true });
24-
await expect
25-
.element(headerCells.nth(1))
26-
.toHaveClass(`${cellClassname} my-header`, { exact: true });
24+
await expect.element(headerCells.nth(1)).toHaveClass(cellClassname, 'my-header', { exact: true });
2725
});
2826

2927
test('columnGroup.headerCellClass is either nullish or a string', async () => {
@@ -41,7 +39,5 @@ test('columnGroup.headerCellClass is either nullish or a string', async () => {
4139

4240
await setup({ columns, rows: [] });
4341
await expect.element(headerCells.nth(0)).toHaveClass(cellClassname, { exact: true });
44-
await expect
45-
.element(headerCells.nth(1))
46-
.toHaveClass(`${cellClassname} my-header`, { exact: true });
42+
await expect.element(headerCells.nth(1)).toHaveClass(cellClassname, 'my-header', { exact: true });
4743
});

test/browser/column/renderEditCell.test.tsx

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useMemo, useState } from 'react';
22
import { createPortal } from 'react-dom';
3-
import { page, userEvent } from 'vitest/browser';
3+
import { page, server, userEvent } from 'vitest/browser';
44

55
import { DataGrid } from '../../../src';
66
import type { Column, DataGridProps } from '../../../src';
@@ -96,7 +96,7 @@ describe('Editor', () => {
9696
await userEvent.click(getCellsAtRowIndex(0).nth(0));
9797
const activeRowCells = getRowWithCell(page.getActiveCell()).getCell();
9898
await testCount(activeRowCells, 2);
99-
await scrollGrid({ top: 2001 });
99+
scrollGrid({ top: 2001 });
100100
await testCount(activeRowCells, 1);
101101
await expect.element(col1Editor).not.toBeInTheDocument();
102102
await expect.element(grid).toHaveProperty('scrollTop', 2001);
@@ -258,11 +258,19 @@ describe('Editor', () => {
258258

259259
await userEvent.dblClick(page.getCell({ name: 'name0' }));
260260
await userEvent.keyboard('abc');
261-
262-
await scrollGrid({ top: 1500 });
261+
if (server.browser === 'firefox') {
262+
// When typing, Firefox scroll to the caret asynchronously,
263+
// but does not to cancel the scroll task when calling `.scroll()` on the grid
264+
// https://github.com/mozilla-firefox/firefox/blob/287c6cf323492ae0cc031e468c1d87f623413f50/dom/html/TextControlElement.cpp#L330
265+
// https://github.com/mozilla-firefox/firefox/blob/287c6cf323492ae0cc031e468c1d87f623413f50/dom/base/Selection.cpp#L3828
266+
await new Promise(requestAnimationFrame);
267+
// Alternatively, configuring playwright's launchOptions.slowMo to 1 works,
268+
// but slows down the tests.
269+
}
270+
scrollGrid({ top: 1500 });
263271
await userEvent.click(page.getCell({ name: 'name43' }));
264272
await expect.element(page.getActiveCell()).toHaveTextContent(/^name43$/);
265-
await scrollGrid({ top: 0 });
273+
scrollGrid({ top: 0 });
266274
await expect.element(page.getCell({ name: 'name0abc' })).toBeVisible();
267275
});
268276

test/browser/column/summaryCellClass.test.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ test('summaryCellClass is a string', async () => {
3535
];
3636
await setup({ columns, topSummaryRows, bottomSummaryRows, rows: [] });
3737
for (const cell of cells.all()) {
38-
await expect.element(cell).toHaveClass(`${cellClassname} my-cell`, { exact: true });
38+
await expect.element(cell).toHaveClass(cellClassname, 'my-cell', { exact: true });
3939
}
4040
});
4141

@@ -48,10 +48,10 @@ test('summaryCellClass returns a string', async () => {
4848
}
4949
];
5050
await setup({ columns, topSummaryRows, bottomSummaryRows, rows: [] });
51-
await expect.element(cells.nth(0)).toHaveClass(`${cellClassname} my-cell-0`, { exact: true });
52-
await expect.element(cells.nth(1)).toHaveClass(`${cellClassname} my-cell-1`, { exact: true });
53-
await expect.element(cells.nth(2)).toHaveClass(`${cellClassname} my-cell-2`, { exact: true });
54-
await expect.element(cells.nth(3)).toHaveClass(`${cellClassname} my-cell-3`, { exact: true });
51+
await expect.element(cells.nth(0)).toHaveClass(cellClassname, 'my-cell-0', { exact: true });
52+
await expect.element(cells.nth(1)).toHaveClass(cellClassname, 'my-cell-1', { exact: true });
53+
await expect.element(cells.nth(2)).toHaveClass(cellClassname, 'my-cell-2', { exact: true });
54+
await expect.element(cells.nth(3)).toHaveClass(cellClassname, 'my-cell-3', { exact: true });
5555
});
5656

5757
test('summaryCellClass returns undefined', async () => {

test/browser/headerRowClass.test.ts

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,5 @@ test('headerRowClass is a string', async () => {
2828
rows,
2929
headerRowClass: 'my-header-row'
3030
});
31-
await expect
32-
.element(headerRow)
33-
.toHaveClass(`${headerRowClassname} my-header-row`, { exact: true });
31+
await expect.element(headerRow).toHaveClass(headerRowClassname, 'my-header-row', { exact: true });
3432
});

test/browser/keyboardNavigation.test.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import {
1313

1414
const activeCell = page.getActiveCell();
1515
const activeSelectAllCheckbox = activeCell.getSelectAllCheckbox();
16-
const activeSelectCheckbox = activeCell.getByRole('checkbox', { name: 'Select', exact: true });
16+
const activeSelectCheckbox = activeCell.getByRole('checkbox', { name: 'Select' });
1717

1818
type Row = undefined;
1919

@@ -279,21 +279,21 @@ test('navigation when active cell not in the viewport', async () => {
279279
await userEvent.keyboard('{Control>}{end}{/Control}{arrowup}{arrowup}');
280280
await validateCellPosition(99, 100);
281281
await expect.element(activeRowCells).not.toHaveLength(1);
282-
await scrollGrid({ top: 0 });
282+
scrollGrid({ top: 0 });
283283
await testCount(activeRowCells, 1);
284284
await userEvent.keyboard('{arrowup}');
285285
await validateCellPosition(99, 99);
286286
await expect.element(activeRowCells).not.toHaveLength(1);
287287

288-
await scrollGrid({ left: 0 });
288+
scrollGrid({ left: 0 });
289289
await userEvent.keyboard('{arrowdown}');
290290
await validateCellPosition(99, 100);
291291

292292
await userEvent.keyboard(
293293
'{home}{arrowright}{arrowright}{arrowright}{arrowright}{arrowright}{arrowright}{arrowright}'
294294
);
295295
await validateCellPosition(7, 100);
296-
await scrollGrid({ left: 2000 });
296+
scrollGrid({ left: 2000 });
297297
await userEvent.keyboard('{arrowleft}');
298298
await validateCellPosition(6, 100);
299299
});

test/browser/rowClass.test.ts

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -19,9 +19,9 @@ test('rowClass is undefined', async () => {
1919
rows: initialRows,
2020
rowClass: undefined
2121
});
22-
await expect.element(rows.nth(0)).toHaveClass(`${rowClassname} rdg-row-even`, { exact: true });
23-
await expect.element(rows.nth(1)).toHaveClass(`${rowClassname} rdg-row-odd`, { exact: true });
24-
await expect.element(rows.nth(2)).toHaveClass(`${rowClassname} rdg-row-even`, { exact: true });
22+
await expect.element(rows.nth(0)).toHaveClass(rowClassname, 'rdg-row-even', { exact: true });
23+
await expect.element(rows.nth(1)).toHaveClass(rowClassname, 'rdg-row-odd', { exact: true });
24+
await expect.element(rows.nth(2)).toHaveClass(rowClassname, 'rdg-row-even', { exact: true });
2525
});
2626

2727
test('rowClass returns a string', async () => {
@@ -32,13 +32,13 @@ test('rowClass returns a string', async () => {
3232
});
3333
await expect
3434
.element(rows.nth(0))
35-
.toHaveClass(`${rowClassname} rdg-row-even my-row-0`, { exact: true });
35+
.toHaveClass(rowClassname, 'rdg-row-even my-row-0', { exact: true });
3636
await expect
3737
.element(rows.nth(1))
38-
.toHaveClass(`${rowClassname} rdg-row-odd my-row-1`, { exact: true });
38+
.toHaveClass(rowClassname, 'rdg-row-odd my-row-1', { exact: true });
3939
await expect
4040
.element(rows.nth(2))
41-
.toHaveClass(`${rowClassname} rdg-row-even my-row-2`, { exact: true });
41+
.toHaveClass(rowClassname, 'rdg-row-even my-row-2', { exact: true });
4242
});
4343

4444
test('rowClass returns undefined', async () => {
@@ -47,7 +47,7 @@ test('rowClass returns undefined', async () => {
4747
rows: initialRows,
4848
rowClass: () => undefined
4949
});
50-
await expect.element(rows.nth(0)).toHaveClass(`${rowClassname} rdg-row-even`, { exact: true });
51-
await expect.element(rows.nth(1)).toHaveClass(`${rowClassname} rdg-row-odd`, { exact: true });
52-
await expect.element(rows.nth(2)).toHaveClass(`${rowClassname} rdg-row-even`, { exact: true });
50+
await expect.element(rows.nth(0)).toHaveClass(rowClassname, 'rdg-row-even', { exact: true });
51+
await expect.element(rows.nth(1)).toHaveClass(rowClassname, 'rdg-row-odd', { exact: true });
52+
await expect.element(rows.nth(2)).toHaveClass(rowClassname, 'rdg-row-even', { exact: true });
5353
});

test/browser/utils.tsx

Lines changed: 3 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -25,15 +25,9 @@ export async function validateCellPosition(columnIdx: number, rowIdx: number) {
2525
await expect.element(row).toHaveAttribute('aria-rowindex', `${rowIdx + 1}`);
2626
}
2727

28-
export async function scrollGrid(options: ScrollToOptions) {
29-
await new Promise((resolve) => {
30-
// wait for browser state to stablize before scrolling, to avoid flaky scroll-related tests
31-
requestAnimationFrame(() => {
32-
const gridElement = page.getGrid().element();
33-
gridElement.addEventListener('scrollend', resolve, { once: true });
34-
gridElement.scroll(options);
35-
});
36-
});
28+
export function scrollGrid(options: ScrollToOptions) {
29+
const grid = page.getGrid().element();
30+
grid.scroll(options);
3731
}
3832

3933
export function testCount(locator: Locator, expectedCount: number) {

0 commit comments

Comments
 (0)