← ClaudeAtlas

userscriptslisted

Use when writing Tampermonkey/Violentmonkey/Greasemonkey userscripts, modifying website behavior or appearance, or working with .user.js files.
denolfe/dotfiles · ★ 83 · Data & Documents · score 75
Install: claude install-skill denolfe/dotfiles
# Userscript Development Guide for writing Tampermonkey/Violentmonkey userscripts. ## Workflow ### Phase 1: Requirements Ask one at a time: 1. **Target site** - URL pattern (e.g., `https://example.com/*`) 2. **Goal** - CSS styling, add feature, remove element, keyboard shortcut, etc. 3. **Output location** - Where to save the `.user.js` file ### Phase 2: DOM Inspection **Option A: Fetch URL directly (try first for public sites)** - Use WebFetch to retrieve page HTML - Search for relevant selectors, CSS variables, data attributes - Works for public sites not behind login **Option B: User provides MHTML/HTML file** - If fetch fails (login required, dynamic content), instruct: "Save the page (Cmd+S / Ctrl+S) as MHTML or 'Webpage, Complete'" - Grep for patterns: `class=`, `data-`, `id=`, `--` (CSS variables) - Prefer stable selectors: `data-testid`, `data-*`, semantic IDs over generated class names **Option C: User provides selectors** - Guide user to inspect element in browser devtools - Ask for: element selector, parent structure, relevant CSS variables ### Phase 3: Implementation 1. Choose `@run-at` timing based on task type 2. Choose `@grant` level (start with `none`) 3. Write script using metadata template below 4. Save to user-specified location ### Phase 4: Testing - Instruct: "Install in Tampermonkey/Violentmonkey and reload the page" - If issues: iterate on selectors or timing --- ## Metadata Template ```javascript // ==UserScript== // @name Script