🔍 Multi-Device Docs Testing Report - 2026-03-19

[github-actions]

Test Summary

• Triggered by: @pelikhan
• Workflow run: §23277062477
• Devices tested: 10 (4 mobile, 3 tablet, 3 desktop)
• Test date: 2026-03-19
• Method: Programmatic HTML/CSS analysis (Playwright browser could not reach agent container network)

Results Overview

• 🟢 Passed: 44+ pages — all return HTTP 200
• 🟡 Warnings: 3 minor issues
• 🔴 Critical: 0

Warning: No-Trailing-Slash 404 on Base Path

GET /gh-aw (without trailing slash) returns HTTP 404 rather than redirecting to /gh-aw/. All other content pages correctly handle both variants (e.g., /gh-aw/introduction/overview returns 200). Only the base path /gh-aw is affected. This is a dev-server behavior but may also affect production if a CDN/web server doesn't add the trailing slash before routing.

Additionally, the 404 page served for this URL has a doubled base path in its canonical URL:

(link rel="canonical" href="https://github.github.com/gh-aw/gh-aw/")

instead of the expected https://github.github.com/gh-aw/.

View All Warnings

⚠️ Warning 1: Base path without trailing slash returns 404

• URL: `(localhost/redacted) (no trailing slash)
• Expected: 301 redirect to /gh-aw/ or 200
• Actual: 404 with corrupted canonical https://github.github.com/gh-aw/gh-aw/ (doubled segment)
• Impact: Users navigating directly to the base URL without a trailing slash hit a 404; also affects SEO if indexed with the wrong canonical.
• Note: All other pages (/gh-aw/introduction/overview, etc.) correctly handle no-trailing-slash variants.

⚠️ Warning 2: Copy-to-clipboard buttons lack aria-label

Code block copy buttons use the title attribute for accessibility:

(button title="Copy to clipboard" data-copied="Copied!" data-code="...")

The title attribute is technically accessible but inconsistently announced by screen readers (especially on mobile/touch). WCAG 2.1 SC 4.1.2 recommends using aria-label for interactive controls.

⚠️ Warning 3: Mermaid diagrams require JavaScript

The architecture page (/gh-aw/introduction/architecture/) contains 5 Mermaid diagrams rendered client-side via JavaScript. The HTML source only includes the raw Mermaid syntax inside <pre class="mermaid"> elements with no static fallback SVG or text description. Users with JavaScript disabled will see raw diagram source code.

View Detailed Test Results by Device

Testing Methodology

Network isolation prevented Playwright browser rendering tests (the Playwright MCP container runs with --network host on the Docker host, while the agent container is on a bridge network at 172.30.0.20 — not reachable from the Playwright browser). Testing was performed via programmatic curl-based HTML/CSS analysis.

Mobile Devices (390×844 – 428×926)

Device	Viewport	Status
iPhone 12	390×844	🟢 Responsive CSS present
iPhone 12 Pro Max	428×926	🟢 Responsive CSS present
Pixel 5	393×851	🟢 Responsive CSS present
Galaxy S21	360×800	🟢 Responsive CSS present

Mobile-specific CSS verified:

• @media (max-width: 768px): sidebar nav items with min-height: 44px touch targets ✅
• @media (max-width: 640px): tables switch to block/card layout with overflow-x: auto ✅
• Mobile menu toggle: aria-label="Menu", aria-expanded ✅
• overflow-wrap: break-word on all text content ✅

Tablet Devices (768×1024 – 1024×1366)

Device	Viewport	Status
iPad	768×1024	🟢 Breakpoint boundary
iPad Pro 11	834×1194	🟢 Desktop layout range
iPad Pro 12.9	1024×1366	🟢 Desktop layout range

Tablet breakpoints: The @media (min-width: 769px) breakpoint applies from iPad landscape upward, switching to sidebar-visible layout. iPad portrait (768px) is at the mobile/tablet boundary.

Desktop Devices (1366×768 – 2560×1440)

Device	Viewport	Status
HD (1366×768)	1366×768	🟢 Full layout
FHD (1920×1080)	1920×1080	🟢 Full layout
4K (2560×1440)	2560×1440	🟢 Full layout

Page Coverage (44 pages tested — all HTTP 200)

All pages from the full sidebar navigation returned HTTP 200, including:

• /gh-aw/ homepage
• All 6 blog posts
• Introduction, setup, guides, patterns, reference, troubleshooting, examples sections

Accessibility Findings

Passing:

• ✅ (html lang="en" dir="ltr") on all pages
• ✅ Skip-to-content link present on all pages
• ✅ All images have alt text (0 missing)
• ✅ Search button: aria-label="Search" + keyboard shortcut aria-keyshortcuts="Control+K"
• ✅ Mobile menu: aria-label="Menu", aria-expanded="false", aria-controls
• ✅ Correct heading hierarchy (h1 → h2 → h3)
• ✅ Font preloading for performance (MonaSans Regular + Bold)
• ✅ OG + Twitter Card meta tags on all pages
• ✅ Tables have responsive CSS (overflow-x: auto, card layout on mobile)

Minor concern:

• 🟡 Copy buttons use title instead of aria-label (Starlight upstream default)
• 🟡 Mermaid diagrams lack fallback content for no-JS environments

Recommendations

1. Add a trailing-slash redirect for the base path: Add /gh-aw → /gh-aw/ to the redirects map in astro.config.mjs:

   redirects: {
     '/': '/gh-aw/',   // or ensure the hosting layer redirects /gh-aw → /gh-aw/
     // ...existing redirects
   }

2. Copy button aria-label: Consider overriding Starlight's <Code> component to add aria-label="Copy to clipboard" on copy buttons (low priority — title is functional but inconsistent on mobile screen readers).

3. Mermaid fallback: Add descriptive (figcaption) or aria-label text to Mermaid diagram wrappers so screen reader users and no-JS visitors get context.

References:

• §23277062477

Generated by Multi-Device Docs Tester · ◷

• expires on Mar 21, 2026, 2:44 AM UTC

[github-actions]

🍪 Issue Monster has assigned this to Copilot!

I've identified this issue as a good candidate for automated resolution and assigned it to the Copilot coding agent.

The Copilot coding agent will analyze the issue and create a pull request with the fix.

Om nom nom! 🍪

Note

🔒 Integrity filtering filtered 4 items

Integrity filtering activated and filtered the following items during workflow execution.
This happens when a tool call accesses a resource that does not meet the required integrity or secrecy level of the workflow.

• issue:🔍 Multi-Device Docs Testing Report - 2026-03-20 #21896 (issue_read: Resource 'issue:🔍 Multi-Device Docs Testing Report - 2026-03-20 #21896' has lower integrity than agent requires. Agent would need to drop integrity tags [unapproved:all approved:all] to trust this resource.)
• issue:[cli-consistency] CLI Consistency Issues - 2026-03-18 #21599 (issue_read: Resource 'issue:[cli-consistency] CLI Consistency Issues - 2026-03-18 #21599' has lower integrity than agent requires. Agent would need to drop integrity tags [unapproved:all approved:all] to trust this resource.)
• issue:🔍 Multi-Device Docs Testing Report - 2026-03-19 #21714 (issue_read: Resource 'issue:🔍 Multi-Device Docs Testing Report - 2026-03-19 #21714' has lower integrity than agent requires. Agent would need to drop integrity tags [unapproved:all approved:all] to trust this resource.)
• issue:[refactor] Semantic Function Clustering Analysis: Persistent Outliers and New Findings #21830 (issue_read: Resource 'issue:[refactor] Semantic Function Clustering Analysis: Persistent Outliers and New Findings #21830' has lower integrity than agent requires. Agent would need to drop integrity tags [unapproved:all approved:all] to trust this resource.)

🍪 Om nom nom by Issue Monster · ◷