Skip to content

feat: add --hide-branding flag for clean HTML reports#112

Open
Ticass wants to merge 9 commits intomillionco:mainfrom
Ticass:main
Open

feat: add --hide-branding flag for clean HTML reports#112
Ticass wants to merge 9 commits intomillionco:mainfrom
Ticass:main

Conversation

@Ticass
Copy link
Copy Markdown

@Ticass Ticass commented Mar 27, 2026

Summary

When using React Doctor in GitHub Actions to post PR comments, the ASCII branding (doctor face, score bar, framed boxes) doesn't render well in Markdown. Characters get mangled, the report looks cluttered, and the collapsible diagnostics list is buried in a temp directory instead of being inline.

This PR adds a --hide-branding flag that replaces the ASCII output with a clean HTML report designed for GitHub PR comments:

  • Score with color-coded emoji (🟢🟡🔴) instead of ASCII art
  • Error/warning counts in a summary line
  • Full diagnostics table inside a collapsible <details> section — all issues visible in one place
  • No "Full diagnostics written to /tmp/..." — everything is inline

Example output

🟢 Score: 89 / 100 — Great

🚨 5 errors · ⚠️ 14 warnings

📋 View details
Rule Message Location
🚨react/jsx-keyMissing "key" prop for element in iterator.src/components/MissingKeys.jsx:27
🚨react-hooks/rules-of-hooksReact Hook "useState" is called conditionally.src/components/ConditionalHooks.jsx:9
⚠️react-doctor/no-array-index-as-keyArray index used as key — causes bugs when list is reorderedsrc/components/MissingKeys.jsx:36

Changes

  • src/types.ts — Added noBranding to ScanOptions
  • src/scan.ts — Added noBranding to ResolvedScanOptions, refactored mergeScanOptions to use a defaults + spread pattern, printSummary early-returns with HTML when flag is set, branding calls guarded in zero-diagnostics path
  • src/cli.ts — Wired --hide-branding CLI flag through to ScanOptions.noBranding
  • src/utils/no-branding-diagnostics.ts — New file: builds the HTML report from diagnostics and score, uses data-driven score tiers instead of if/else chains
  • packages/react-doctor/README.md — Documented the new flag in CLI options and API usage
  • tests/no-branding-diagnostics.test.ts — 15 test cases covering score tiers, boundary values, counts, pluralization, HTML structure, and absence of markdown syntax in HTML output

Usage

CLI:

npx react-doctor@latest . --hide-branding

@vercel
Copy link
Copy Markdown

vercel bot commented Mar 27, 2026

Someone is attempting to deploy a commit to the Million Team on Vercel.

A member of the Team first needs to authorize it.

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.

1 participant