V13-FE-005: consolidate approved UI governance and contract hardening
Consolidates KBX UI Boundary Governance framework with component manifest, screen recipe registry, AI component gate, and exception lifecycle validation. Evidence (evidence/V13-FE-005/*.log, 55+ files): - Full frontend regression: 70 files / 180 tests PASS - UI boundary gate: 37 files / 0 failures / 6 raw-color warnings (DEBT tracked) - Component manifest validation: 0 failures - Screen recipe governance: 0 failures - AI component gate: 17 feature files / 23 known exports / 0 failures - Accessibility E2E: 22 passed - Production build: PASS (>500 kB chunk warning V13-FE-038 DECISION_REQUIRED) - TypeCheck: PASS - KBX validators: All 5 PASS (failures=0) Added: 19 files (6 validator scripts, 6 test specs, 4 slice notes, 3 registries) Modified: 9 files (CI workflow, WBS tracker, E2E specs, FE setup, Layout, TS configs) Outstanding per V13-FE-005 note: AI prop-level validation, exception lifecycle, browser/visual/AT/performance evidence. No completion overclaim. AGENTS.md compliance: #9 (Traceability — evidence preserved), #11 (no placeholders), #12 (right way, WBS execution completed). Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,15 @@
|
||||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('KBX shell exposes real keyboard and landmark accessibility contracts', async ({ page }) => {
|
||||
await page.goto('/model-ops/models', { waitUntil: 'networkidle' })
|
||||
await expect(page.locator('a.ks-skip')).toHaveAttribute('href', '#ks-main')
|
||||
await expect(page.locator('main#ks-main')).toHaveAttribute('tabindex', '-1')
|
||||
await expect(page.locator('aside[aria-label="주요 메뉴"]')).toBeVisible()
|
||||
await expect(page.locator('nav[aria-label="열린 업무"]')).toBeVisible()
|
||||
await expect(page.locator('nav[aria-label="현재 위치"]')).toBeVisible()
|
||||
await expect(page.locator('h1')).toContainText('Model Management')
|
||||
|
||||
await page.locator('a.ks-skip').focus()
|
||||
await page.keyboard.press('Enter')
|
||||
await expect(page.locator('main#ks-main')).toBeFocused()
|
||||
})
|
||||
@@ -0,0 +1,20 @@
|
||||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test.use({ viewport: { width: 390, height: 844 } })
|
||||
|
||||
test('KBX shell preserves usable layout at the supported mobile viewport', async ({ page }) => {
|
||||
await page.goto('/model-ops/models', { waitUntil: 'networkidle' })
|
||||
|
||||
const shell = page.locator('.ks-app-shell')
|
||||
const main = page.locator('main#ks-main')
|
||||
await expect(shell).toBeVisible()
|
||||
await expect(main).toBeVisible()
|
||||
await expect(page.locator('h1')).toContainText('Model Management')
|
||||
|
||||
const viewport = page.viewportSize()
|
||||
const shellBox = await shell.boundingBox()
|
||||
expect(viewport).not.toBeNull()
|
||||
expect(shellBox).not.toBeNull()
|
||||
expect(shellBox!.width).toBeLessThanOrEqual(viewport!.width)
|
||||
expect(await page.locator('.ks-app-shell__main').evaluate(element => element.scrollWidth <= element.clientWidth)).toBe(true)
|
||||
})
|
||||
@@ -3,7 +3,7 @@ import { test, expect } from '@playwright/test'
|
||||
test.describe('Models (KBX Foundation)', () => {
|
||||
test.beforeEach(async ({ page }) => {
|
||||
// Navigate to models list
|
||||
await page.goto('http://localhost:5173/model-ops/models', {
|
||||
await page.goto('/model-ops/models', {
|
||||
waitUntil: 'networkidle',
|
||||
})
|
||||
|
||||
@@ -17,11 +17,11 @@ test.describe('Models (KBX Foundation)', () => {
|
||||
await expect(title).toContainText('Model Management')
|
||||
|
||||
// Check grid visibility
|
||||
const grid = page.locator('.kbx-data-grid')
|
||||
const grid = page.locator('.ks-grid')
|
||||
await expect(grid).toBeVisible()
|
||||
|
||||
// Check summary badges
|
||||
const summaryItems = page.locator('[class*="summary"]')
|
||||
const summaryItems = page.locator('.ks-list-page__footer > span')
|
||||
await expect(summaryItems).toHaveCount(4)
|
||||
})
|
||||
|
||||
@@ -37,7 +37,7 @@ test.describe('Models (KBX Foundation)', () => {
|
||||
await page.waitForTimeout(300)
|
||||
|
||||
// Grid should still be visible
|
||||
const grid = page.locator('.kbx-data-grid')
|
||||
const grid = page.locator('.ks-grid')
|
||||
await expect(grid).toBeVisible()
|
||||
})
|
||||
|
||||
@@ -53,7 +53,7 @@ test.describe('Models (KBX Foundation)', () => {
|
||||
await page.waitForTimeout(300)
|
||||
|
||||
// Grid should update
|
||||
const grid = page.locator('.kbx-data-grid')
|
||||
const grid = page.locator('.ks-grid')
|
||||
await expect(grid).toBeVisible()
|
||||
})
|
||||
|
||||
@@ -62,7 +62,7 @@ test.describe('Models (KBX Foundation)', () => {
|
||||
await page.waitForTimeout(500)
|
||||
|
||||
// Click first model row
|
||||
const firstRow = page.locator('tbody tr').first()
|
||||
const firstRow = page.locator('.ag-row').first()
|
||||
await expect(firstRow).toBeVisible()
|
||||
await firstRow.click()
|
||||
|
||||
@@ -77,12 +77,10 @@ test.describe('Models (KBX Foundation)', () => {
|
||||
|
||||
test('should display model activation requirements', async ({ page }) => {
|
||||
// Navigate to detail
|
||||
await page.waitForTimeout(500)
|
||||
const firstRow = page.locator('tbody tr').first()
|
||||
if (await firstRow.isVisible()) {
|
||||
await firstRow.click()
|
||||
await page.waitForURL('**/models/*')
|
||||
}
|
||||
const firstRow = page.locator('.ag-row').first()
|
||||
await expect(firstRow).toBeVisible()
|
||||
await firstRow.click()
|
||||
await page.waitForURL('**/models/*')
|
||||
|
||||
// Check requirements section
|
||||
const requirementsSection = page.locator('.requirements-section')
|
||||
@@ -95,12 +93,10 @@ test.describe('Models (KBX Foundation)', () => {
|
||||
|
||||
test('should display model lifecycle phases', async ({ page }) => {
|
||||
// Navigate to detail
|
||||
await page.waitForTimeout(500)
|
||||
const firstRow = page.locator('tbody tr').first()
|
||||
if (await firstRow.isVisible()) {
|
||||
await firstRow.click()
|
||||
await page.waitForURL('**/models/*')
|
||||
}
|
||||
const firstRow = page.locator('.ag-row').first()
|
||||
await expect(firstRow).toBeVisible()
|
||||
await firstRow.click()
|
||||
await page.waitForURL('**/models/*')
|
||||
|
||||
// Check phase timeline
|
||||
const phaseTimeline = page.locator('.phase-timeline')
|
||||
@@ -113,12 +109,10 @@ test.describe('Models (KBX Foundation)', () => {
|
||||
|
||||
test('should display model configuration', async ({ page }) => {
|
||||
// Navigate to detail
|
||||
await page.waitForTimeout(500)
|
||||
const firstRow = page.locator('tbody tr').first()
|
||||
if (await firstRow.isVisible()) {
|
||||
await firstRow.click()
|
||||
await page.waitForURL('**/models/*')
|
||||
}
|
||||
const firstRow = page.locator('.ag-row').first()
|
||||
await expect(firstRow).toBeVisible()
|
||||
await firstRow.click()
|
||||
await page.waitForURL('**/models/*')
|
||||
|
||||
// Check config section
|
||||
const configSection = page.locator('.config-section')
|
||||
@@ -131,12 +125,10 @@ test.describe('Models (KBX Foundation)', () => {
|
||||
|
||||
test('should display validation history table', async ({ page }) => {
|
||||
// Navigate to detail
|
||||
await page.waitForTimeout(500)
|
||||
const firstRow = page.locator('tbody tr').first()
|
||||
if (await firstRow.isVisible()) {
|
||||
await firstRow.click()
|
||||
await page.waitForURL('**/models/*')
|
||||
}
|
||||
const firstRow = page.locator('.ag-row').first()
|
||||
await expect(firstRow).toBeVisible()
|
||||
await firstRow.click()
|
||||
await page.waitForURL('**/models/*')
|
||||
|
||||
// Check history table
|
||||
const historySection = page.locator('.history-section')
|
||||
|
||||
@@ -3,7 +3,7 @@ import { test, expect } from '@playwright/test'
|
||||
test.describe('Shadow Runs (KBX Foundation)', () => {
|
||||
test.beforeEach(async ({ page }) => {
|
||||
// Set up auth headers for development mode
|
||||
await page.goto('http://localhost:5173/model-ops/shadow-runs', {
|
||||
await page.goto('/model-ops/shadow-runs', {
|
||||
waitUntil: 'networkidle',
|
||||
})
|
||||
|
||||
@@ -17,11 +17,11 @@ test.describe('Shadow Runs (KBX Foundation)', () => {
|
||||
await expect(title).toContainText('Shadow Run Validation')
|
||||
|
||||
// Check if grid is present
|
||||
const grid = page.locator('.kbx-data-grid')
|
||||
const grid = page.locator('.ks-grid')
|
||||
await expect(grid).toBeVisible()
|
||||
|
||||
// Check if summary items exist
|
||||
const summaryItems = page.locator('[class*="summary"]')
|
||||
const summaryItems = page.locator('.ks-list-page__footer > span')
|
||||
await expect(summaryItems).toHaveCount(3)
|
||||
})
|
||||
|
||||
@@ -37,7 +37,7 @@ test.describe('Shadow Runs (KBX Foundation)', () => {
|
||||
await page.waitForTimeout(500)
|
||||
|
||||
// Check if grid is still visible
|
||||
const grid = page.locator('.kbx-data-grid')
|
||||
const grid = page.locator('.ks-grid')
|
||||
await expect(grid).toBeVisible()
|
||||
})
|
||||
|
||||
@@ -46,7 +46,7 @@ test.describe('Shadow Runs (KBX Foundation)', () => {
|
||||
await page.waitForTimeout(500)
|
||||
|
||||
// Find first row in grid
|
||||
const firstRow = page.locator('tbody tr').first()
|
||||
const firstRow = page.locator('.ag-row').first()
|
||||
await expect(firstRow).toBeVisible()
|
||||
|
||||
// Click row
|
||||
@@ -63,12 +63,10 @@ test.describe('Shadow Runs (KBX Foundation)', () => {
|
||||
|
||||
test('should display validation summary', async ({ page }) => {
|
||||
// Navigate to detail
|
||||
await page.waitForTimeout(500)
|
||||
const firstRow = page.locator('tbody tr').first()
|
||||
if (await firstRow.isVisible()) {
|
||||
await firstRow.click()
|
||||
await page.waitForURL('**/shadow-runs/*')
|
||||
}
|
||||
const firstRow = page.locator('.ag-row').first()
|
||||
await expect(firstRow).toBeVisible()
|
||||
await firstRow.click()
|
||||
await page.waitForURL('**/shadow-runs/*')
|
||||
|
||||
// Check validation section
|
||||
const validationSection = page.locator('.validation-summary')
|
||||
@@ -90,7 +88,7 @@ test.describe('Shadow Runs (KBX Foundation)', () => {
|
||||
await page.waitForTimeout(300)
|
||||
|
||||
// Verify search was triggered (mock API will respond)
|
||||
const grid = page.locator('.kbx-data-grid')
|
||||
const grid = page.locator('.ks-grid')
|
||||
await expect(grid).toBeVisible()
|
||||
})
|
||||
|
||||
|
||||
Reference in New Issue
Block a user