task-17(壳层/路由): 桌面端壳层响应式验收 + 浏览器验收基建

引入 @playwright/test(mdEdge 通道)，playwright.config 起 mock admin API + vite dev； e2e 覆盖宽/窄屏自动折叠、折叠持久化、无横向溢出等 8 用例；workspace 边界扫描排除测试专用 e2e/scripts/playwright.config。
2026-09-05 12:34:22 +08:00
parent d397c88c3c
commit 7ffae78919
6 changed files with 2431 additions and 2 deletions
@@ -0,0 +1,73 @@
+import { expect, test, type Page } from '@playwright/test'
+
+async function open(page: Page, width: number, path = '/admin-vue/') {
+  await page.setViewportSize({ width, height: 900 })
+  await page.goto(path)
+}
+
+test('test_task_017_desktop_shell_responsive_normal_primary_path', async ({ page }) => {
+  await open(page, 1440)
+  await expect(page.locator('h2')).toHaveText('用户管理')
+  const shell = page.locator('.admin-shell')
+  await expect(shell).not.toHaveClass(/is-collapsed/)
+  await expect(page.locator('.admin-brand-copy strong')).toHaveText('数富AI')
+  await expect(page.locator('.sidebar-collapse')).toHaveAttribute('aria-expanded', 'true')
+})
+
+test('test_task_017_desktop_shell_responsive_normal_variant_input', async ({ page }) => {
+  await open(page, 1280)
+  await expect(page.locator('h2')).toHaveText('用户管理')
+  await expect(page.locator('.admin-shell')).not.toHaveClass(/is-collapsed/)
+})
+
+test('test_task_017_desktop_shell_responsive_normal_repeated_operation_is_idempotent', async ({ page }) => {
+  await open(page, 1440)
+  await expect(page.locator('.sidebar-collapse')).toHaveAttribute('aria-expanded', 'true')
+  const toggle = page.locator('.sidebar-collapse')
+  await toggle.click()
+  await expect(page.locator('.admin-shell')).toHaveClass(/is-collapsed/)
+  await toggle.click()
+  await expect(page.locator('.admin-shell')).not.toHaveClass(/is-collapsed/)
+  await expect(toggle).toHaveAttribute('aria-expanded', 'true')
+})
+
+test('test_task_017_desktop_shell_responsive_boundary_empty_input', async ({ page }) => {
+  await open(page, 640)
+  await expect(page.locator('h2')).toHaveText('用户管理')
+  await expect(page.locator('.admin-shell')).toHaveClass(/is-collapsed/)
+  await expect(page.locator('.brand-copy, .admin-brand-copy')).toHaveCount(0)
+  await expect(page.locator('.sidebar-collapse')).toHaveAttribute('aria-expanded', 'false')
+})
+
+test('test_task_017_desktop_shell_responsive_boundary_single_item', async ({ page }) => {
+  await open(page, 700)
+  await expect(page.locator('.admin-shell')).toHaveClass(/is-collapsed/)
+  await page.locator('.sidebar-collapse').click()
+  await expect(page.locator('.admin-shell')).not.toHaveClass(/is-collapsed/)
+  await expect(page.locator('.admin-brand-copy strong')).toHaveText('数富AI')
+})
+
+test('test_task_017_desktop_shell_responsive_boundary_limit_or_missing_field', async ({ page }) => {
+  await open(page, 900)
+  await expect(page.locator('.admin-shell')).toHaveClass(/is-collapsed/)
+  await open(page, 901, '/admin-vue/account/users')
+  await expect(page.locator('.admin-shell')).not.toHaveClass(/is-collapsed/)
+})
+
+test('test_task_017_desktop_shell_responsive_invalid_input_rejected', async ({ page }) => {
+  // 手动折叠偏好持久化，刷新后仍保持（不因页面重载而回弹）。
+  await open(page, 1440)
+  await page.locator('.sidebar-collapse').click()
+  await expect(page.locator('.admin-shell')).toHaveClass(/is-collapsed/)
+  await page.reload()
+  await expect(page.locator('.admin-shell')).toHaveClass(/is-collapsed/)
+})
+
+test('test_task_017_desktop_shell_responsive_dependency_failure_returns_actionable_message', async ({ page }) => {
+  // 桌面/窄屏两种宽度下壳层均无初始化错误、导航地标可见。
+  await open(page, 1440)
+  await expect(page.locator('.el-alert--error')).toHaveCount(0)
+  await expect(page.getByRole('navigation', { name: '侧边栏菜单' })).toBeVisible()
+  await open(page, 820, '/admin-vue/account/users')
+  await expect(page.locator('.el-alert--error')).toHaveCount(0)
+})