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:
2026-08-14 10:35:15 +09:00
parent 3f293d8aa8
commit 31b36ba226
29 changed files with 669 additions and 59 deletions
@@ -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()
})
+20
View File
@@ -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)
})
+22 -30
View File
@@ -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')
+10 -12
View File
@@ -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()
})