test: exclude top 15% of viewport from mobile screenshot tests

- Add viewport clipping to mobile baseline tests to reduce flakiness
- Clip top 15% of viewport for all @mobile screenshot tests
- Affects:
  - mobileBaseline.spec.ts: empty canvas and default workflow tests
  - pan.spec.ts: touch pan test
  - move.spec.ts: touch node move test
- This helps reduce test flakiness from variable mobile UI elements

browser_tests/tests/mobileBaseline.spec.ts

@@ -9,13 +9,40 @@ test.describe('Mobile Baseline Snapshots', () => {
       expect(await comfyPage.getGraphNodesCount()).toBe(0)
     }).toPass({ timeout: 256 })
     await comfyPage.nextFrame()
-    await expect(comfyPage.canvas).toHaveScreenshot('mobile-empty-canvas.png')
+
+    // Get viewport size and clip top 15%
+    const viewportSize = comfyPage.page.viewportSize()
+    const clipRegion = viewportSize
+      ? {
+          x: 0,
+          y: Math.floor(viewportSize.height * 0.15),
+          width: viewportSize.width,
+          height: Math.ceil(viewportSize.height * 0.85)
+        }
+      : undefined
+
+    await expect(comfyPage.canvas).toHaveScreenshot('mobile-empty-canvas.png', {
+      clip: clipRegion
+    })
   })
 
   test('@mobile default workflow', async ({ comfyPage }) => {
     await comfyPage.loadWorkflow('default')
+
+    // Get viewport size and clip top 15%
+    const viewportSize = comfyPage.page.viewportSize()
+    const clipRegion = viewportSize
+      ? {
+          x: 0,
+          y: Math.floor(viewportSize.height * 0.15),
+          width: viewportSize.width,
+          height: Math.ceil(viewportSize.height * 0.85)
+        }
+      : undefined
+
     await expect(comfyPage.canvas).toHaveScreenshot(
-      'mobile-default-workflow.png'
+      'mobile-default-workflow.png',
+      { clip: clipRegion }
     )
   })
 

browser_tests/tests/vueNodes/interactions/canvas/pan.spec.ts

@@ -11,8 +11,21 @@ test.describe('Vue Nodes Canvas Pan', () => {
 
   test('@mobile Can pan with touch', async ({ comfyPage }) => {
     await comfyPage.panWithTouch({ x: 64, y: 64 }, { x: 256, y: 256 })
+
+    // Get viewport size and clip top 15%
+    const viewportSize = comfyPage.page.viewportSize()
+    const clipRegion = viewportSize
+      ? {
+          x: 0,
+          y: Math.floor(viewportSize.height * 0.15),
+          width: viewportSize.width,
+          height: Math.ceil(viewportSize.height * 0.85)
+        }
+      : undefined
+
     await expect(comfyPage.canvas).toHaveScreenshot(
-      'vue-nodes-paned-with-touch.png'
+      'vue-nodes-paned-with-touch.png',
+      { clip: clipRegion }
     )
   })
 })

browser_tests/tests/vueNodes/interactions/node/move.spec.ts

@@ -1,8 +1,5 @@
-import {
+import { comfyExpect as expect, comfyPageFixture as test } from '../../../../fixtures/ComfyPage';
-  type ComfyPage,
+import type { ComfyPage } from '../../../../fixtures/ComfyPage';
-  comfyExpect as expect,
-  comfyPageFixture as test
-} from '../../../../fixtures/ComfyPage'
 import type { Position } from '../../../../fixtures/types'
 
 test.describe('Vue Node Moving', () => {
@@ -60,8 +57,20 @@ test.describe('Vue Node Moving', () => {
     const newHeaderPos = await getLoadCheckpointHeaderPos(comfyPage)
     await expectPosChanged(loadCheckpointHeaderPos, newHeaderPos)
 
+    // Get viewport size and clip top 15%
+    const viewportSize = comfyPage.page.viewportSize()
+    const clipRegion = viewportSize
+      ? {
+          x: 0,
+          y: Math.floor(viewportSize.height * 0.15),
+          width: viewportSize.width,
+          height: Math.ceil(viewportSize.height * 0.85)
+        }
+      : undefined
+
     await expect(comfyPage.canvas).toHaveScreenshot(
-      'vue-node-moved-node-touch.png'
+      'vue-node-moved-node-touch.png',
+      { clip: clipRegion }
     )
   })
 })