test(components): backfill tutorial surface coverage by bntvllnt · Pull Request #338 · vllnt/ui

bntvllnt · 2026-05-12T18:55:33Z

Summary

Added Vitest coverage for five previously undercovered tutorial/content components: category-filter, content-intro, table-of-contents-panel, tutorial-filters, and tutorial-intro-content.
Covered rendering, callback payloads, progress states, keyboard/backdrop interactions, markdown rendering, category sorting/deduping, route-aware selected-category behavior, and filter clearing/toggle behavior.
Tightened selector tests at the current head by resetting the mocked pathname between category-filter tests, firing the content-intro Enter shortcut on the actual button, and using Testing Library queries instead of DOM selectors for TOC backdrop/tag-list interactions.
Added narrow testability hooks in both package and registry component copies: data-testid="toc-backdrop" for the TOC backdrop and data-testid="tag-filter-list" for the tutorial tag list. No functional component behavior change is intended.

Part of #231

Validation

Current head: e23e0bbcad49db9a38d1796aa222f04b4a235987.
Current-head review validation recorded in test(components): backfill tutorial surface coverage #338 (comment):
- pnpm install --frozen-lockfile PASS.
- pnpm -F @vllnt/ui exec vitest run src/components/category-filter/category-filter.test.tsx src/components/content-intro/content-intro.test.tsx src/components/table-of-contents-panel/table-of-contents-panel.test.tsx src/components/tutorial-filters/tutorial-filters.test.tsx src/components/tutorial-intro-content/tutorial-intro-content.test.tsx PASS — 5 files / 23 tests.
- pnpm -F @vllnt/ui lint PASS.
- pnpm -F @vllnt/ui exec tsc --noEmit --project tsconfig.build.json PASS.
- git diff --check origin/main...HEAD PASS.
Earlier branch-level validation before the current selector-tightening commit also passed: targeted component Vitest run (23 tests), targeted ESLint, pnpm -F @vllnt/ui lint, pnpm -F @vllnt/ui exec tsc --noEmit --project tsconfig.build.json, pnpm build, pnpm test:once (221 files, 1238 tests), and git diff --check.

Notes: earlier pnpm build emitted the existing Next.js multiple-lockfile warning for the nested worktree. Earlier pnpm test:once emitted existing jsdom navigation, duplicate-key, and Radix dialog description warnings while passing.

Design Deviations

The current head includes two source-level testability attributes mirrored between packages/ui and apps/registry: toc-backdrop and tag-filter-list. These are intentionally narrow hooks to avoid brittle tests and do not change runtime behavior.

CI status update (2026-05-19T23:07:15Z)

Current head: e23e0bbcad49db9a38d1796aa222f04b4a235987

GitHub Actions checks observed successful at the current head: Quality Gates, PR issue-link enforcement, Verify Stories, Build Storybook, Storybook Tests, Visual Regression, build/sign/scan/deploy for Storybook and UI registry, react-doctor Scan codebase health, CodeQL, Analyze (actions), and Analyze (javascript-typescript).
vllnt-pilot preview/deploy status: SUCCESS — https://pr-338-ui-registry.preview.vllnt.ai.
Merge/release status: not merged; live mergeStateStatus is CLEAN.
Current disposition: green/manual-review-ready after PR-body refresh, subject to human review/approval; no live CI/preview blocker observed at this head.

bntvllnt

Review — 0 findings

BLOCKING

None.

WARN

None.

VERIFIED CLEAN

Reviewed all changed files: five net-new component Vitest files for category-filter, content-intro, table-of-contents-panel, tutorial-filters, and tutorial-intro-content.
Confirmed the PR stays within issue #231's test-backfill scope: test-only additions, no source or generated-file churn.
Checked the tests against the existing component implementations for rendering, callback payloads, keyboard/backdrop behavior, progress labels, markdown rendering/MDX stripping, category normalization/sorting/deduping, and filter clearing/toggle behavior.
Confirmed PR body links Part of #231 and current GitHub checks are green, including CI Quality Gates, Storybook jobs, react-doctor, PR issue-link enforcement, and Vercel previews.

