diff --git a/tests/playwright-test/reporter-html.spec.ts b/tests/playwright-test/reporter-html.spec.ts
index 9ab49f9060..beecb68f71 100644
--- a/tests/playwright-test/reporter-html.spec.ts
+++ b/tests/playwright-test/reporter-html.spec.ts
@@ -1881,3 +1881,38 @@ test('should list tests in the right order', async ({ runInlineTest, showReport,
     /main › second › passes\d+m?ssecond.ts:5/,
   ]);
 });
+
+test('tests should filter by file', async ({ runInlineTest, showReport, page }) => {
+  const result = await runInlineTest({
+    'file-a.test.js': `
+      const { test } = require('@playwright/test');
+      test('a test 1', async ({}) => {});
+      test('a test 2', async ({}) => {});
+    `,
+    'file-b.test.js': `
+      const { test } = require('@playwright/test');
+      test('b test 1', async ({}) => {});
+      test('b test 2', async ({}) => {});
+    `,
+  }, { reporter: 'dot,html' }, { PW_TEST_HTML_REPORT_OPEN: 'never' });
+
+  expect(result.exitCode).toBe(0);
+  expect(result.passed).toBe(4);
+  expect(result.failed).toBe(0);
+
+  await showReport();
+
+  const searchInput = page.locator('.subnav-search-input');
+
+  await searchInput.fill('file-a');
+  await expect(page.getByText('file-a.test.js', { exact: true })).toBeVisible();
+  await expect(page.getByText('a test 1')).toBeVisible();
+  await expect(page.getByText('a test 2')).toBeVisible();
+  await expect(page.getByText('file-b.test.js', { exact: true })).not.toBeVisible();
+  await expect(page.getByText('b test 1')).not.toBeVisible();
+  await expect(page.getByText('b test 2')).not.toBeVisible();
+
+  await searchInput.fill('file-a:3');
+  await expect(page.getByText('a test 1')).toBeVisible();
+  await expect(page.getByText('a test 2')).not.toBeVisible();
+});