ref-sp-js-userscriptlisted

# Userscript ## Purpose Provide portable defaults for userscripts that are resilient to DOM changes, scoped safely, and explicit about permissions and page integration. ## When to use this skill - Writing or reviewing a userscript. - Designing the metadata block, grants, and match patterns. - Injecting UI into third-party pages. - Automating DOM interactions or page data extraction. ## Scope Boundaries - Use this skill when the code runs as a userscript on third-party pages and the metadata block, grants, or page integration rules dominate the design. - Use `ref-sp-js-web-standalone-template` when the browser code lives in an app you control rather than in a userscript manager. - Use `ref-sp-js-javascript` for plain JavaScript structure and JSDoc concerns that are not userscript-specific. ## Defaults - Keep the metadata block explicit and minimal. - Prefer `.user.js` for plain JavaScript userscripts and `.user.ts` only when the repo has a deliberate TypeScript or build flow for userscripts. - Use the narrowest `@match` or `@include` patterns that still fit the task. - Declare grants deliberately; do not request APIs you do not use. - Keep startup idempotent so re-runs do not duplicate UI or listeners. - Isolate selectors, storage keys, and injected class names as constants. - Keep fixed mode names, labels, and state tags as const literals and derive any needed unions from those values instead of repeating them in a separate type declaration. - Prefer `const` arrow fun