From b5c14cb68d5bbfbf0d50f83ffa8d1b141d6b906d Mon Sep 17 00:00:00 2001
From: "Tommy D. Rossi" <beats.by.morse@gmail.com>
Date: Wed, 18 Feb 2026 00:56:43 +0100
Subject: [PATCH] add test proving viewport screenshot dimensions are correct
 without clip param
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

In connectOverCDP mode, Playwright already falls back to querying
window.innerWidth/innerHeight for viewport size (screenshotter.ts
_originalViewportSize). This test confirms the screenshot dimensions
match exactly with just scale:'css' and no manual clip, proving
the clip in screenshotWithAccessibilityLabels is redundant.

The test goes through the full extension CDP path:
Playwright → relay server → extension WS → chrome.debugger
---
 playwriter/src/snapshot-tools.test.ts | 39 +++++++++++++++++++++++++++
 1 file changed, 39 insertions(+)

diff --git a/playwriter/src/snapshot-tools.test.ts b/playwriter/src/snapshot-tools.test.ts
index 9016899..5df166c 100644
--- a/playwriter/src/snapshot-tools.test.ts
+++ b/playwriter/src/snapshot-tools.test.ts
@@ -138,6 +138,45 @@ describe('Snapshot & Screenshot Tests', () => {
         await page.close()
     }, 60000)
 
+    it('should match window.innerWidth/Height without clip param', async () => {
+        // Proves that in connectOverCDP mode, Playwright already queries
+        // window.innerWidth/innerHeight for viewport screenshots, so passing
+        // a manual clip is redundant.
+        const browserContext = getBrowserContext()
+        const serviceWorker = await getExtensionServiceWorker(browserContext)
+
+        const page = await browserContext.newPage()
+        await page.goto('https://example.com/')
+        await page.bringToFront()
+
+        await serviceWorker.evaluate(async () => {
+            await globalThis.toggleExtensionForActiveTab()
+        })
+        await new Promise(r => setTimeout(r, 100))
+
+        const browser = await chromium.connectOverCDP(getCdpUrl({ port: TEST_PORT }))
+        const cdpPage = browser.contexts()[0].pages().find(p => p.url().includes('example.com'))
+        expect(cdpPage).toBeDefined()
+
+        // Get actual browser viewport via JS
+        const actualViewport = await cdpPage!.evaluate(() => ({
+            width: window.innerWidth,
+            height: window.innerHeight,
+        }))
+        console.log('Actual viewport (window.inner*):', actualViewport)
+
+        // Plain screenshot with scale:'css', NO clip
+        const screenshot = await cdpPage!.screenshot({ scale: 'css' })
+        const dimensions = imageSize(screenshot)
+        console.log('Screenshot dimensions (no clip):', dimensions)
+
+        expect(dimensions.width).toBe(actualViewport.width)
+        expect(dimensions.height).toBe(actualViewport.height)
+
+        await browser.close()
+        await page.close()
+    }, 60000)
+
     it('should capture element screenshot with correct coordinates', async () => {
         const browserContext = getBrowserContext()
         const serviceWorker = await getExtensionServiceWorker(browserContext)