{ "url": "https://open.spotify.com", "auditedAt": "2026-07-18T04:14:13.188Z", "mode": "report", "status": "completed", "statusDetail": "Atomic coverage complete across 58 checks and four representative public templates plus login and error recovery states.", "page": { "appType": "spa", "framework": "React", "notes": "Anonymous Spotify web player. Consent state is injected on first load. No local source was supplied." }, "evidenceUsed": [ "screenshot", "video", "dom", "layout-metrics", "evaluate-probe", "trace", "har", "discoverability", "headers", "cookies", "trackers", "secrets", "images", "heap-summary", "Lighthouse", "curl robots/sitemap/manifest", "Modern Web Guidance 0.0.172" ], "guidanceConsulted": [ "accessibility", "accessible-error-announcement", "adapt-scrollbar-to-contrast-preferences", "agentic-forms", "agentic-javascript-tools", "anchor-positioning-tab-underline", "animate-element-entry-exit", "animate-to-from-top-layer", "animate-to-intrinsic-sizes", "animated-select-picker", "apply-webgl-shaders", "autofill-address-form", "autofill-highlight-inputs", "autofill-payment-form", "autofill-sign-in-form", "autofill-sign-up-form", "batch-analytics-events", "brand-consistent-forms", "branded-select-styling", "break-up-long-tasks", "calculate-event-differentials", "calculate-total-foreground-time", "calculate-with-intrinsic-sizes", "capture-location-agnostic-data", "carousel-slide-effects", "carousel-snap-highlights", "child-state-based-styling", "complex-shapes", "component-specific-light-dark-theme", "conditional-async-dependencies", "consistent-cross-document-transitions", "content-based-styling", "coordinate-global-events", "cross-document-transitions", "css", "css-layout", "custom-select-picker-layouts", "customize-scrollbar-color-and-thickness", "dark-mode", "declarative-button-actions", "declarative-dialog-popover-control", "defer-rendering-heavy-content", "defer-work-until-scroll-ends", "deliver-optimized-decorative-images", "deprioritize-background-fetches", "design-token-reactivity", "detect-initial-visibility-state", "directional-navigation-transitions", "dynamic-sibling-animations", "dynamic-sibling-styling", "efficient-background-processing", "export-html-media-from-canvas", "expose-canvas-content-to-browser-features", "faster-spa-view-transitions", "flicker-free-client-side-ab-testing", "fluid-scaling", "form-fields-automatically-fit-contents", "format-human-readable-durations", "forms", "full-session-analytics", "group-element-transitions", "highlight-text-ranges", "html", "identify-heavy-scripts", "identify-inp-causes", "improve-next-page-load-performance", "improve-text-layout-and-legibility", "individual-transform-properties", "interactions-in-complex-layouts", "interactive-content-in-3d-scenes", "interactive-content-reveal", "interest-triggered-action-previews", "interest-triggered-tooltips", "language-detection", "language-model", "light-dismiss-a-dialog", "manage-recurring-intervals", "model-partial-time-concepts", "move-dom-element-without-losing-state", "navigation-drawer", "optimize-image-priority", "optimize-preload-priority", "optimize-script-priority", "overflow-clipping-control", "parallax-scroll-effects", "passkey-authentication", "passkey-conditional-create", "passkey-management", "passkey-reauthentication", "passkey-registration", "passkeys", "performance", "persistent-app-tours", "persistent-toast-notifications", "persistent-top-layer-ui", "physics-based-easing", "platform-controls-dismiss-dialog", "position-aware-tooltips", "precise-text-alignment", "prevent-text-wrapping", "privacy", "pull-to-reveal", "reduce-style-repetition", "required-field-feedback", "resilient-context-menus-and-nested-dropdowns", "resolution-optimized-pseudo-elements", "rich-media-picker", "same-document-transitions", "schedule-tasks-by-priority", "scroll-entry-exit-effects", "scroll-position-aware-elements", "scroll-progress-indicator", "scroll-snap-realtime-feedback", "scroll-snap-state-sync", "scroll-target-on-load", "scrollability-affordance-hints", "scrollytelling", "search-hidden-content", "security", "select-menu-interaction", "sequence-distributed-events", "shaped-cutouts", "shrinking-header-on-scroll", "size-aware-styling", "soft-edge-content-fade", "stabilize-reactive-state", "stack-drill-down", "style-parent-with-has", "summarizer", "support-global-calendar-systems", "swipe-to-remove", "translator", "validate-input-after-interaction", "visually-stable-font-fallbacks", "visually-stable-mixed-fonts", "visually-texture-content", "webmcp" ], "artifacts": [ { "type": "screenshot", "path": "evidence/album-consent-rejected.png", "caption": "album consent rejected png", "findingIds": [] }, { "type": "screenshot", "path": "evidence/album-desktop.png", "caption": "album desktop png", "findingIds": [] }, { "type": "dom", "path": "evidence/album-dom.json", "caption": "album dom json", "findingIds": [] }, { "type": "layout", "path": "evidence/album-layout-mobile.json", "caption": "album layout mobile json", "findingIds": [ "F06" ] }, { "type": "screenshot", "path": "evidence/album-mobile.png", "caption": "album mobile png", "findingIds": [] }, { "type": "screenshot", "path": "evidence/album-play-flow-final.png", "caption": "album play flow final png", "findingIds": [] }, { "type": "video", "path": "evidence/album-play-flow.mp4", "caption": "album play flow mp4", "findingIds": [ "F03" ] }, { "type": "other", "path": "evidence/cookies.json", "caption": "cookies json", "findingIds": [ "F19" ] }, { "type": "other", "path": "evidence/css-platform-probe.json", "caption": "css platform probe json", "findingIds": [ "F01", "F02", "F03", "F07", "F24" ] }, { "type": "discoverability", "path": "evidence/discoverability", "caption": "discoverability", "findingIds": [ "F22" ] }, { "type": "screenshot", "path": "evidence/discoverability-crawler.png", "caption": "discoverability crawler png", "findingIds": [ "F22" ] }, { "type": "screenshot", "path": "evidence/discoverability-rendered.png", "caption": "discoverability rendered png", "findingIds": [ "F22" ] }, { "type": "other", "path": "evidence/focus-targets.json", "caption": "focus targets json", "findingIds": [ "F08", "F14" ] }, { "type": "other", "path": "evidence/headers.json", "caption": "headers json", "findingIds": [ "F19", "F21" ] }, { "type": "heap", "path": "evidence/heap-baseline", "caption": "heap baseline", "findingIds": [] }, { "type": "heap", "path": "evidence/heap-post-search", "caption": "heap post search", "findingIds": [] }, { "type": "screenshot", "path": "evidence/home-contrast.png", "caption": "home contrast png", "findingIds": [] }, { "type": "screenshot", "path": "evidence/home-dark.png", "caption": "home dark png", "findingIds": [ "F01" ] }, { "type": "screenshot", "path": "evidence/home-desktop.png", "caption": "home desktop png", "findingIds": [ "F01", "F04", "F05" ] }, { "type": "dom", "path": "evidence/home-dom.json", "caption": "home dom json", "findingIds": [ "F15", "F24" ] }, { "type": "layout", "path": "evidence/home-layout-mobile.json", "caption": "home layout mobile json", "findingIds": [ "F06", "F07", "F09", "F10", "F15", "F23" ] }, { "type": "screenshot", "path": "evidence/home-mobile.png", "caption": "home mobile png", "findingIds": [ "F04", "F06", "F15", "F23" ] }, { "type": "har-summary", "path": "evidence/home-summary.json", "caption": "home summary json", "findingIds": [ "F12", "F20", "F25", "F26", "F27" ] }, { "type": "trace", "path": "evidence/home-trace", "caption": "home trace", "findingIds": [] }, { "type": "trace-summary", "path": "evidence/home-trace-summary.json", "caption": "home trace summary json", "findingIds": [ "F09", "F11", "F26" ] }, { "type": "har", "path": "evidence/home.har", "caption": "home har", "findingIds": [ "F12" ] }, { "type": "other", "path": "evidence/images.json", "caption": "images json", "findingIds": [ "F10", "F17", "F25" ] }, { "type": "lighthouse", "path": "evidence/lighthouse.json", "caption": "lighthouse json", "findingIds": [ "F09", "F13", "F14", "F16", "F18", "F26" ] }, { "type": "dom", "path": "evidence/login-dom.json", "caption": "login dom json", "findingIds": [] }, { "type": "screenshot", "path": "evidence/login.png", "caption": "login png", "findingIds": [] }, { "type": "other", "path": "evidence/manifest.json", "caption": "manifest json", "findingIds": [] }, { "type": "screenshot", "path": "evidence/not-found.png", "caption": "not found png", "findingIds": [] }, { "type": "other", "path": "evidence/platform-capabilities.json", "caption": "platform capabilities json", "findingIds": [] }, { "type": "screenshot", "path": "evidence/podcasts-desktop.png", "caption": "podcasts desktop png", "findingIds": [] }, { "type": "dom", "path": "evidence/podcasts-dom.json", "caption": "podcasts dom json", "findingIds": [] }, { "type": "other", "path": "evidence/recon-evaluate.json", "caption": "recon evaluate json", "findingIds": [ "F05" ] }, { "type": "other", "path": "evidence/reduced-motion.json", "caption": "reduced motion json", "findingIds": [ "F02" ] }, { "type": "other", "path": "evidence/robots-headers.txt", "caption": "robots headers txt", "findingIds": [] }, { "type": "other", "path": "evidence/robots.txt", "caption": "robots txt", "findingIds": [ "F18" ] }, { "type": "other", "path": "evidence/secrets.json", "caption": "secrets json", "findingIds": [] }, { "type": "screenshot", "path": "evidence/section-desktop.png", "caption": "section desktop png", "findingIds": [] }, { "type": "dom", "path": "evidence/section-dom.json", "caption": "section dom json", "findingIds": [] }, { "type": "other", "path": "evidence/sitemap.xml", "caption": "sitemap xml", "findingIds": [] }, { "type": "other", "path": "evidence/trackers.json", "caption": "trackers json", "findingIds": [ "F20", "F27" ] } ], "config": { "loaded": false }, "coverage": { "catalogVersion": "modern-web-guidance@0.0.172", "catalogChecksum": "sha256:78ccfdb2d483f4c57d9dafed80fd86c6265585a56457c8dcfddc254b80fb44d7", "expected": 58, "recorded": 58, "judged": 58, "blocked": 0, "notRun": 0, "missing": 0, "unknown": 0, "duplicates": 0, "complete": true }, "checkOutcomes": [ { "principleId": "respect-user-preferences", "checkId": "respects-color-scheme", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Dark and default screenshots are byte-identical (480,889 bytes), and the CSS probe found zero prefers-color-scheme, color-scheme, or light-dark() uses.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-desktop.png", "evidence/home-dark.png", "evidence/css-platform-probe.json" ], "findingIds": [ "F01" ] }, { "principleId": "respect-user-preferences", "checkId": "respects-reduced-motion", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Under prefers-reduced-motion: reduce, the probe still found 34 running animations and transitions up to 1s; CSS inspection found no reduced-motion media query.", "pathIds": [ "home" ], "artifacts": [ "evidence/reduced-motion.json", "evidence/css-platform-probe.json" ], "findingIds": [ "F02" ] }, { "principleId": "respect-user-preferences", "checkId": "respects-contrast", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Lighthouse contrast audit passed and the prefers-contrast screenshot remained legible.", "pathIds": [ "home" ], "artifacts": [ "evidence/lighthouse.json", "evidence/home-contrast.png" ] }, { "principleId": "implement-natural-interactions", "checkId": "view-transitions", "status": "issues", "confidence": "medium", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "The CSS platform probe found zero view-transition rules; the album play video shows an abrupt state update rather than a spatial transition.", "pathIds": [ "album" ], "artifacts": [ "evidence/css-platform-probe.json", "evidence/album-play-flow.mp4" ], "findingIds": [ "F03" ] }, { "principleId": "implement-natural-interactions", "checkId": "scroll-driven-animations", "status": "not-applicable", "confidence": "high", "method": "Applicability judgement from route and interaction recon.", "evidence": "No scroll-linked storytelling, parallax, or reveal interaction exists on the representative anonymous routes.", "reason": "No scroll-linked storytelling, parallax, or reveal interaction exists on the representative anonymous routes.", "pathIds": [ "home" ] }, { "principleId": "implement-natural-interactions", "checkId": "physical-gestures", "status": "not-applicable", "confidence": "high", "method": "Applicability judgement from route and interaction recon.", "evidence": "No custom gesture-driven interaction exists on the tested desktop/mobile anonymous surfaces.", "reason": "No custom gesture-driven interaction exists on the tested desktop/mobile anonymous surfaces.", "pathIds": [ "home" ] }, { "principleId": "provide-guided-navigation", "checkId": "scroll-state-aware-chrome", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Persistent global navigation and player chrome remain visible across long listing/detail templates.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-desktop.png", "evidence/section-desktop.png" ] }, { "principleId": "provide-guided-navigation", "checkId": "anchored-positioning", "status": "not-applicable", "confidence": "high", "method": "Applicability judgement from route and interaction recon.", "evidence": "No tooltip, popover, or menu overlay requiring anchored positioning appeared in the tested paths.", "reason": "No tooltip, popover, or menu overlay requiring anchored positioning appeared in the tested paths.", "pathIds": [ "home" ] }, { "principleId": "provide-guided-navigation", "checkId": "directs-attention", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Section and detail routes use clear headings, selected home state, and stable content regions.", "pathIds": [ "home" ], "artifacts": [ "evidence/section-desktop.png", "evidence/album-desktop.png" ] }, { "principleId": "maximize-content-reduce-noise", "checkId": "no-intrusive-interruptions", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Desktop screenshots show the banner covering roughly the lower third; at 360x800 it consumes nearly the entire viewport and hides the player.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-desktop.png", "evidence/home-mobile.png" ], "findingIds": [ "F04" ] }, { "principleId": "maximize-content-reduce-noise", "checkId": "semantic-dismissible-primitives", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "DOM recon found zero dialog, popover, or details elements while the screenshot shows a modal-like consent surface.", "pathIds": [ "home" ], "artifacts": [ "evidence/recon-evaluate.json", "evidence/home-desktop.png" ], "findingIds": [ "F05" ] }, { "principleId": "maximize-content-reduce-noise", "checkId": "reduced-chrome", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "After consent rejection, the album artwork, title, controls, and track list dominate the main pane.", "pathIds": [ "home" ], "artifacts": [ "evidence/album-consent-rejected.png" ] }, { "principleId": "adapt-to-the-form-factor", "checkId": "responsive-no-horizontal-scroll", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Layout measured scrollWidth/innerWidth 801px against a 360px visual viewport on both home and album; the mobile screenshot clips the consent actions off-screen.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-layout-mobile.json", "evidence/album-layout-mobile.json", "evidence/home-mobile.png" ], "findingIds": [ "F06" ] }, { "principleId": "adapt-to-the-form-factor", "checkId": "component-level-responsiveness", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "The same 801px consent layout is retained in a 360px visual viewport, and CSS inspection found no container queries.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-layout-mobile.json", "evidence/css-platform-probe.json" ], "findingIds": [ "F07" ] }, { "principleId": "adapt-to-the-form-factor", "checkId": "input-modality-aware", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "The active probe found numerous 17–22px-tall links and computed outlines with style none for sampled controls; 210 focusable elements create a dense keyboard path.", "pathIds": [ "home" ], "artifacts": [ "evidence/focus-targets.json" ], "findingIds": [ "F08" ] }, { "principleId": "support-core-task-success", "checkId": "clear-purpose-and-primary-action", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Home, section, podcast, and album views have explicit headings and prominent browse/play actions.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-desktop.png", "evidence/section-desktop.png", "evidence/album-consent-rejected.png" ] }, { "principleId": "support-core-task-success", "checkId": "primary-flow-completion", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Rejecting consent and activating album playback produced the preview player and retained album context.", "pathIds": [ "home" ], "artifacts": [ "evidence/album-play-flow.mp4", "evidence/album-play-flow-final.png" ] }, { "principleId": "support-core-task-success", "checkId": "clear-system-state-and-recovery", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Playback state is shown persistently, and the tested missing route provides Page not found, Home, and Help recovery actions.", "pathIds": [ "home" ], "artifacts": [ "evidence/album-play-flow-final.png", "evidence/not-found.png" ] }, { "principleId": "be-fast-and-stable", "checkId": "good-core-web-vitals", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Lighthouse measured LCP 25.4s and CLS 0.434; the independent mobile layout observer measured CLS 0.242.", "pathIds": [ "home" ], "artifacts": [ "evidence/lighthouse.json", "evidence/home-layout-mobile.json", "evidence/home-trace-summary.json" ], "findingIds": [ "F09" ] }, { "principleId": "be-fast-and-stable", "checkId": "visual-stability", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "The mobile layout observer recorded seven shifts totalling 0.242, including a single 0.144 shift; all 56 inspected images lacked width/height attributes.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-layout-mobile.json", "evidence/images.json" ], "findingIds": [ "F10" ] }, { "principleId": "be-fast-and-stable", "checkId": "efficient-main-thread", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Trace summary recorded seven long tasks, a 340ms longest task, and 504ms total blocking time.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-trace-summary.json" ], "findingIds": [ "F11" ] }, { "principleId": "be-fast-and-stable", "checkId": "efficient-resource-delivery", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "HAR captured 167 requests and 4.77MB transferred, including 2.50MB script and 0.96MB font; the main web-player bundle alone was 1.08MB.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-summary.json", "evidence/home.har" ], "findingIds": [ "F12" ] }, { "principleId": "be-fast-and-stable", "checkId": "trim-unused-and-duplicate-code", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Lighthouse estimated 630KiB unused JavaScript and 68KiB unused CSS, including 76% waste in the mobile player bundle.", "pathIds": [ "home" ], "artifacts": [ "evidence/lighthouse.json" ], "findingIds": [ "F13" ] }, { "principleId": "be-inclusive", "checkId": "names-roles-labels", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Lighthouse image-alt and accessible-name audits passed; controls sampled in the DOM expose labels or labelledby relationships.", "pathIds": [ "home" ], "artifacts": [ "evidence/lighthouse.json", "evidence/home-dom.json" ] }, { "principleId": "be-inclusive", "checkId": "sufficient-contrast", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Lighthouse colour contrast audit passed.", "pathIds": [ "home" ], "artifacts": [ "evidence/lighthouse.json" ] }, { "principleId": "be-inclusive", "checkId": "structure-and-focus", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Lighthouse found an H4 “Company” heading that skips levels; the focus probe returned outline style none on sampled controls and a 210-element tab sequence.", "pathIds": [ "home" ], "artifacts": [ "evidence/lighthouse.json", "evidence/focus-targets.json" ], "findingIds": [ "F14" ] }, { "principleId": "be-inclusive", "checkId": "legible-text", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Representative desktop views use readable type, clear spacing, and no observed clipping outside the separately reported narrow consent defect.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-desktop.png", "evidence/album-consent-rejected.png" ] }, { "principleId": "be-inclusive", "checkId": "zoom-reflow-targets-and-media", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "The rendered DOM declares maximum-scale=1, while 360px layout evidence overflows by 441px and clips consent actions.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-dom.json", "evidence/home-layout-mobile.json", "evidence/home-mobile.png" ], "findingIds": [ "F15" ] }, { "principleId": "follow-best-practices", "checkId": "no-console-errors", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Lighthouse captured minified React error #421 from vendor~mobile-web-player.a51ad297.js.", "pathIds": [ "home" ], "artifacts": [ "evidence/lighthouse.json" ], "findingIds": [ "F16" ] }, { "principleId": "follow-best-practices", "checkId": "sound-document-and-assets", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "The image primitive found 56/56 images without width/height, 54 without srcset, and 13 oversized by its 2x display threshold.", "pathIds": [ "home" ], "artifacts": [ "evidence/images.json" ], "findingIds": [ "F17" ] }, { "principleId": "follow-best-practices", "checkId": "browser-platform-hygiene", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Lighthouse reported no DevTools inspector issues, no BFCache blocker, no permission prompt on load, and functioning source-map declarations.", "pathIds": [ "home" ], "artifacts": [ "evidence/lighthouse.json" ] }, { "principleId": "be-discoverable", "checkId": "title-and-description", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Rendered DOM contains a descriptive Spotify Web Player title and a digital music service meta description.", "pathIds": [ "home" ], "artifacts": [ "evidence/recon-evaluate.json" ] }, { "principleId": "be-discoverable", "checkId": "crawlable-and-mobile-friendly", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Lighthouse identified “More information” as non-descriptive, although anchors and robots are otherwise crawlable.", "pathIds": [ "home" ], "artifacts": [ "evidence/lighthouse.json", "evidence/robots.txt" ], "findingIds": [ "F18" ] }, { "principleId": "be-discoverable", "checkId": "canonical-and-indexing-signals", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Main response is 200; canonical points to the homepage; robots allows normal indexing and declares sitemap files.", "pathIds": [ "home" ], "artifacts": [ "evidence/discoverability", "evidence/recon-evaluate.json", "evidence/robots.txt", "evidence/sitemap.xml" ] }, { "principleId": "be-discoverable", "checkId": "structured-and-shareable-metadata", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Open Graph site, title, description, URL, type, and image metadata accurately describe the visible homepage.", "pathIds": [ "home" ], "artifacts": [ "evidence/recon-evaluate.json" ] }, { "principleId": "be-private-and-secure", "checkId": "secure-transport-and-headers", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "CSP permits unsafe-eval; Referrer-Policy and Permissions-Policy are absent; OptanonConsent is not Secure and three cookies use SameSite=None.", "pathIds": [ "home" ], "artifacts": [ "evidence/headers.json", "evidence/cookies.json" ], "findingIds": [ "F19" ] }, { "principleId": "be-private-and-secure", "checkId": "data-minimisation-and-third-parties", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Tracker evidence found 18 third-party origins and known Sentry/GTM trackers; HAR attributed 164/167 requests and 4.76MB to non-main origins.", "pathIds": [ "home" ], "artifacts": [ "evidence/trackers.json", "evidence/home-summary.json" ], "findingIds": [ "F20" ] }, { "principleId": "be-private-and-secure", "checkId": "in-context-permissions-and-modern-auth", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Lighthouse found no geolocation/notification request on load; login uses passwordless email continuation plus Google, Facebook, and Apple options with autocomplete=username.", "pathIds": [ "home" ], "artifacts": [ "evidence/lighthouse.json", "evidence/login.png", "evidence/login-dom.json" ] }, { "principleId": "be-private-and-secure", "checkId": "defensive-browser-policies", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Headers evidence found no Referrer-Policy or Permissions-Policy and a CSP weakened by unsafe-eval; frame-ancestors and HSTS are present.", "pathIds": [ "home" ], "artifacts": [ "evidence/headers.json" ], "findingIds": [ "F21" ] }, { "principleId": "be-resilient", "checkId": "progressive-enhancement", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Discoverability measured only 36% raw/rendered content coverage; the crawler screenshot is blank despite a 200 response.", "pathIds": [ "home" ], "artifacts": [ "evidence/discoverability", "evidence/discoverability-rendered.png", "evidence/discoverability-crawler.png" ], "findingIds": [ "F22" ] }, { "principleId": "be-resilient", "checkId": "resilient-runtime-behaviour", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "At 360px the consent controls extend 441px beyond the visual viewport, preventing reliable access to all choices.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-mobile.png", "evidence/home-layout-mobile.json" ], "findingIds": [ "F23" ] }, { "principleId": "be-resilient", "checkId": "offline-and-installable", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "A valid standalone Spotify manifest and active scoped service worker were observed.", "pathIds": [ "home" ], "artifacts": [ "evidence/manifest.json", "evidence/platform-capabilities.json" ] }, { "principleId": "be-resilient", "checkId": "network-and-http-failure-states", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "A missing route renders an explicit error with Home and Help recovery actions rather than a blank shell.", "pathIds": [ "home" ], "artifacts": [ "evidence/not-found.png" ] }, { "principleId": "be-internationalised", "checkId": "lang-dir-and-logical-properties", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "The page correctly declares lang=en-GB and dir=ltr, but the CSS probe found 163 physical margin/padding declarations and zero logical-property declarations in accessible stylesheets.", "pathIds": [ "home" ], "artifacts": [ "evidence/css-platform-probe.json", "evidence/home-dom.json" ], "findingIds": [ "F24" ] }, { "principleId": "be-internationalised", "checkId": "locale-aware-data", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "The app loads an en-GB locale bundle and presents durations consistently; no hand-formatted dates, prices, or currencies appeared on tested paths.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-dom.json", "evidence/album-dom.json" ] }, { "principleId": "be-internationalised", "checkId": "time-zone-correctness", "status": "not-applicable", "confidence": "high", "method": "Applicability judgement from route and interaction recon.", "evidence": "The representative anonymous catalogue views show track durations but no events, dates, schedules, or time-zone-sensitive data.", "reason": "The representative anonymous catalogue views show track durations but no events, dates, schedules, or time-zone-sensitive data.", "pathIds": [ "home" ] }, { "principleId": "be-trustworthy", "checkId": "no-dark-patterns", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Consent presents Accept cookies and Reject all with equal visual weight, and rejects successfully without hiding content.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-desktop.png", "evidence/album-consent-rejected.png" ] }, { "principleId": "be-trustworthy", "checkId": "humane-error-handling", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "The login markup includes explicit labels, aria-invalid state, passwordless flow, and actionable translated validation/retry messages.", "pathIds": [ "home" ], "artifacts": [ "evidence/login-dom.json" ] }, { "principleId": "be-trustworthy", "checkId": "trustworthy-input-assistance", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Login email uses autocomplete=username and the anonymous search field has an accessible label.", "pathIds": [ "home" ], "artifacts": [ "evidence/login-dom.json", "evidence/focus-targets.json" ] }, { "principleId": "be-trustworthy", "checkId": "safe-commercial-and-account-flows", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "The tested sign-in entry is proportionate and offers passwordless and federated methods; no purchase commitment occurs in the anonymous playback flow.", "pathIds": [ "home" ], "artifacts": [ "evidence/login.png", "evidence/login-dom.json" ] }, { "principleId": "be-sustainable", "checkId": "optimised-assets", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "Image evidence found 54/56 images without responsive sources and 13 oversized; HAR transferred 0.84MB images and 0.96MB fonts.", "pathIds": [ "home" ], "artifacts": [ "evidence/images.json", "evidence/home-summary.json" ], "findingIds": [ "F25" ] }, { "principleId": "be-sustainable", "checkId": "no-wasteful-work", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "The page transfers 2.50MB of scripts, Lighthouse estimates 630KiB unused JS, and the trace records 504ms blocking time before a user plays anything.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-summary.json", "evidence/lighthouse.json", "evidence/home-trace-summary.json" ], "findingIds": [ "F26" ] }, { "principleId": "be-sustainable", "checkId": "third-party-and-media-budget", "status": "issues", "confidence": "high", "method": "Direct visual/objective evidence gathered on representative paths and judged against consulted Modern Web Guidance.", "evidence": "HAR classified 164/167 requests and 4.76MB as outside the main origin, with recaptcha, GTM, and consent tooling among the largest scripts.", "pathIds": [ "home" ], "artifacts": [ "evidence/home-summary.json", "evidence/trackers.json" ], "findingIds": [ "F27" ] }, { "principleId": "be-agent-ready", "checkId": "structured-agent-capabilities", "status": "not-applicable", "confidence": "high", "method": "Applicability judgement from route and interaction recon.", "evidence": "No declared agent-facing transactional surface was found; Spotify permits user-fetch/search agents but intentionally blocks training crawlers.", "reason": "No declared agent-facing transactional surface was found; Spotify permits user-fetch/search agents but intentionally blocks training crawlers.", "pathIds": [ "home" ] }, { "principleId": "be-agent-ready", "checkId": "on-device-inference", "status": "not-applicable", "confidence": "high", "method": "Applicability judgement from route and interaction recon.", "evidence": "No summarisation, translation, or generative feature is part of the representative playback/browse journey.", "reason": "No summarisation, translation, or generative feature is part of the representative playback/browse journey.", "pathIds": [ "home" ] }, { "principleId": "be-memory-efficient", "checkId": "no-leak-under-repeated-interaction", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "After ten search input/clear cycles, node count fell by 7,745 and heap self-size changed only +131,199 bytes (0.18%), with no monotonic retained-growth signal.", "pathIds": [ "home" ], "artifacts": [ "evidence/heap-baseline", "evidence/heap-post-search" ] }, { "principleId": "be-memory-efficient", "checkId": "bounded-footprint", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "Heap self-size was about 74MB for this media SPA and remained stable across the repeated search probe.", "pathIds": [ "home" ], "artifacts": [ "evidence/heap-baseline", "evidence/heap-post-search" ] }, { "principleId": "be-memory-efficient", "checkId": "no-detached-dom-or-unbounded-listeners", "status": "pass", "confidence": "medium", "method": "Direct visual/objective evidence on representative paths.", "evidence": "No Detached* constructor appeared in either top-constructor summary; object, array, and closure populations declined after the repeated interaction.", "pathIds": [ "home" ], "artifacts": [ "evidence/heap-baseline", "evidence/heap-post-search" ] } ], "principleOutcomes": [ { "principleId": "respect-user-preferences", "expectation": "default", "status": "issues", "findingIds": [ "F01", "F02" ] }, { "principleId": "implement-natural-interactions", "expectation": "default", "status": "issues", "findingIds": [ "F03" ] }, { "principleId": "provide-guided-navigation", "expectation": "default", "status": "pass", "findingIds": [] }, { "principleId": "maximize-content-reduce-noise", "expectation": "default", "status": "issues", "findingIds": [ "F04", "F05" ] }, { "principleId": "adapt-to-the-form-factor", "expectation": "default", "status": "issues", "findingIds": [ "F06", "F07", "F08" ] }, { "principleId": "support-core-task-success", "expectation": "default", "status": "pass", "findingIds": [] }, { "principleId": "be-fast-and-stable", "expectation": "default", "status": "issues", "findingIds": [ "F09", "F10", "F11", "F12", "F13" ] }, { "principleId": "be-inclusive", "expectation": "default", "status": "issues", "findingIds": [ "F14", "F15" ] }, { "principleId": "follow-best-practices", "expectation": "default", "status": "issues", "findingIds": [ "F16", "F17" ] }, { "principleId": "be-discoverable", "expectation": "default", "status": "issues", "findingIds": [ "F18" ] }, { "principleId": "be-private-and-secure", "expectation": "default", "status": "issues", "findingIds": [ "F19", "F20", "F21" ] }, { "principleId": "be-resilient", "expectation": "contextual", "status": "issues", "findingIds": [ "F22", "F23" ] }, { "principleId": "be-internationalised", "expectation": "contextual", "status": "issues", "findingIds": [ "F24" ] }, { "principleId": "be-trustworthy", "expectation": "default", "status": "pass", "findingIds": [] }, { "principleId": "be-sustainable", "expectation": "contextual", "status": "issues", "findingIds": [ "F25", "F26", "F27" ] }, { "principleId": "be-agent-ready", "expectation": "contextual", "status": "not-applicable", "findingIds": [], "reason": "No declared agent-facing transactional surface was found; Spotify permits user-fetch/search agents but intentionally blocks training crawlers. No summarisation, translation, or generative feature is part of the representative playback/browse journey." }, { "principleId": "be-memory-efficient", "expectation": "default", "status": "pass", "findingIds": [] } ], "paths": [ { "id": "home", "description": "Anonymous home/listing template and global chrome; first-load consent, preferences, responsive layout, security, network, accessibility, discoverability, and memory.", "url": "https://open.spotify.com/", "conditions": [ "1440x900", "360x800", "prefers-color-scheme: dark", "prefers-reduced-motion: reduce", "prefers-contrast: more", "no JavaScript crawler view", "keyboard focus probe" ], "result": "issues" }, { "id": "section", "description": "Trending section listing archetype representing catalogue collection pages.", "url": "https://open.spotify.com/section/0JQ5DB5E8N831KzFzsBBQ2", "conditions": [ "1440x900", "first-load consent" ], "result": "issues" }, { "id": "album", "description": "Album/detail archetype and primary anonymous play journey after rejecting consent.", "url": "https://open.spotify.com/album/1Aye7tEOHfJ3hDJIeJFggF", "conditions": [ "1440x900", "360x800", "reject consent", "activate play" ], "result": "issues" }, { "id": "podcasts", "description": "Podcast category archetype representing an alternate media listing template.", "url": "https://open.spotify.com/genre/podcasts-web", "conditions": [ "1440x900", "first-load consent" ], "result": "issues" }, { "id": "login", "description": "Authentication entry reached from the app, inspected for labels, autocomplete, passwordless/federated choices, and no-script state.", "url": "https://accounts.spotify.com/en/login", "conditions": [ "1440x900" ], "result": "pass" }, { "id": "not-found", "description": "Invalid route used to inspect runtime HTTP/navigation recovery.", "url": "https://open.spotify.com/__web_uplift_missing_route__", "conditions": [ "1440x900", "reject consent" ], "result": "pass" } ], "findings": [ { "id": "F01", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "respect-user-preferences", "principleCheckId": "respects-color-scheme", "guidanceId": "dark-mode", "guidanceCategory": "modern-web-guidance", "severity": "medium", "confidence": "high", "summary": "Theme is fixed dark instead of following the user’s colour-scheme preference.", "evidence": "Dark and default screenshots are byte-identical (480,889 bytes), and the CSS probe found zero prefers-color-scheme, color-scheme, or light-dark() uses.", "artifacts": [ "evidence/home-desktop.png", "evidence/home-dark.png", "evidence/css-platform-probe.json" ], "suggestedFix": "Declare color-scheme and provide preference-driven light/dark tokens with light-dark() or prefers-color-scheme.", "effort": "medium" }, { "id": "F02", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "respect-user-preferences", "principleCheckId": "respects-reduced-motion", "guidanceId": "accessibility", "guidanceCategory": "modern-web-guidance", "severity": "medium", "confidence": "high", "summary": "Reduced-motion preference does not suppress non-essential motion.", "evidence": "Under prefers-reduced-motion: reduce, the probe still found 34 running animations and transitions up to 1s; CSS inspection found no reduced-motion media query.", "artifacts": [ "evidence/reduced-motion.json", "evidence/css-platform-probe.json" ], "suggestedFix": "Add a prefers-reduced-motion: reduce override that removes decorative animation and shortens non-essential transitions.", "effort": "small" }, { "id": "F03", "pathId": "album", "url": "https://open.spotify.com/album/1Aye7tEOHfJ3hDJIeJFggF", "principleId": "implement-natural-interactions", "principleCheckId": "view-transitions", "guidanceId": "same-document-transitions", "guidanceCategory": "modern-web-guidance", "severity": "low", "confidence": "medium", "summary": "State and route changes do not use View Transitions.", "evidence": "The CSS platform probe found zero view-transition rules; the album play video shows an abrupt state update rather than a spatial transition.", "artifacts": [ "evidence/css-platform-probe.json", "evidence/album-play-flow.mp4" ], "suggestedFix": "Use same-document View Transitions for route and major state changes, with reduced-motion handling.", "effort": "medium" }, { "id": "F04", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "maximize-content-reduce-noise", "principleCheckId": "no-intrusive-interruptions", "guidanceId": "light-dismiss-a-dialog", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "The consent banner obscures core content on every first load.", "evidence": "Desktop screenshots show the banner covering roughly the lower third; at 360x800 it consumes nearly the entire viewport and hides the player.", "artifacts": [ "evidence/home-desktop.png", "evidence/home-mobile.png" ], "suggestedFix": "Replace the large first-load interruption with a compact, content-preserving consent surface while keeping accept and reject equally easy.", "effort": "medium" }, { "id": "F05", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "maximize-content-reduce-noise", "principleCheckId": "semantic-dismissible-primitives", "guidanceId": "declarative-dialog-popover-control", "guidanceCategory": "modern-web-guidance", "severity": "medium", "confidence": "high", "summary": "The consent overlay is custom chrome rather than a semantic modal primitive.", "evidence": "DOM recon found zero dialog, popover, or details elements while the screenshot shows a modal-like consent surface.", "artifacts": [ "evidence/recon-evaluate.json", "evidence/home-desktop.png" ], "suggestedFix": "Use a native dialog for the consent decision, with focus trapping, Escape handling where policy permits, and an explicit accessible name.", "effort": "medium" }, { "id": "F06", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "adapt-to-the-form-factor", "principleCheckId": "responsive-no-horizontal-scroll", "guidanceId": "css-layout", "guidanceCategory": "modern-web-guidance", "severity": "critical", "confidence": "high", "summary": "The first-load experience overflows by 441px on a 360px viewport.", "evidence": "Layout measured scrollWidth/innerWidth 801px against a 360px visual viewport on both home and album; the mobile screenshot clips the consent actions off-screen.", "artifacts": [ "evidence/home-layout-mobile.json", "evidence/album-layout-mobile.json", "evidence/home-mobile.png" ], "suggestedFix": "Remove the 801px minimum layout from the consent surface, allow controls and text to wrap, and verify at 320–400px and zoomed conditions.", "effort": "small" }, { "id": "F07", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "adapt-to-the-form-factor", "principleCheckId": "component-level-responsiveness", "guidanceId": "size-aware-styling", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "The consent component does not adapt to its available container.", "evidence": "The same 801px consent layout is retained in a 360px visual viewport, and CSS inspection found no container queries.", "artifacts": [ "evidence/home-layout-mobile.json", "evidence/css-platform-probe.json" ], "suggestedFix": "Make the consent component intrinsically fluid and add a container query to stack actions and constrain copy at narrow inline sizes.", "effort": "medium" }, { "id": "F08", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "adapt-to-the-form-factor", "principleCheckId": "input-modality-aware", "guidanceId": "css", "guidanceCategory": "modern-web-guidance", "severity": "medium", "confidence": "high", "summary": "Many controls have undersized hit areas and focus indication is unclear.", "evidence": "The active probe found numerous 17–22px-tall links and computed outlines with style none for sampled controls; 210 focusable elements create a dense keyboard path.", "artifacts": [ "evidence/focus-targets.json" ], "suggestedFix": "Provide at least 24x24 CSS px targets (prefer 44x44 for primary touch controls) and a strong :focus-visible ring.", "effort": "medium" }, { "id": "F09", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-fast-and-stable", "principleCheckId": "good-core-web-vitals", "guidanceId": "performance", "guidanceCategory": "modern-web-guidance", "severity": "critical", "confidence": "high", "summary": "Load performance and visual stability are far outside good ranges.", "evidence": "Lighthouse measured LCP 25.4s and CLS 0.434; the independent mobile layout observer measured CLS 0.242.", "artifacts": [ "evidence/lighthouse.json", "evidence/home-layout-mobile.json", "evidence/home-trace-summary.json" ], "suggestedFix": "Profile the LCP dependency chain, prioritize the actual LCP resource, reserve late content space, and defer non-critical scripts.", "effort": "large" }, { "id": "F10", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-fast-and-stable", "principleCheckId": "visual-stability", "guidanceId": "visually-stable-font-fallbacks", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "Late-loading UI causes substantial layout shift.", "evidence": "The mobile layout observer recorded seven shifts totalling 0.242, including a single 0.144 shift; all 56 inspected images lacked width/height attributes.", "artifacts": [ "evidence/home-layout-mobile.json", "evidence/images.json" ], "suggestedFix": "Reserve dimensions or aspect-ratio for imagery and the consent/player regions, and use stable font fallbacks.", "effort": "medium" }, { "id": "F11", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-fast-and-stable", "principleCheckId": "efficient-main-thread", "guidanceId": "break-up-long-tasks", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "The main thread is blocked by long tasks.", "evidence": "Trace summary recorded seven long tasks, a 340ms longest task, and 504ms total blocking time.", "artifacts": [ "evidence/home-trace-summary.json" ], "suggestedFix": "Break up long tasks, schedule non-urgent work by priority, and delay analytics/recaptcha until user intent requires them.", "effort": "large" }, { "id": "F12", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-fast-and-stable", "principleCheckId": "efficient-resource-delivery", "guidanceId": "optimize-script-priority", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "Critical delivery is heavy and delays visible content.", "evidence": "HAR captured 167 requests and 4.77MB transferred, including 2.50MB script and 0.96MB font; the main web-player bundle alone was 1.08MB.", "artifacts": [ "evidence/home-summary.json", "evidence/home.har" ], "suggestedFix": "Reduce the critical dependency chain, subset/dedupe fonts, split the player bundle, and defer consent/analytics dependencies.", "effort": "large" }, { "id": "F13", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-fast-and-stable", "principleCheckId": "trim-unused-and-duplicate-code", "guidanceId": "identify-heavy-scripts", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "Large amounts of unused JS and CSS ship on first load.", "evidence": "Lighthouse estimated 630KiB unused JavaScript and 68KiB unused CSS, including 76% waste in the mobile player bundle.", "artifacts": [ "evidence/lighthouse.json" ], "suggestedFix": "Code-split by route and capability, conditionally load recaptcha/consent tooling, and remove unused CSS from the initial route.", "effort": "large" }, { "id": "F14", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-inclusive", "principleCheckId": "structure-and-focus", "guidanceId": "accessibility", "guidanceCategory": "modern-web-guidance", "severity": "medium", "confidence": "high", "summary": "Heading hierarchy and keyboard focus presentation need correction.", "evidence": "Lighthouse found an H4 “Company” heading that skips levels; the focus probe returned outline style none on sampled controls and a 210-element tab sequence.", "artifacts": [ "evidence/lighthouse.json", "evidence/focus-targets.json" ], "suggestedFix": "Use a sequential heading outline and define an unmistakable :focus-visible style while pruning nonessential tab stops.", "effort": "medium" }, { "id": "F15", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-inclusive", "principleCheckId": "zoom-reflow-targets-and-media", "guidanceId": "fluid-scaling", "guidanceCategory": "modern-web-guidance", "severity": "critical", "confidence": "high", "summary": "The page cannot reflow at a narrow viewport and declares maximum-scale=1.", "evidence": "The rendered DOM declares maximum-scale=1, while 360px layout evidence overflows by 441px and clips consent actions.", "artifacts": [ "evidence/home-dom.json", "evidence/home-layout-mobile.json", "evidence/home-mobile.png" ], "suggestedFix": "Remove maximum-scale=1, fix narrow reflow, and enlarge small interactive targets.", "effort": "small" }, { "id": "F16", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "follow-best-practices", "principleCheckId": "no-console-errors", "guidanceId": "security", "guidanceCategory": "modern-web-guidance", "severity": "medium", "confidence": "high", "summary": "The page logs an uncaught React runtime error.", "evidence": "Lighthouse captured minified React error #421 from vendor~mobile-web-player.a51ad297.js.", "artifacts": [ "evidence/lighthouse.json" ], "suggestedFix": "Resolve the server/client render mismatch that triggers React #421 and add production monitoring that fails builds on uncaught errors.", "effort": "medium" }, { "id": "F17", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "follow-best-practices", "principleCheckId": "sound-document-and-assets", "guidanceId": "deliver-optimized-decorative-images", "guidanceCategory": "modern-web-guidance", "severity": "medium", "confidence": "high", "summary": "Image asset markup does not reserve dimensions or offer responsive candidates.", "evidence": "The image primitive found 56/56 images without width/height, 54 without srcset, and 13 oversized by its 2x display threshold.", "artifacts": [ "evidence/images.json" ], "suggestedFix": "Emit width/height or aspect-ratio and srcset/sizes for artwork variants; keep decorative images explicitly empty-alt.", "effort": "medium" }, { "id": "F18", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-discoverable", "principleCheckId": "crawlable-and-mobile-friendly", "guidanceId": "accessibility", "guidanceCategory": "modern-web-guidance", "severity": "low", "confidence": "high", "summary": "One consent link uses generic link text.", "evidence": "Lighthouse identified “More information” as non-descriptive, although anchors and robots are otherwise crawlable.", "artifacts": [ "evidence/lighthouse.json", "evidence/robots.txt" ], "suggestedFix": "Give the link a destination-specific accessible name such as “Learn how cookie consent works”.", "effort": "trivial" }, { "id": "F19", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-private-and-secure", "principleCheckId": "secure-transport-and-headers", "guidanceId": "security", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "Security headers and cookie flags are weaker than the app’s risk profile warrants.", "evidence": "CSP permits unsafe-eval; Referrer-Policy and Permissions-Policy are absent; OptanonConsent is not Secure and three cookies use SameSite=None.", "artifacts": [ "evidence/headers.json", "evidence/cookies.json" ], "suggestedFix": "Remove unsafe-eval where feasible, set strict Referrer/Permissions policies, and mark every HTTPS cookie Secure with the narrowest SameSite mode.", "effort": "large" }, { "id": "F20", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-private-and-secure", "principleCheckId": "data-minimisation-and-third-parties", "guidanceId": "privacy", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "The anonymous landing page has a broad third-party and tracking footprint.", "evidence": "Tracker evidence found 18 third-party origins and known Sentry/GTM trackers; HAR attributed 164/167 requests and 4.76MB to non-main origins.", "artifacts": [ "evidence/trackers.json", "evidence/home-summary.json" ], "suggestedFix": "Minimize pre-consent requests, self-host or delay nonessential dependencies, and batch strictly necessary analytics after consent.", "effort": "large" }, { "id": "F21", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-private-and-secure", "principleCheckId": "defensive-browser-policies", "guidanceId": "security", "guidanceCategory": "modern-web-guidance", "severity": "medium", "confidence": "high", "summary": "Defensive browser policies are incomplete.", "evidence": "Headers evidence found no Referrer-Policy or Permissions-Policy and a CSP weakened by unsafe-eval; frame-ancestors and HSTS are present.", "artifacts": [ "evidence/headers.json" ], "suggestedFix": "Add restrictive Referrer-Policy and Permissions-Policy, remove unsafe-eval, and evaluate Trusted Types for the React application.", "effort": "large" }, { "id": "F22", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-resilient", "principleCheckId": "progressive-enhancement", "guidanceId": "stabilize-reactive-state", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "Most catalogue content disappears without JavaScript.", "evidence": "Discoverability measured only 36% raw/rendered content coverage; the crawler screenshot is blank despite a 200 response.", "artifacts": [ "evidence/discoverability", "evidence/discoverability-rendered.png", "evidence/discoverability-crawler.png" ], "suggestedFix": "Server-render meaningful listing/detail content and real links, then hydrate playback and personalization progressively.", "effort": "large" }, { "id": "F23", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-resilient", "principleCheckId": "resilient-runtime-behaviour", "guidanceId": "resilient-context-menus-and-nested-dropdowns", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "The consent runtime state is cut off on narrow screens.", "evidence": "At 360px the consent controls extend 441px beyond the visual viewport, preventing reliable access to all choices.", "artifacts": [ "evidence/home-mobile.png", "evidence/home-layout-mobile.json" ], "suggestedFix": "Use intrinsic sizing and a narrow-container layout for the consent state; keep all actions visible and keyboard reachable.", "effort": "medium" }, { "id": "F24", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-internationalised", "principleCheckId": "lang-dir-and-logical-properties", "guidanceId": "translator", "guidanceCategory": "modern-web-guidance", "severity": "medium", "confidence": "high", "summary": "The main web player relies heavily on physical left/right CSS.", "evidence": "The page correctly declares lang=en-GB and dir=ltr, but the CSS probe found 163 physical margin/padding declarations and zero logical-property declarations in accessible stylesheets.", "artifacts": [ "evidence/css-platform-probe.json", "evidence/home-dom.json" ], "suggestedFix": "Migrate layout spacing and positioning to logical inline/block properties and test an RTL locale.", "effort": "large" }, { "id": "F25", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-sustainable", "principleCheckId": "optimised-assets", "guidanceId": "deliver-optimized-decorative-images", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "Artwork and fonts are not delivered at an efficient responsive budget.", "evidence": "Image evidence found 54/56 images without responsive sources and 13 oversized; HAR transferred 0.84MB images and 0.96MB fonts.", "artifacts": [ "evidence/images.json", "evidence/home-summary.json" ], "suggestedFix": "Serve responsive modern artwork variants, subset fonts, and avoid duplicate variable/title font payloads.", "effort": "large" }, { "id": "F26", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-sustainable", "principleCheckId": "no-wasteful-work", "guidanceId": "deprioritize-background-fetches", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "The first load performs substantial avoidable work.", "evidence": "The page transfers 2.50MB of scripts, Lighthouse estimates 630KiB unused JS, and the trace records 504ms blocking time before a user plays anything.", "artifacts": [ "evidence/home-summary.json", "evidence/lighthouse.json", "evidence/home-trace-summary.json" ], "suggestedFix": "Deprioritize background work and conditionally load analytics, recaptcha, cast, and player capabilities when needed.", "effort": "large" }, { "id": "F27", "pathId": "home", "url": "https://open.spotify.com/", "principleId": "be-sustainable", "principleCheckId": "third-party-and-media-budget", "guidanceId": "efficient-background-processing", "guidanceCategory": "modern-web-guidance", "severity": "high", "confidence": "high", "summary": "Third-party code dominates the initial resource budget.", "evidence": "HAR classified 164/167 requests and 4.76MB as outside the main origin, with recaptcha, GTM, and consent tooling among the largest scripts.", "artifacts": [ "evidence/home-summary.json", "evidence/trackers.json" ], "suggestedFix": "Set a third-party performance budget, delay nonessential tags until consent/intent, and consolidate Spotify-owned CDN delivery accounting.", "effort": "large" } ], "taskList": [ { "id": "T1", "title": "Fix the consent surface’s narrow-screen reflow and stop it obscuring the app", "priority": 1, "findingIds": [ "F04", "F05", "F06", "F07", "F15", "F23" ], "guidanceId": "size-aware-styling", "status": "open" }, { "id": "T2", "title": "Cut LCP and blocking work by splitting and deferring the initial player stack", "priority": 2, "findingIds": [ "F09", "F11", "F12", "F13", "F26", "F27" ], "guidanceId": "identify-heavy-scripts", "status": "open" }, { "id": "T3", "title": "Reserve layout space for consent, imagery, and fonts", "priority": 3, "findingIds": [ "F10", "F17", "F25" ], "guidanceId": "visually-stable-font-fallbacks", "status": "open" }, { "id": "T4", "title": "Reduce pre-consent third-party requests and harden security policies", "priority": 4, "findingIds": [ "F19", "F20", "F21", "F27" ], "guidanceId": "privacy", "status": "open" }, { "id": "T5", "title": "Server-render meaningful catalogue content for no-JS crawlers and resilience", "priority": 5, "findingIds": [ "F22" ], "guidanceId": "stabilize-reactive-state", "status": "open" }, { "id": "T6", "title": "Restore zoom, target sizing, and visible keyboard focus", "priority": 6, "findingIds": [ "F08", "F14", "F15" ], "guidanceId": "accessibility", "status": "open" }, { "id": "T7", "title": "Respect colour-scheme and reduced-motion preferences", "priority": 7, "findingIds": [ "F01", "F02" ], "guidanceId": "dark-mode", "status": "open" }, { "id": "T8", "title": "Correct runtime errors and heading hierarchy", "priority": 8, "findingIds": [ "F14", "F16" ], "guidanceId": "accessibility", "status": "open" }, { "id": "T9", "title": "Adopt responsive image candidates and right-size font/artwork delivery", "priority": 9, "findingIds": [ "F17", "F25" ], "guidanceId": "deliver-optimized-decorative-images", "status": "open" }, { "id": "T10", "title": "Replace physical CSS spacing with logical properties", "priority": 10, "findingIds": [ "F24" ], "guidanceId": "translator", "status": "open" } ], "budget": { "wallClockSeconds": 1900, "pathCount": 6, "auditPasses": 1 }, "agent": "pi", "runId": "2026-07-18T04-14-13-188Z" }