From 91ef9c6b5523729d04ba754286615e3c9d340b09 Mon Sep 17 00:00:00 2001
From: Simon Knott <info@simonknott.de>
Date: Wed, 11 Dec 2024 16:22:39 +0100
Subject: [PATCH] use toBeInViewport

---
 tests/playwright-test/reporter-html.spec.ts | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/tests/playwright-test/reporter-html.spec.ts b/tests/playwright-test/reporter-html.spec.ts
index fa3b62ef7b..c9fe31002f 100644
--- a/tests/playwright-test/reporter-html.spec.ts
+++ b/tests/playwright-test/reporter-html.spec.ts
@@ -921,7 +921,9 @@ for (const useIntermediateMergeReport of [true, false] as const) {
         'a.test.js': `
           import { test, expect } from '@playwright/test';
           test('passing', async ({ page }, testInfo) => {
-            await testInfo.attach('foo', { body: 'bar' });
+            for (let i = 0; i < 100; i++)
+              await testInfo.attach('foo-1', { body: 'bar' });
+            await testInfo.attach('foo-2', { body: 'bar' });
           });
         `,
       }, { reporter: 'dot,html' }, { PLAYWRIGHT_HTML_OPEN: 'never' });
@@ -929,12 +931,11 @@ for (const useIntermediateMergeReport of [true, false] as const) {
 
       await showReport();
       await page.getByRole('link', { name: 'passing' }).click();
-      await page.getByLabel('attach "foo"').getByTitle('link to attachment').click();
 
-      await page.waitForURL(url => {
-        const navState = new URLSearchParams(url.hash.slice(1));
-        return navState.get('anchor') === 'attachment-foo';
-      });
+      const attachment = page.getByText('foo-2', { exact: true });
+      await expect(attachment).not.toBeInViewport();
+      await page.getByLabel('attach "foo-2"').getByTitle('link to attachment').click();
+      await expect(attachment).toBeInViewport();
     });
 
     test('should highlight textual diff', async ({ runInlineTest, showReport, page }) => {