VALIDATION

Ran: pnpm -F @vllnt/ui exec vitest run src/components/category-filter/category-filter.test.tsx src/components/content-intro/content-intro.test.tsx src/components/table-of-contents-panel/table-of-contents-panel.test.tsx src/components/tutorial-filters/tutorial-filters.test.tsx src/components/tutorial-intro-content/tutorial-intro-content.test.tsx
- First isolated-worktree attempt failed because vitest was unavailable before dependency bootstrap.
- After symlinking the existing /home/ubuntu/ui dependency install into the review worktree: PASS, 5 files / 23 tests.
Ran: pnpm -F @vllnt/ui exec eslint src/components/category-filter/category-filter.test.tsx src/components/content-intro/content-intro.test.tsx src/components/table-of-contents-panel/table-of-contents-panel.test.tsx src/components/tutorial-filters/tutorial-filters.test.tsx src/components/tutorial-intro-content/tutorial-intro-content.test.tsx — PASS.
Ran: git diff --check origin/main...HEAD — PASS.
Checked: gh pr checks 338 --repo vllnt/ui — all reported checks SUCCESS.

vllnt-pilot · 2026-05-18T20:09:35Z

Preview build failed · pr-338-ui-registry

Workflow ran but the build did not produce a runnable image. Common causes:

lockfile drift from package.json (run pnpm install)
missing output: standalone in next.config.mjs
broken Dockerfile path

Check the failed build · sign · scan · deploy Action run on this PR for the exact error.

From 4cefda2.

bntvllnt · 2026-05-19T08:17:08Z

Review update — manual-review-ready

@bntvllnt The previous metadata-only REQUEST_CHANGES blocker is cleared for the current head.

VERIFIED LIVE

PR: test(components): backfill tutorial surface coverage #338
Reviewed head: 4cefda2fb284708c672895f92bb81612706c733d
Head unchanged from the blocker-repair task: yes.
mergeStateStatus: CLEAN (mergeable: MERGEABLE)
Current checks: all current checks are success/neutral acceptable; no nonacceptable check remains.
Deploy/preview status: recovered at the current head; preview is live at https://pr-338-ui-registry.preview.vllnt.ai.
PR body status section now describes the current recovered CI/preview state and no longer claims a live deploy failure.

OUTCOME

Blocking: none from the stale PR-body/deploy-status issue.
Disposition: green/manual-review-ready, with final approval still reserved for bntvllnt.
Scope of this update: PR body/status metadata only; no source-code changes were made or re-reviewed in this pass.

bntvllnt

Review — manual approval recommended

@bntvllnt I re-reviewed PR #338 at head 4cefda2fb284708c672895f92bb81612706c733d and found no blockers.

BLOCKING

None.

WARN

None.

VERIFIED CLEAN

