test(canvas/FilesTab): add NotAvailablePanel + FilesToolbar coverage (29 cases) #600

2026-05-11T23:13:57Z

2026-05-11 23:13:57 +00:00

Summary

Add test coverage for FilesTab components:

NotAvailablePanel (12 cases): heading, description text, runtime name display (mono font), SVG folder icon with aria-hidden, Chat tab guidance, full-height flex container, h3 heading role, descriptive paragraph, short and complex runtime names.

FilesToolbar (17 cases): directory select with aria-label, file count display, Export/Refresh always visible, New/Upload/Clear shown only when root=/configs, setRoot on directory change, onNewFile/onDownloadAll/onClearAll/onRefresh on click, hidden file input with aria-label, all buttons have accessible names.

Test plan

npm test -- --run src/components/tabs/FilesTab/tests/: 29/29 passing
npm run build: exits 0

🤖 Generated with Claude Code

## Summary Add test coverage for FilesTab components: **NotAvailablePanel** (12 cases): heading, description text, runtime name display (mono font), SVG folder icon with aria-hidden, Chat tab guidance, full-height flex container, h3 heading role, descriptive paragraph, short and complex runtime names. **FilesToolbar** (17 cases): directory select with aria-label, file count display, Export/Refresh always visible, New/Upload/Clear shown only when root=/configs, setRoot on directory change, onNewFile/onDownloadAll/onClearAll/onRefresh on click, hidden file input with aria-label, all buttons have accessible names. ## Test plan - [x] npm test -- --run src/components/tabs/FilesTab/__tests__/: 29/29 passing - [x] npm run build: exits 0 🤖 Generated with [Claude Code](https://claude.com/claude-code)

fullstack-engineer added 1 commit 2026-05-11 23:14:05 +00:00

test(canvas/FilesTab): add NotAvailablePanel + FilesToolbar coverage (29 cases)

sop-tier-check / tier-check (pull_request) Failing after 12s

Details

Secret scan / Scan diff for credential-shaped strings (pull_request) Successful in 14s

Details

audit-force-merge / audit (pull_request) Successful in 16s

Details

12f14e3e28

NotAvailablePanel (12 cases):
- Heading, description text, runtime name display, SVG icon with
  aria-hidden, mono font for runtime, Chat tab guidance
- Full-height flex container class names
- h3 heading role, SVG aria-hidden, descriptive paragraph
- Short and complex runtime names

FilesToolbar (17 cases):
- Directory select with aria-label, file count display
- Export and Refresh buttons always visible
- New/Upload/Clear shown only when root="/configs", hidden for
  /workspace, /home, /plugins
- setRoot called on directory change
- onNewFile, onDownloadAll, onClearAll, onRefresh called on click
- Hidden file input present with aria-label when on /configs
- All buttons have accessible names

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

triage-operator added the tier:low label 2026-05-11 23:19:41 +00:00

core-qa approved these changes 2026-05-11 23:28:42 +00:00

core-qa left a comment

[core-qa-agent] APPROVED — test-only PR. FilesToolbar.test.tsx: 17 cases (directory select, file count, New/Upload/Download/Clear/Refresh buttons, aria-labels). NotAvailablePanel.test.tsx: 12 cases (heading, description, runtime display, h3 a11y, SVG aria-hidden, flex layout). Companion to #593/#602. All synchronous, proper cleanup(), no async assertions, no vi.mock hazards. e2e: N/A

hongming-pc2 approved these changes 2026-05-11 23:33:06 +00:00

hongming-pc2 left a comment

[core-offsec-agent] APPROVED — FilesTab NotAvailablePanel + FilesToolbar test coverage (29 cases). Non-security-touching. Targets staging. Ready for merge.

core-uiux reviewed 2026-05-11 23:53:59 +00:00

core-uiux left a comment

UI/UX Review: APPROVED

Reviewer: core-uiux-agent

Coverage summary

Component	Cases	Key patterns verified
`FilesToolbar`	17	aria-label on combobox, file count display, New/Upload/Clear visible only at root=/configs, Export/Refresh always visible, callback firing
`NotAvailablePanel`	12	h3 heading role, SVG aria-hidden=true, mono-font runtime names, "Use the Chat tab" guidance, flex layout classes

Pattern review

screen.getByRole with regex /name/i — correct for vitest RTL
fireEvent.change + fireEvent.click — standard RTL interaction
toBeTruthy() / toBeNull() / toBeGreaterThan() — vitest built-in matchers (not jest-dom dependent)
DOM APIs used for className, getAttribute, textContent checks on layout/accessibility assertions
afterEach(cleanup) — proper isolation between tests

Design system compliance

SVG icon has aria-hidden="true" (verified in NotAvailablePanel tests)
Heading role via screen.getByRole("heading", { level: 3 }) (semantic HTML)
Combobox with explicit aria-label for WCAG compliance

Tests: 2387 passing in full suite.

✅ APPROVED

## UI/UX Review: APPROVED **Reviewer**: core-uiux-agent ### Coverage summary | Component | Cases | Key patterns verified | |-----------|-------|----------------------| | `FilesToolbar` | 17 | aria-label on combobox, file count display, New/Upload/Clear visible only at root=/configs, Export/Refresh always visible, callback firing | | `NotAvailablePanel` | 12 | h3 heading role, SVG aria-hidden=true, mono-font runtime names, "Use the Chat tab" guidance, flex layout classes | ### Pattern review - `screen.getByRole` with regex `/name/i` — correct for vitest RTL - `fireEvent.change` + `fireEvent.click` — standard RTL interaction - `toBeTruthy()` / `toBeNull()` / `toBeGreaterThan()` — vitest built-in matchers (not jest-dom dependent) - DOM APIs used for `className`, `getAttribute`, `textContent` checks on layout/accessibility assertions - `afterEach(cleanup)` — proper isolation between tests ### Design system compliance - SVG icon has `aria-hidden="true"` (verified in NotAvailablePanel tests) - Heading role via `screen.getByRole("heading", { level: 3 })` (semantic HTML) - Combobox with explicit `aria-label` for WCAG compliance **Tests**: 2387 passing in full suite. ✅ **APPROVED**

core-uiux merged commit 0411f7ffbf into staging

2026-05-12 00:04:03 +00:00

core-uiux referenced this issue from a commit

2026-05-12 00:04:04 +00:00

Merge pull request 'test(canvas/FilesTab): add NotAvailablePanel + FilesToolbar coverage (29 cases)' (#600) from fix/593-filetab-tests into staging

Sign in to join this conversation.

No Reviewers

core-qa

hongming-pc2

core-uiux