ci: add detailed failing audits and HTML reports to Lighthouse CI

[rlespinasse]

Summary

• Extract failing audits per category into PR comments using collapsible <details> blocks, so authors see exactly which audits need attention
• Upload full HTML Lighthouse reports as build artifacts (14-day retention) for deep inspection
• Link to artifacts from the PR comment template

Test plan

• Verify Lighthouse workflow runs and produces both JSON and HTML outputs
• Check PR comment includes failing audit details in collapsible sections
• Confirm HTML reports are downloadable from the workflow artifacts

🤖 Generated with Claude Code

[github-actions]

Preview Build

✅ Build completed successfully!

Download Preview

The built site is available as an artifact: preview-site-83

To preview locally:

1. Download the artifact from the Actions tab
2. Unzip the archive
3. Open index.html in your browser

Or run a simple HTTP server:

python3 -m http.server 8000

Then visit http://localhost:8000

[github-actions]

Lighthouse Performance Report

⚠️ NEEDS IMPROVEMENT

Audit Results

• /: Performance 73, Accessibility 100, Best Practices 73, SEO 100

  Failing audits

  • performance:
    • Largest Contentful Paint (0)
    • Speed Index (83)
    • Use efficient cache lifetimes (0)
    • Document request latency (50)
    • Font display (0)
    • Improve image delivery (0)
    • LCP breakdown (0)
    • Network dependency tree (0)
    • Minify JavaScript (50)
    • Avoid enormous network payloads (50)
    • Minimize main-thread work (50)
    • Image elements do not have explicit width and height (50)
  • best-practices:
    • Does not use HTTPS (0)
    • Browser errors were logged to the console (0)
    • Issues were logged in the Issues panel in Chrome Devtools (0)

• /about/: Performance 88, Accessibility 100, Best Practices 73, SEO 100

  Failing audits

  • performance:
    • First Contentful Paint (55)
    • Largest Contentful Paint (82)
    • Speed Index (73)
    • Use efficient cache lifetimes (50)
    • Document request latency (50)
    • Improve image delivery (50)
    • LCP breakdown (0)
    • Network dependency tree (0)
    • Render blocking requests (0)
    • Avoid enormous network payloads (50)
    • Minimize main-thread work (50)
    • Image elements do not have explicit width and height (50)
  • best-practices:
    • Does not use HTTPS (0)
    • Browser errors were logged to the console (0)
    • Issues were logged in the Issues panel in Chrome Devtools (0)

• /chuck/: Performance 96, Accessibility 100, Best Practices 73, SEO 100

  Failing audits

  • best-practices:
    • Does not use HTTPS (0)
    • Browser errors were logged to the console (0)
    • Issues were logged in the Issues panel in Chrome Devtools (0)

• /generate/: Performance 100, Accessibility 96, Best Practices 73, SEO 66

  Failing audits

  • best-practices:
    • Does not use HTTPS (0)
    • Browser errors were logged to the console (0)
    • Issues were logged in the Issues panel in Chrome Devtools (0)
  • seo:
    • Page is blocked from indexing (0)

• /karaoke/: Performance 100, Accessibility 96, Best Practices 73, SEO 66

  Failing audits

  • best-practices:
    • Does not use HTTPS (0)
    • Browser errors were logged to the console (0)
    • Issues were logged in the Issues panel in Chrome Devtools (0)
  • seo:
    • Page is blocked from indexing (0)

All categories must score 90 or higher.

Full HTML reports are available as build artifacts.

[github-actions]

Preview Build

✅ Build completed successfully!

Download Preview

The built site is available as an artifact: preview-site-83

To preview locally:

1. Download the artifact from the Actions tab
2. Unzip the archive
3. Open index.html in your browser

Or run a simple HTTP server:

python3 -m http.server 8000

Then visit http://localhost:8000

[github-actions]

Preview Build

✅ Build completed successfully!

Download Preview

The built site is available as an artifact: preview-site-83

To preview locally:

1. Download the artifact from the Actions tab
2. Unzip the archive
3. Open index.html in your browser

Or run a simple HTTP server:

python3 -m http.server 8000

Then visit http://localhost:8000