develop-userscripts
xixu-me/skills · 418.4k installs · 73 stars
Skill Use when building, debugging, packaging, or publishing browser userscripts for Tampermonkey or ScriptCat, including GM APIs, metadata blocks, permission issues, @match/@grant/@connect setup, ScriptCat background or scheduled scripts, UserConfig blocks, or subscription workflows.
Install
npx -y skills add xixu-me/skills --skill develop-userscripts --agent claude-codeRun in a terminal. Claude loads the skill when a task calls for it. Check the repo's README before you run it.
Files
Userscript work usually breaks at the runtime and metadata boundary, not in the page logic. Choose the runtime first, declare the minimum permissions up front, then debug in the environment where the script actually runs.
When to Use
Use this skill for:
- writing or fixing a Tampermonkey or ScriptCat userscript
- debugging injection timing, missing permissions, CSP workarounds, update checks, or
GM_*behavior - deciding between a portable foreground script and ScriptCat-only
@backgroundor@crontab - adding config UI with
==UserConfig== - packaging a ScriptCat
==UserSubscribe==bundle or preparing a CloudCat-compatible script
Do not use this skill for full browser extension development or general browser automation outside userscript managers.
Runtime Selection
digraph userscript_runtime {
"Need page DOM or page context?" [shape=diamond];
"Need persistent or scheduled work?" [shape=diamond];
"Need to install many scripts as one package?" [shape=diamond];
"Portable foreground script" [shape=box];
"ScriptCat background or crontab script" [shape=box];
"ScriptCat subscription package" [shape=box];
"Need page DOM or page context?" -> "Portable foreground script" [label="yes"];
"Need page DOM or page context?" -> "Need persistent or scheduled work?" [label="no"];
"Need persistent or scheduled work?" -> "ScriptCat background or crontab script" [label="yes"];
"Need persistent or scheduled work?" -> "Need to install many scripts as one package?" [label="no"];
"Need to install many scripts as one package?" -> "ScriptCat subscription package" [label="yes"];
"Need to install many scripts as one package?" -> "Portable foreground script" [label="no"];
}
Preflight
- Confirm the manager and browser. On Manifest V3 browsers, ScriptCat may require
Allow User Scriptsor browser developer mode before scripts run. - Decide page script versus background script before writing code. ScriptCat background scripts cannot touch the DOM.
- Start with metadata, not implementation:
@match,@grant,@connect,@run-at, and any update URLs. - Prefer portable
==UserScript==patterns for ordinary page scripts. Only switch to ScriptCat-only headers when the requested behavior actually needs them.
Workflow
- Choose the runtime and metadata first.
- Declare the smallest permission surface that fits the task.
- Implement against the runtime you chose.
- Debug where the code really runs.
- Foreground scripts: page console plus manager logs.
- ScriptCat background scripts: run log first, then
background.htmlfor real-environment debugging.
- Publish with the right update model.
- Normal scripts: keep
@versionaccurate and add@updateURLor@downloadURLonly when needed. - Subscription bundles: use
==UserSubscribe==, HTTPS URLs, and subscription-level@connect.
- Normal scripts: keep
Quick Reference
| Intent | Default choice | Watch for |
|---|---|---|
| Page UI, DOM scraping, page patching | Portable ==UserScript== |
@match, @grant, @run-at, CSP-sensitive injection |
| Cross-origin API access | GM_xmlhttpRequest with explicit @connect |
Missing hosts, cookie behavior differences, user authorization |
| Long-running worker | ScriptCat @background |
No DOM, must return Promise for async work |
| Scheduled task | ScriptCat @crontab |
Only first @crontab counts, prefer 5-field cron, avoid interval overlap |
| User-editable settings | ==UserConfig== plus GM_getValue |
Block placement and group.key naming |
| Silent bundle install and updates | ==UserSubscribe== |
HTTPS, user.sub.js, subscription connect overrides child scripts |
Common Mistakes
- Missing
@grantfor APIs the script actually uses. - Missing
@connectfor hosts used byGM_xmlhttpRequestorGM_cookie. - Treating
@includeas a better default than@matchfor ordinary host targeting. - Using DOM APIs inside ScriptCat background or cron scripts.
- Returning from a ScriptCat background script before async GM work is truly finished.
- Mixing
==UserScript==and==UserSubscribe==packaging concepts. - Putting
==UserConfig==in the wrong place or reading config keys without thegroup.keyname. - Assuming Tampermonkey and ScriptCat storage, notification, or request behavior is identical.
References
Facts
- Kind
- Skill
- Repo
- xixu-me/skills
- Group
- Uncategorized
- Installs
- 418.4k
- Stars
- 73
- 1find-skillsvercel-labs/skillsHelps users discover and install agent skills when they ask questions like "how do I do X", "find a skill for X", "is there a skill that can...", or express interest in extending capabilities. This skill should be used when the user is looking for functionality that might exist as an installable skill.3M
- 2ai-video-generationinference-sh/skillsGenerate AI videos with Google Veo, Seedance 2.0, HappyHorse, Wan, Grok and 40+ models via inference.sh CLI. Models: Veo 3.1, Seedance 2.0, HappyHorse 1.0, Wan 2.5, Grok Imagine Video, OmniHuman, Fabric, HunyuanVideo. Capabilities: text-to-video, image-to-video, reference-to-video, video editing, lipsync, avatar animation, video upscaling, foley sound. Use for: social media videos, marketing content, explainer videos, product demos, AI avatars. Triggers: video generation, ai video, text to video, image to video, veo, animate image, video from image, ai animation, video generator, generate video, t2v, i2v, ai video maker, create video with ai, runway alternative, pika alternative, sora alternative, kling alternative, seedance, happyhorse1.7M
- 3ai-image-generationinference-sh/skillsGenerate AI images with GPT-Image-2.5, FLUX, Gemini, Grok, Seedream, Reve and 50+ models via inference.sh CLI. Models: GPT-Image-2.5 Flare, GPT-Image-2.5 Sunburst, GPT-Image-2, FLUX Dev LoRA, FLUX.2 Klein LoRA, Gemini 3 Pro Image, Grok Imagine, Seedream 4.5, Reve, ImagineArt. Capabilities: text-to-image, image-to-image, inpainting, LoRA, image editing, upscaling, text rendering. Use for: AI art, product mockups, concept art, social media graphics, marketing visuals, illustrations. Triggers: flux, image generation, ai image, text to image, stable diffusion, generate image, ai art, midjourney alternative, dall-e alternative, text2img, t2i, image generator, ai picture, create image with ai, generative ai, ai illustration, grok image, gemini image, gpt image, openai image, chatgpt image1.7M
- 4ai-avatar-videoinference-sh/skillsCreate AI avatar and talking head videos via inference.sh CLI. Recommended: P-Video-Avatar (fastest, cheapest, built-in TTS). Also: OmniHuman, Fabric, PixVerse. Audio: Inworld TTS-2 (100+ languages, emotion steering for characters), ElevenLabs, Kokoro. Capabilities: audio-driven avatars, text-to-avatar, lipsync videos, talking head generation, virtual presenters, UGC content. Use for: AI presenters, explainer videos, virtual influencers, dubbing, marketing videos, UGC ads, gaming avatars, NPC dialogue. Triggers: ai avatar, talking head, lipsync, avatar video, virtual presenter, ai spokesperson, audio driven video, heygen alternative, synthesia alternative, talking avatar, lip sync, video avatar, ai presenter, digital human, ugc, ugc video, ugc ad, avatar ugc1.7M
- 5twitter-automationinference-sh/skillsAutomate Twitter/X with posting, engagement, and user management via inference.sh CLI. Apps: x/post-create (text and media), x/post-like, x/post-retweet, x/dm-send, x/user-follow. Capabilities: post tweets, schedule content, like posts, retweet, send DMs, follow users, get profiles. Use for: social media automation, content scheduling, engagement bots, audience growth, X API. Triggers: twitter api, x api, tweet automation, post to twitter, twitter bot, social media automation, x automation, tweet scheduler, twitter integration, post tweet, twitter post, x post, send tweet1.7M
- 6remotion-renderinference-sh/skillsRender videos from React/Remotion component code via inference.sh. Pass TSX code, get MP4. Supports all Remotion APIs: useCurrentFrame, useVideoConfig, spring, interpolate, AbsoluteFill, Sequence. Configurable resolution, FPS, duration, codec. Use for: programmatic video generation, animated graphics, motion design, data-driven videos, React animations to video. Triggers: remotion, render video from code, tsx to video, react video, programmatic video, remotion render, code to video, animated video, motion graphics code, react animation video1.6M