diff --git a/apps/web_v1/scripts/visual-check.mjs b/apps/web_v1/scripts/visual-check.mjs index 9d0bdcc..437a6de 100644 --- a/apps/web_v1/scripts/visual-check.mjs +++ b/apps/web_v1/scripts/visual-check.mjs @@ -240,6 +240,26 @@ if (await projectNavButton.count() === 0) { if (!await page.locator('aside.project-rail.open').isVisible()) { failures.push('打开项目导航 must reveal the project rail aside') } + await page.setViewportSize({ width: 1440, height: 1024 }) + const resizedDesktopMetrics = await collectMetrics() + const desktopBackdropDisplay = await page.locator('.nav-backdrop').evaluate((node) => getComputedStyle(node).display) + if (desktopBackdropDisplay !== 'none') { + failures.push(`navigation backdrop must be hidden after resizing to desktop, got display=${desktopBackdropDisplay}`) + } + if (resizedDesktopMetrics.overflowX) { + failures.push('resized desktop project viewport must not overflow horizontally') + } + if (!resizedDesktopMetrics.projectRail || !resizedDesktopMetrics.channelSidebar || !resizedDesktopMetrics.stage) { + failures.push('resized desktop must preserve project rail, channel sidebar, and stage') + } else if ( + Math.abs(resizedDesktopMetrics.channelSidebar.left - resizedDesktopMetrics.projectRail.right) > 1 || + Math.abs(resizedDesktopMetrics.stage.left - resizedDesktopMetrics.channelSidebar.right) > 1 || + Math.abs(resizedDesktopMetrics.stage.right - resizedDesktopMetrics.viewportWidth) > 1 + ) { + failures.push(`resized desktop layout must preserve the core grid, got rail=${JSON.stringify(resizedDesktopMetrics.projectRail)}, sidebar=${JSON.stringify(resizedDesktopMetrics.channelSidebar)}, stage=${JSON.stringify(resizedDesktopMetrics.stage)}`) + } + await page.setViewportSize({ width: 390, height: 844 }) + await waitForDrawerOpen('aside.project-rail') await page.getByRole('button', { name: '关闭导航', exact: true }).click({ position: { x: 380, y: 20 } }) } diff --git a/apps/web_v1/src/App.css b/apps/web_v1/src/App.css index 440ba69..982af23 100644 --- a/apps/web_v1/src/App.css +++ b/apps/web_v1/src/App.css @@ -235,6 +235,10 @@ display: none; } +.nav-backdrop { + display: none; +} + .dock-icon { position: relative; display: inline-block; @@ -2121,6 +2125,7 @@ } .nav-backdrop { + display: block; position: fixed; inset: 58px 0 32px; z-index: 19;