skills.rest
CKylinMC
CKylinMCCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

userscript

Guide User.JS script development with GM_* APIs and DOM manipulation.

103|5|Updated Jun 28, 2021
Search Tags:#web development#javascript#scripting#tampermonkey#browser extension#userscript
One-click install
npx skills add https://github.com/CKylinMC/UserJS --skill userscript
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: userscript
Source: https://github.com/CKylinMC/UserJS/tree/main/.agents/skills/userscript
Command: npx skills add https://github.com/CKylinMC/UserJS --skill userscript

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides a comprehensive guide and best practices for developing User.JS scripts, enabling users to customize and enhance web experiences.

Core Features & Use Cases

  • Script Structure: Learn the standard template for User.JS scripts, including metadata and IIFE wrapping.
  • Metadata Configuration: Understand essential and recommended metadata tags for script discovery and functionality.
  • API Usage: Master the GM_* APIs for storage, menu commands, cross-origin requests, and more.
  • DOM Manipulation: Acquire techniques for efficient element creation, styling, event handling, and observation.
  • Debugging & Optimization: Implement strategies for effective debugging and performance tuning.
  • Use Case: You want to automatically hide certain elements on a website or add custom functionality to a web application. This Skill guides you through creating a User.JS script to achieve this.

Quick Start

Use the userscript skill to generate a basic User.JS script template for Bilibili.

Frequently Asked Questions about userscript

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I develop a User.JS script to automate web pages?▼

To develop a User.JS script, you structure your code with proper metadata and IIFE wrapping, then utilize DOM manipulation techniques to automate and enhance web page functionality.

What is the standard structure for a Tampermonkey script?▼

A standard Tampermonkey script structure includes essential metadata tags for script discovery and an IIFE wrapping to encapsulate your JavaScript logic safely.

How do I use GM_ APIs for cross-origin requests in browser extensions?▼

You can use GM_ APIs for cross-origin requests by configuring the necessary metadata tags, enabling your userscript to perform storage, menu commands, and network fetches beyond standard browser limits.

Can I add custom functionality to a web application using userscripts?▼

Yes, you can add custom functionality to a web application by creating a User.JS script that efficiently handles element creation, styling, and event observation.

What are the best debugging strategies for User.JS scripts?▼

Effective debugging strategies for User.JS scripts involve utilizing targeted debugging techniques and performance tuning to identify and resolve issues within your custom browser extensions.

Related Skills

Explore More Software Engineering Skills→
taewook486taewook486

moai-platform-chrome-extension

Develop Chrome extensions with Manifest V3 service workers and content scripts.

Community
Advanced
mozilor-technologiesmozilor-technologies

playwright-testing

Automate cross-browser web application testing with Playwright and page objects.

Official
Intermediate
corey-alixcorey-alix

DOM Utilities Assistant

Query DOM elements and manage event listeners with TypeScript generics.

Official
Intermediate
kuchida1981kuchida1981

comic-viewer-helper

Add resume reading, spread view, progress tracking, and keyboard navigation to comic websites.

Community
Basic