# fn-11.1 Implement: Setup React component testing infrastructure

## Description

Build the first real interaction-level web UI test stack for GNO.

Use the existing Bun-first test culture as the baseline. Do not migrate the repo to Jest or Vitest. The right outcome is that another agent can add interactive UI tests by copying a clear working pattern.

Implementation plan:

1. Add and configure the DOM testing stack:

- `@testing-library/react`
- `@testing-library/user-event`
- one DOM environment (`happy-dom` or `jsdom`)
- shared setup/bootstrap helpers for Bun tests

2. Add high-signal interaction tests for:

- `TagInput`
- `TagFacets`
- one keyboard/focus-heavy component (`CaptureModal`, `QuickSwitcher`, or equivalent)

3. Add page/surface interaction tests for:

- `Search`
- `DocView` or `DocumentEditor`
- one capture/create flow surface

4. Add a first accessibility layer:

- assert roles/labels/keyboard semantics on the newly DOM-tested surfaces

5. Add a minimal browser smoke flow using Playwright:

- keep it to one end-to-end happy path
- prove the wiring, do not try to solve all UI coverage here

Be explicit in the implementation about what stays as static-render tests and what graduates to DOM tests.

## Acceptance

- [ ] Interactive React tests run under `bun test` with a configured DOM environment.
- [ ] Shared setup/helpers exist so future DOM tests follow one clear pattern.
- [ ] `TagInput` has interaction coverage.
- [ ] `TagFacets` has interaction coverage.
- [ ] At least one keyboard/focus-heavy component has DOM interaction coverage.
- [ ] `Search` has page-level interaction coverage.
- [ ] `DocView` or `DocumentEditor` has page-level interaction coverage.
- [ ] A first accessibility assertion layer exists for the new DOM-tested surfaces.
- [ ] One Playwright/browser smoke flow is runnable locally/repo-locally.
- [ ] Docs or test notes explain how to run the new layers.

## Done summary

Implemented Bun-first React interaction testing for the web UI.

Shipped:

- `happy-dom` preload wired into `bun test` via `bunfig.toml`
- shared DOM helpers in `test/helpers/dom.tsx`
- DOM interaction + accessibility coverage for `TagInput`, `TagFacets`, `CaptureModal`, `Search`, and `DocView`
- repo-local Playwright smoke path in `scripts/web-ui-smoke.ts`
- run scripts/docs updates in `package.json`, `docs/WEB-UI.md`, and `test/CLAUDE.md`
- strictness fixes in `FrontmatterDisplay`, `DocView`, and `Search` so full gate passes

## Evidence

- Commits:
- Tests: bun run lint:check, bun run typecheck, bun test, bun run test:e2e, cd website && make sync-docs
- PRs:
