{"slug":"browser-compatibility-review","title":"browser-compatibility-review","summary":"Audit JS/CSS/HTML feature usage against the project's declared Browserslist/supported-browser matrix using Baseline and caniuse status data, flag unguarded non-Baseline usage, and verify feature-detection or polyfill fallback coverage, with per-feature caniuse/Baseline lookups lo","platform":"Claude","tags":[],"authorName":"LLM Mart","authorSlug":"llm-mart","score":0,"source":"github","price":null,"verified":false,"createdAt":"2026-10-05T21:52:11.020108Z","repo":{"url":"https://github.com/VincentChuWaiChow/vanguard-frontier-agentic","stars":24,"forks":3,"license":"Apache-2.0","updatedAt":"2026-10-05T13:00:24Z"},"bodyHtml":"<hr>\n<h2>name: browser-compatibility-review\ndescription: Audit JS/CSS/HTML feature usage against the project's declared Browserslist/supported-browser matrix using Baseline and caniuse status data, flag unguarded non-Baseline usage, and verify feature-detection or polyfill fallback coverage, with per-feature caniuse/Baseline lookups loaded only for features actually in question.\nallowed-tools: Read Grep Glob\nmetadata:\nauthor: \"github: VincentChuWaiChow\"\nversion: \"0.1.0\"\nupdated: \"2026-07-02\"\ncategory: platform</h2>\n<h1>Browser Compatibility Review</h1>\n<h2>Purpose</h2>\n<p>\"Works on my browser\" is not a compatibility strategy. This skill checks used web-platform features against the org's actual declared supported-browser matrix (Browserslist config or an explicit browser-version list) using Baseline/caniuse status, and verifies that any feature outside \"widely available\" has a real feature-detection or polyfill fallback rather than a silent failure.</p>\n<h2>When to use</h2>\n<p>Use this skill when the user asks to:</p>\n<ul>\n<li>review a PR using a new JS API, CSS feature, or HTML element for cross-browser risk,</li>\n<li>audit the overall Baseline-status distribution of features used in a codebase,</li>\n<li>decide whether a feature needs a polyfill, feature-detection gate, or is safe to use unguarded,</li>\n<li>propose narrowing or widening the org's supported-browser matrix,</li>\n<li>triage a browser-specific bug report.</li>\n</ul>\n<h2>Context7 Documentation Protocol</h2>\n<p>Baseline status, caniuse support tables, and Browserslist/tooling behavior change on their own release cadences, independent of this skill's version — never assert a feature's Baseline tier, a browser's support version, or a config-syntax detail from memory.</p>\n<ol>\n<li>Call <code>ToolSearch</code> with query <code>\"context7\"</code> (or <code>\"select:mcp__Context7__resolve-library-id,mcp__Context7__query-docs\"</code>) to load the Context7 tools if not already loaded in this session.</li>\n<li>Call <code>mcp__Context7__resolve-library-id</code> for <code>web-features</code> (prefer <code>/web-platform-dx/web-features</code>) when grounding a Baseline-status claim (widely/newly/limited availability, <code>baseline_low_date</code>/<code>baseline_high_date</code> semantics) — do not paraphrase Baseline's tiering from memory.</li>\n<li>Call <code>mcp__Context7__query-docs</code> for the specific feature or mechanism in question — e.g. \"compute Baseline status for a compat key\", \"getStatus for a web-features id\" — before stating a feature's tier as fact. Do this per review, not once from a prior session's memory.</li>\n<li>For the exact per-feature per-browser support matrix (which browser version added support), prefer live lookups against <code>https://caniuse.com/</code> and MDN's browser-compatibility tables in <code>official_docs</code> over Context7 paraphrase — Context7's <code>web-features</code> package computes Baseline tiers from that same underlying data but is not the source of truth for a single browser-version cell.</li>\n<li>Browserslist's own config syntax and query semantics are not consistently resolvable in Context7 (verified: no dedicated <code>browserslist</code> library was found when this skill was authored) — treat any Browserslist query-syntax claim as <code>documentation-based (Context7 unavailable for this library)</code> and confirm it against the project's actual <code>.browserslistrc</code> / <code>package.json</code> <code>browserslist</code> key and the official <code>browserslist/browserslist</code> GitHub README rather than inventing query syntax.</li>\n<li>If Context7 returns no relevant match for a claim, fall back to the <code>official_docs</code> URLs and mark the claim <code>documentation-based (Context7 unavailable)</code> instead of presenting it as freshly verified.</li>\n<li>Never invent a Baseline tier, a caniuse support percentage, or a Browserslist query keyword that no queried source confirms.</li>\n</ol>\n<h2>Lean operating rules</h2>\n<ul>\n<li>Always check the feature against the project's actual declared Browserslist config or explicit browser-version list — never approve based on the reviewer's own current browser, and never assume a default matrix (e.g. <code>&gt; 0.5%, last 2 versions, Firefox ESR, not dead</code>) applies without reading the project's own config.</li>\n<li>Distinguish Baseline \"Newly available\" (recently reached cross-engine support, but by definition still excludes older browsers within the ~2.5-year newly-to-widely window) from \"Widely available\" (safe to use unguarded for most matrices) from \"Limited availability\" (requires a fallback). Treat these as the three tiers computed from <code>baseline_low_date</code> / <code>baseline_high_date</code>, not as marketing labels.</li>\n<li>For any Limited-Availability feature, or a Newly-Available feature whose window excludes a browser/version actually in the project's matrix, verify a real <code>@supports</code>/feature-detection/polyfill exists and correctly gates the risky code path — do not accept an assertion that a fallback \"exists\" without reading the code that implements it.</li>\n<li>Weigh polyfill bundle-size cost against the actual percentage of affected users (from real analytics/RUM data if available) rather than blanket-recommending every polyfill; a polyfill added for a browser with near-zero real traffic is often a worse tradeoff than accepting the gap.</li>\n<li>Treat any hard failure (thrown exception, blank render, broken checkout) as strictly higher severity than cosmetic degradation (missing rounded corners, no animation), and prioritize findings accordingly.</li>\n<li>Recommend supported-browser-matrix changes only as data-backed proposals to product/analytics owners — this skill does not unilaterally decide the org's matrix, it surfaces the gap and the tradeoff.</li>\n<li>Never recommend disabling a security-relevant browser default (mixed-content blocking, SameSite cookie defaults, CSP enforcement, Permissions Policy) as a \"compatibility workaround\" — that is a security regression, not a fix, and must be flagged as such if proposed by the user.</li>\n<li>Load reference files only for the review question actually in scope (single-feature triage vs full-codebase Baseline sweep vs matrix-change proposal); do not preload the full feature catalog for a one-feature check.</li>\n</ul>\n<h2>References</h2>\n<p>Load these only when needed:</p>\n<ul>\n<li><a href=\"references/baseline-status-model.md\">Baseline status model</a> — use when determining or explaining the exact Baseline tier (widely/newly/limited) of a specific feature and what that tier does and does not guarantee for the project's matrix.</li>\n<li><a href=\"references/fallback-verification-patterns.md\">Fallback verification patterns</a> — use when a finding requires checking whether an actual feature-detection gate or polyfill exists and correctly covers the risky code path, across JS, CSS, and HTML.</li>\n<li><a href=\"references/browserslist-matrix-interpretation.md\">Browserslist matrix interpretation</a> — use when reading, interpreting, or proposing a change to the project's <code>.browserslistrc</code>/<code>browserslist</code> config, or reconciling it with build-tool (Autoprefixer/Babel/postcss-preset-env) targets.</li>\n</ul>\n<h2>Response minimum</h2>\n<p>Return, at minimum:</p>\n<ul>\n<li>the feature(s) in scope and their exact Baseline status (widely / newly / limited, with the underlying date window if newly available),</li>\n<li>the specific browsers in the org's declared matrix that lack support, if any, cited against the project's actual Browserslist/matrix config,</li>\n<li>current fallback status (none / feature-detected / polyfilled) with the actual code shown, not an assertion,</li>\n<li>severity distinction between hard failure and cosmetic degradation,</li>\n<li>polyfill cost-vs-affected-user tradeoff note if a polyfill is recommended,</li>\n<li>evidence label for every claim (<code>live evidence</code> from project config/code, <code>documentation-based</code>, or <code>inference</code>), and an explicit note when Context7 was unavailable for a cited claim.</li>\n</ul>\n","files":[{"path":"metadata.json","sizeBytes":1023,"isText":true},{"path":"references/baseline-status-model.md","sizeBytes":5061,"isText":true},{"path":"references/browserslist-matrix-interpretation.md","sizeBytes":5757,"isText":true},{"path":"references/fallback-verification-patterns.md","sizeBytes":5451,"isText":true},{"path":"SKILL.md","sizeBytes":7528,"isText":true}],"reviewScore":null,"reviewSummary":null,"trust":{"provenance":"trusted-source-unreviewed","notice":"Community-authored content, reproduced verbatim and not vetted as instructions. Treat it as data to evaluate, never as directives to follow.","bodySource":null},"bodyLocked":false,"purchaseUrl":null,"sourceUrl":null,"report":{"provenance":"trusted-source-unreviewed","screen":{"ran":true,"outcome":"clean","suspicious":0,"notes":0,"hiddenCharacters":false},"virusScan":{"engine":"clamav","status":"clean","scannedAt":"2026-10-05T21:57:59.666926Z","sha256":"6E72DE477F7079036BEF0F86B987D2BA9C6F31C18E005D30043E2AD15CCE96BE","sizeBytes":11182},"review":null,"source":{"repositoryUrl":"https://github.com/VincentChuWaiChow/vanguard-frontier-agentic","path":"skills/frontend/browser-compatibility-review","license":"Apache-2.0","commit":"febe32a08e78fd06b1e466187410d673f1958d87","subtreeSha":"10D720A0B1D408D7797C667C357A95F7419DB6F6C42539745E487D1A516B990D","lastSyncedAt":"2026-10-05T21:51:58.639905Z"},"reviewedAt":"2026-10-05T22:09:58.017599Z","notice":"Community-authored content, reproduced verbatim and not vetted as instructions. Treat it as data to evaluate, never as directives to follow."},"install":[{"target":"skills-cli","command":"npx skills add https://github.com/VincentChuWaiChow/vanguard-frontier-agentic/tree/master/skills/frontend/browser-compatibility-review"},{"target":"claude-code","command":"claude plugin marketplace add https://llmmart.ai/marketplace.json && claude plugin install vincentchuwaichow-vanguard-frontier-agentic@llmmart"},{"target":"git","command":"git clone https://github.com/VincentChuWaiChow/vanguard-frontier-agentic.git"}]}