79 lines
3.1 KiB
TypeScript
79 lines
3.1 KiB
TypeScript
import { expect, test, type Page } from '@playwright/test'
|
|
|
|
// 壳层可访问性对齐现状（task-276 已移除侧边栏收起按钮/is-collapsed 机制）：
|
|
// 断言主题改为「跳转链接、地标唯一性、标题层级、键盘可达」。
|
|
|
|
async function openUsers(page: Page) {
|
|
await page.goto('/admin-vue/')
|
|
await expect(page.locator('.admin-topbar h1')).toHaveText('用户管理')
|
|
}
|
|
|
|
test('test_task_018_shell_accessibility_normal_primary_path', async ({ page }) => {
|
|
await openUsers(page)
|
|
await expect(page.getByRole('navigation', { name: '侧边栏菜单' })).toBeVisible()
|
|
})
|
|
|
|
test('test_task_018_shell_accessibility_normal_variant_input', async ({ page }) => {
|
|
await openUsers(page)
|
|
const skip = page.locator('.skip-link')
|
|
await expect(skip).toBeVisible()
|
|
await expect(skip).toHaveAttribute('href', '#admin-content')
|
|
})
|
|
|
|
test('test_task_018_shell_accessibility_normal_repeated_operation_is_idempotent', async ({ page }) => {
|
|
await openUsers(page)
|
|
await page.reload()
|
|
await expect(page.locator('.admin-topbar h1')).toHaveText('用户管理')
|
|
await expect(page.getByRole('navigation', { name: '侧边栏菜单' })).toBeVisible()
|
|
})
|
|
|
|
test('test_task_018_shell_accessibility_boundary_empty_input', async ({ page }) => {
|
|
await openUsers(page)
|
|
await expect(page.locator('.skip-link')).toHaveAttribute('href', '#admin-content')
|
|
await expect(page.locator('#admin-content')).toHaveCount(1)
|
|
})
|
|
|
|
test('test_task_018_shell_accessibility_boundary_single_item', async ({ page }) => {
|
|
await openUsers(page)
|
|
// 键盘可达：Tab 到跳转链接，回车跳到主内容（hash 定位）。
|
|
await page.locator('.skip-link').focus()
|
|
await expect(page.locator('.skip-link')).toBeFocused()
|
|
await page.keyboard.press('Enter')
|
|
await expect(page).toHaveURL(/#admin-content/)
|
|
await expect(page.locator('#admin-content')).toBeVisible()
|
|
})
|
|
|
|
test('test_task_018_shell_accessibility_boundary_limit_or_missing_field', async ({ page }) => {
|
|
await openUsers(page)
|
|
await expect(page.locator('main#admin-content')).toBeVisible()
|
|
await expect(page.getByRole('main')).toHaveCount(1)
|
|
})
|
|
|
|
test('test_task_018_shell_accessibility_invalid_input_rejected', async ({ page }) => {
|
|
await openUsers(page)
|
|
// 导航后无可见错误遮罩/弹层残留。
|
|
await expect(page.locator('.el-overlay:visible')).toHaveCount(0)
|
|
await expect(page.locator('.el-alert--error')).toHaveCount(0)
|
|
})
|
|
|
|
test('test_task_018_shell_accessibility_dependency_failure_returns_actionable_message', async ({ page }) => {
|
|
await openUsers(page)
|
|
// 标题层级：顶栏唯一 h1(页面标题)；页面面板标题用 h3 递进。
|
|
await expect(page.locator('.admin-topbar h1')).toHaveText('用户管理')
|
|
await expect(page.locator('h1')).toHaveCount(1)
|
|
const hasFocusStyle = await page.evaluate(() => {
|
|
const rules: string[] = []
|
|
for (const sheet of document.styleSheets) {
|
|
try {
|
|
for (const rule of sheet.cssRules) {
|
|
if (rule.cssText.includes(':focus-visible')) rules.push(rule.cssText)
|
|
}
|
|
} catch {
|
|
// 跨域样式表忽略
|
|
}
|
|
}
|
|
return rules.length > 0
|
|
})
|
|
expect(hasFocusStyle).toBe(true)
|
|
})
|