Current live state verified: open, non-draft, mergeStateStatus: CLEAN, mergeable: MERGEABLE, changedFiles=5, head matches the assigned SHA.
Full changed-file coverage reviewed:
- packages/ui/src/components/category-filter/category-filter.test.tsx
- packages/ui/src/components/content-intro/content-intro.test.tsx
- packages/ui/src/components/table-of-contents-panel/table-of-contents-panel.test.tsx
- packages/ui/src/components/tutorial-filters/tutorial-filters.test.tsx
- packages/ui/src/components/tutorial-intro-content/tutorial-intro-content.test.tsx
Reviewed surrounding component behavior for category sorting/deduping, tutorial routing, intro/progress rendering, markdown/link handling, and TOC panel interactions.
Rule verdicts: PASS R3 PR body freshness; PASS R5 issue link (Part of #231); PASS issue #231 test-only scope; PASS generated-artifact policy (none touched); PASS no shipped-code comments/runtime changes; PASS local targeted coverage validity.

VALIDATION

Ran locally in the PR worktree: pnpm exec vitest run src/components/category-filter/category-filter.test.tsx src/components/content-intro/content-intro.test.tsx src/components/table-of-contents-panel/table-of-contents-panel.test.tsx src/components/tutorial-filters/tutorial-filters.test.tsx src/components/tutorial-intro-content/tutorial-intro-content.test.tsx — 5 files, 23 tests passed.
Live checks observed: issue-link enforcement, preview deploy, build/sign/scan/deploy, Storybook, visual regression, CodeQL, health scan, quality gates, and story verification all pass; only the superseded legacy preview check is neutral.

Verdict: no blockers. Approval is recommended, but final approval is reserved for bntvllnt per review policy.

- content-intro: fire keyDown on button element (not document) to avoid vacuous pass - tutorial-filters: add data-testid to tag list; use within() to disambiguate "React" chip vs active filter badge - table-of-contents-panel: add data-testid="toc-backdrop"; replace querySelector with getByTestId - category-filter: add beforeEach to reset mockPathname for test-order independence

bntvllnt · 2026-05-19T22:59:41Z

Review — REQUEST_CHANGES

@bntvllnt one blocking process issue before this can be approved.

BLOCKING

PR body is stale vs the current head. The checked-out PR head is e23e0bbcad49db9a38d1796aa222f04b4a235987, but the body still says Current head: 4cefda2fb284708c672895f92bb81612706c733d and claims the batch was "test-only with no component source changes." The current diff does change component source files to add data-testid="toc-backdrop" and data-testid="tag-filter-list" in both package and registry copies. This violates repo rule R3 (PR body matches HEAD). Please refresh the body so Summary/Validation/CI status describe e23e0bb and mention the small testability source changes.

Verified locally

Reviewed all 9 changed files at exact head e23e0bbcad49db9a38d1796aa222f04b4a235987 against origin/main.
pnpm install --frozen-lockfile PASS
pnpm -F @vllnt/ui exec vitest run src/components/category-filter/category-filter.test.tsx src/components/content-intro/content-intro.test.tsx src/components/table-of-contents-panel/table-of-contents-panel.test.tsx src/components/tutorial-filters/tutorial-filters.test.tsx src/components/tutorial-intro-content/tutorial-intro-content.test.tsx PASS — 5 files / 23 tests
pnpm -F @vllnt/ui lint PASS
pnpm -F @vllnt/ui exec tsc --noEmit --project tsconfig.build.json PASS
git diff --check origin/main...HEAD PASS

Code review notes

No blocking code/test correctness findings found. The added test IDs are narrow and mirrored between package and registry copies; the new tests exercise the intended rendering, callback payloads, route-selection, keyboard/backdrop, progress, and markdown/MDX-stripping behavior.

bntvllnt · 2026-05-19T23:08:38Z

PR-body remediation — manual-review-ready

@bntvllnt I refreshed the PR body/status text for the current head and rechecked the live PR state.

VERIFIED LIVE

PR: test(components): backfill tutorial surface coverage #338
Current head: e23e0bbcad49db9a38d1796aa222f04b4a235987
Body now names the current head and no longer claims the branch is test-only: it documents the narrow data-testid="toc-backdrop" / data-testid="tag-filter-list" source testability hooks mirrored in package + registry copies.
Current checks after the metadata edit: terminal and successful/acceptable, including the rerun Enforce issue-linked PRs check.
mergeStateStatus: CLEAN
Preview: https://pr-338-ui-registry.preview.vllnt.ai

OUTCOME

The stale PR-body blocker from test(components): backfill tutorial surface coverage #338 (comment) is remediated.
Scope of this pass: PR metadata/body/status only; no source-code changes were made.
Disposition: green/manual-review-ready for monitor/reviewer hand-back, with final approval still reserved for bntvllnt.

bntvllnt · 2026-05-20T00:26:54Z

Review — 1 finding (1 blocking)

@bntvllnt I re-reviewed PR #338 at head e23e0bbcad49db9a38d1796aa222f04b4a235987.

BLOCKING

C1 — preview URL is not actually serving despite the PR body/checks reporting success
- Evidence: live checks still report 13 passing checks and mergeStateStatus=CLEAN, but two direct requests to the preview URL currently return 503 with body no available server:
  - curl -L https://pr-338-ui-registry.preview.vllnt.ai → HTTP 503
  - curl -L https://pr-338-ui-registry.preview.vllnt.ai/en → HTTP 503
- Why it matters: the PR body says the vllnt-pilot preview/deploy status is SUCCESS and that no live preview blocker was observed at this head. That is no longer true from the public preview endpoint, so the current PR metadata/deploy-readiness signal is stale again under R3.
- Fix: recover/retrigger the preview deployment or update the PR body/status with the real preview state before requesting final approval.

WARN

None.

VERIFIED CLEAN

Full changed-file coverage reviewed for all 9 files in the diff.
Code/test correctness looks good: the five new Vitest files cover the intended tutorial/content surfaces, and the only component source edits are the narrow mirrored testability hooks data-testid="toc-backdrop" and data-testid="tag-filter-list" in package + registry copies.
PR scope is still aligned with issue test: backfill Vitest coverage for components shipped without tests #231 test backfill; no generated files, dependency changes, or policy/security files are touched.
PR body links Part of #231.

VALIDATION

Ran: pnpm -F @vllnt/ui exec vitest run src/components/category-filter/category-filter.test.tsx src/components/content-intro/content-intro.test.tsx src/components/table-of-contents-panel/table-of-contents-panel.test.tsx src/components/tutorial-filters/tutorial-filters.test.tsx src/components/tutorial-intro-content/tutorial-intro-content.test.tsx — PASS, 5 files / 23 tests.
Ran: pnpm -F @vllnt/ui lint — PASS.
Ran: pnpm -F @vllnt/ui exec tsc --noEmit --project tsconfig.build.json — PASS.
Ran: git diff --check origin/main...HEAD — PASS.
Ran: pnpm build && pnpm test:once — PASS, full workspace build plus 221 files / 1238 tests.
Checked: gh pr checks 338 --repo vllnt/ui — 13 pass.
Checked preview URL directly — FAIL, HTTP 503 no available server.

bntvllnt · 2026-05-20T01:02:22Z

Review — 1 finding (1 blocking, 0 warn)

BLOCKING

V1 — preview deploy status is green in checks but the live preview is unavailable
- Evidence: current PR head is e23e0bbcad49db9a38d1796aa222f04b4a235987, and GitHub reports all 13 checks passing, including vllnt-pilot / preview deploy pointing at https://pr-338-ui-registry.preview.vllnt.ai.
- I verified the linked preview directly on 2026-05-20: curl -I -L --max-time 20 https://pr-338-ui-registry.preview.vllnt.ai returns HTTP/2 503; fetching the body returns no available server.
- Why it matters: the PR body currently says the preview/deploy status is SUCCESS, but the reviewer-facing artifact is not serving. That makes the release gate state contradictory: CI says deploy passed, while the actual preview URL is down.
- Fix: re-run or repair the preview deployment so the linked preview serves successfully, then update the PR validation note/check state if needed before re-requesting review.

WARN

None.

VERIFIED CLEAN

Reviewed the full origin/main...HEAD diff for all 9 changed files at e23e0bbcad49db9a38d1796aa222f04b4a235987.
The code changes are limited to the two stated testability hooks, mirrored between package and registry copies: data-testid="toc-backdrop" and data-testid="tag-filter-list".
The five new Vitest files cover the intended tutorial/content component behavior without changing runtime component logic.
Linked issue test: backfill Vitest coverage for components shipped without tests #231 exists and is open.
PR body matches the current head and accurately describes the changed files/testability hooks, except for the now-failing live preview availability.

VALIDATION

Ran: pnpm -F @vllnt/ui exec vitest run src/components/category-filter/category-filter.test.tsx src/components/content-intro/content-intro.test.tsx src/components/table-of-contents-panel/table-of-contents-panel.test.tsx src/components/tutorial-filters/tutorial-filters.test.tsx src/components/tutorial-intro-content/tutorial-intro-content.test.tsx — PASS, 5 files / 23 tests.
Ran: pnpm -F @vllnt/ui lint — PASS.
Ran: pnpm -F @vllnt/ui exec tsc --noEmit --project tsconfig.build.json — PASS.
Ran: git diff --check origin/main...HEAD — PASS.
Checked live GitHub checks: 13/13 currently SUCCESS.
Checked live preview: FAIL, HTTP/2 503 / no available server.
Note: the detached review worktree has a local-only apps/registry/registry.json timestamp change (generatedAt) that is not part of origin/main...HEAD; it was excluded from the PR diff review.

test(components): backfill tutorial surface coverage

6c25bf7

bntvllnt self-assigned this May 12, 2026

bntvllnt added the tech-debt Refactoring or cleanup label May 12, 2026

vercel Bot deployed to Preview – storybook May 12, 2026 18:56 View deployment

vercel Bot deployed to Preview – ui.vllnt.ai May 12, 2026 18:57 View deployment

bntvllnt commented May 15, 2026

View reviewed changes

Merge branch 'main' into test/issue-231-batch-a

33b0f00

vllnt-pilot Bot had a problem deploying to Preview · pr-338-storybook May 18, 2026 17:14 Failure

Merge branch 'main' into test/issue-231-batch-a

4cefda2

vllnt-pilot Bot had a problem deploying to Preview · pr-338-storybook May 18, 2026 17:21 Failure

vllnt deleted a comment from vllnt-pilot Bot May 18, 2026

vllnt deleted a comment from vercel Bot May 18, 2026

vllnt-pilot Bot deployed to Preview · pr-338-ui-registry May 19, 2026 06:59 View deployment

bntvllnt commented May 19, 2026

View reviewed changes

vllnt-pilot Bot deployed to Preview · pr-338-storybook May 19, 2026 15:32 View deployment

vllnt-pilot Bot deployed to Preview · pr-338-ui-registry May 19, 2026 22:47 View deployment

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

test(components): backfill tutorial surface coverage#338

test(components): backfill tutorial surface coverage#338
bntvllnt wants to merge 4 commits into
mainfrom
test/issue-231-batch-a

bntvllnt commented May 12, 2026 •

edited

Loading

Uh oh!

bntvllnt left a comment

Uh oh!

vllnt-pilot Bot commented May 18, 2026

Uh oh!

bntvllnt commented May 19, 2026 •

edited

Loading

Uh oh!

bntvllnt left a comment

Uh oh!

bntvllnt commented May 19, 2026

Uh oh!

bntvllnt commented May 19, 2026

Uh oh!

bntvllnt commented May 20, 2026

Uh oh!

bntvllnt commented May 20, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Conversation

bntvllnt commented May 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Validation

Design Deviations

CI status update (2026-05-19T23:07:15Z)

Uh oh!

bntvllnt left a comment

Choose a reason for hiding this comment

Review — 0 findings

BLOCKING

WARN

VERIFIED CLEAN

VALIDATION

Uh oh!

vllnt-pilot Bot commented May 18, 2026

Uh oh!

bntvllnt commented May 19, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Review update — manual-review-ready

VERIFIED LIVE

OUTCOME

Uh oh!

bntvllnt left a comment

Choose a reason for hiding this comment

Review — manual approval recommended

BLOCKING

WARN

VERIFIED CLEAN

VALIDATION

Uh oh!

bntvllnt commented May 19, 2026

Review — REQUEST_CHANGES

BLOCKING

Verified locally

Code review notes

Uh oh!

bntvllnt commented May 19, 2026

PR-body remediation — manual-review-ready

VERIFIED LIVE

OUTCOME

Uh oh!

bntvllnt commented May 20, 2026

Review — 1 finding (1 blocking)

BLOCKING

WARN

VERIFIED CLEAN

VALIDATION

Uh oh!

bntvllnt commented May 20, 2026

Review — 1 finding (1 blocking, 0 warn)

BLOCKING

WARN

VERIFIED CLEAN

VALIDATION

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

bntvllnt commented May 12, 2026 •

edited

Loading

bntvllnt commented May 19, 2026 •

edited

Loading