Vitest: fix viewport scale (#3895)

Author: nstepien

test/browser/column/resizable.test.tsx

@@ -54,17 +54,14 @@ test('should resize column when dragging the handle', async () => {
   expect(onColumnResize).not.toHaveBeenCalled();
   await expect.element(grid).toHaveStyle({ gridTemplateColumns: '100px 200px' });
   await resize('col2', -50);
-  await testGridTemplateColumns('100px 150px', '100px 150.5px');
-  expect(onColumnResize).toHaveBeenCalledExactlyOnceWith(
-    expect.objectContaining(columns[1]),
-    satisfyRange(150)
-  );
+  await expect.element(grid).toHaveStyle({ gridTemplateColumns: '100px 150px' });
+  expect(onColumnResize).toHaveBeenCalledExactlyOnceWith(expect.objectContaining(columns[1]), 150);
 });
 
 test('should use the maxWidth if specified when dragging the handle', async () => {
   await setup<Row, unknown>({ columns, rows: [] });
   const grid = getGrid();
-  await expect.element(grid).toHaveStyle({ gridTemplateColumns: '100px 200px ' });
+  await expect.element(grid).toHaveStyle({ gridTemplateColumns: '100px 200px' });
   await resize('col2', 1000);
   await expect.element(grid).toHaveStyle({ gridTemplateColumns: '100px 400px' });
 });
@@ -100,7 +97,7 @@ test('should use the maxWidth if specified when resizing using keyboard', async
   const onColumnResize = vi.fn();
   await setup<Row, unknown>({ columns, rows: [], onColumnResize });
   const grid = getGrid();
-  await expect.element(grid).toHaveStyle({ gridTemplateColumns: '100px 200px ' });
+  await expect.element(grid).toHaveStyle({ gridTemplateColumns: '100px 200px' });
   const col2 = getHeaderCell('col2');
   await userEvent.click(col2);
   await userEvent.keyboard(`{Control>}${'{ArrowRight}'.repeat(22)}{/Control}`);
@@ -305,16 +302,8 @@ test('should use columnWidths and onColumnWidthsChange props when provided', asy
     ])
   );
   expect(onColumnResizeSpy).toHaveBeenCalledTimes(3);
-  expect(onColumnResizeSpy).toHaveBeenNthCalledWith(
-    1,
-    expect.objectContaining(columns[1]),
-    satisfyRange(105)
-  );
-  expect(onColumnResizeSpy).toHaveBeenNthCalledWith(
-    2,
-    expect.objectContaining(columns[1]),
-    satisfyRange(110)
-  );
+  expect(onColumnResizeSpy).toHaveBeenNthCalledWith(1, expect.objectContaining(columns[1]), 105);
+  expect(onColumnResizeSpy).toHaveBeenNthCalledWith(2, expect.objectContaining(columns[1]), 110);
   expect(onColumnResizeSpy).toHaveBeenNthCalledWith(3, expect.objectContaining(columns[1]), 115);
   onColumnWidthsChangeSpy.mockClear();
   onColumnResizeSpy.mockClear();
@@ -324,11 +313,10 @@ test('should use columnWidths and onColumnWidthsChange props when provided', asy
   expect(onColumnResizeSpy).not.toHaveBeenCalled();
   await expect.element(grid).toHaveStyle({ gridTemplateColumns: '120px 120px' });
   await resize('col2', [5, 5]);
-  const col2Width = navigator.userAgent.includes('Chrome') ? 130 : 130.5;
   expect(onColumnWidthsChangeSpy).toHaveBeenCalledExactlyOnceWith(
     new Map([
       ['col1', { width: 120, type: 'measured' }],
-      ['col2', { width: col2Width, type: 'resized' }]
+      ['col2', { width: 130, type: 'resized' }]
     ])
   );
 });
@@ -346,9 +334,3 @@ async function testGridTemplateColumns(chrome: string, firefox: string, firefoxC
     });
   }
 }
-
-// TODO: remove once scale is set to 1
-function satisfyRange(value: number) {
-  // eslint-disable-next-line @typescript-eslint/no-unsafe-return
-  return expect.toSatisfy((v: number) => v >= value - 1 && v <= value + 1);
-}

vite.config.ts

@@ -23,11 +23,9 @@ const resizeColumn: BrowserCommand<[name: string, resizeBy: number | readonly nu
   await page.mouse.move(x + 5, y + 5);
   await page.mouse.down();
   resizeBy = Array.isArray(resizeBy) ? resizeBy : [resizeBy];
-  // https://github.com/vitest-dev/vitest/issues/8099#issuecomment-2959674792
-  const frameScale = Number((await page.locator('#vitest-tester').getAttribute('data-scale')) ?? 1);
   let newX = x + 5;
   for (const value of resizeBy) {
-    newX += value * frameScale;
+    newX += value;
     await page.mouse.move(newX, y + 5);
   }
   await page.mouse.up();
@@ -122,20 +120,15 @@ export default defineConfig(
               // TODO: remove when FF tests are stable
               fileParallelism: false,
               enabled: true,
-              provider: playwright(),
+              provider: playwright({
+                contextOptions: {
+                  viewport
+                }
+              }),
               trace: {
                 mode: isCI ? 'off' : 'retain-on-failure'
               },
-              instances: [
-                {
-                  browser: 'chromium',
-                  viewport
-                },
-                {
-                  browser: 'firefox',
-                  viewport
-                }
-              ],
+              instances: [{ browser: 'chromium' }, { browser: 'firefox' }],
               commands: { resizeColumn, dragFill, scrollGrid },
               viewport,
               headless: true,