Skip to content

test: add dark mode coverage for UI components#297

Merged
Xhristin3 merged 1 commit into
XStreamRollz:mainfrom
MerlinTheWhiz:test/dark-mode-coverage
Jun 20, 2026
Merged

test: add dark mode coverage for UI components#297
Xhristin3 merged 1 commit into
XStreamRollz:mainfrom
MerlinTheWhiz:test/dark-mode-coverage

Conversation

@MerlinTheWhiz

Copy link
Copy Markdown
Contributor

Summary

Add systematic dark mode coverage verification for all UI components. Previously only one component (stream-status-badge.test.tsx) existed with no theme-switching tests. This PR adds a comprehensive test suite that renders every shadcn/ui component (50+) in both light and dark mode and asserts zero console.error calls, catching contrast issues, invisible text, and missing borders in dark mode before they reach users.

Changes:

  • Create app/lib/test-utils.tsx — reusable buildThemeTest() helper that generates light + dark test cases
  • Add global useIsMobile mock in app/jest.setup.ts (required by sidebar component tests)
  • Create app/components/ui/dark-mode-coverage.test.tsx — 134 test cases covering 50+ components in both themes
  • Mock next-themes and embla-carousel-react for test isolation

Related issues

Closes #233

Type of change

  • feat
  • fix
  • docs
  • chore
  • test
  • ci

Testing performed

All 182 tests pass (134 new + 48 existing):

cd app
npx jest --no-cache

Result: Test Suites: 12 passed, 12 total | Tests: 182 passed, 182 total

Screenshots (if applicable)

image

Checklist — author

  • I rebased onto origin/main and resolved conflicts.
  • I ran the quality gates locally: npm run lint, npm run build, npm test.
  • Title follows Conventional Commits and references the issue (see above).
  • I added/updated tests where applicable and they pass locally.
  • No new TypeScript errors or lint warnings introduced.
  • I updated documentation if the change affects public behavior.
  • Screenshots included for UI changes.

@Xhristin3 Xhristin3 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice work — clean test infrastructure with buildThemeTest() and broad coverage across the component library. Approving and merging.

@Xhristin3 Xhristin3 merged commit 0904d17 into XStreamRollz:main Jun 20, 2026
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

a11y: Add dark mode coverage verification for all UI components

2 participants