New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Webhome Extension Builder

by webhtv in webhtv/webhtv

Build, review, debug, reverse-engineer, and package WebHome injected extension scripts for FongMi/WebHome App WebView pages.

GPL-3.0Auto-check passedSecurity

Install Webhome Extension Builder

skills CLI
$ npx skills add webhtv/webhtv --skill webhome-extension-builder -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install webhtv/webhtv webhome-extension-builder --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/webhtv/webhtv.git skills-src && mkdir -p .claude/skills && cp -r skills-src/webhome-devkit/skills/webhome-extension-builder .claude/skills/webhome-extension-builder && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
webhome-extension-builder
GitHub stars
1.7k
Token cost
~2.8k tokens
SKILL.md length
1,324 words
Files
25 (incl. scripts, references, assets)
Skills in repo
3
Repo updated
First seen
Licence
GPL-3.0

At a glance

Build, review, debug, reverse-engineer, and package WebHome injected extension scripts for FongMi/WebHome App WebView pages.

  • Works in 8 steps: Page role and URL-pattern summary. → Selector table with title, resource… → Strategy choice and why it is the least… → …
  • Codex is asked to create
  • SKILL.md covers Core Workflow, Input Handling, Strategy Selection and Script Rules, plus 4 more sections
  • Runs JavaScript scripts from its folder; calls python3

What it does

Webhome Extension Builder is an agent skill from webhtv/webhtv. Build, review, debug, reverse-engineer, and package WebHome injected extension scripts for FongMi/WebHome App WebView pages. Use when Codex is asked to create or improve WebHome extensions, webHomeExtensions, sites[].extensions, fm SDK scripts, native App play buttons, pan/magnet/native playback routing, fm.vodInline episode resolvers, TV remote focus helpers, WebHome extension manifests/configuration, JS/API/player reverse engineering for WebHome extensions, or Cloudflare/WAF feasibility diagnosis for…

Its SKILL.md is about 2.8k tokens, which your agent loads only when the skill is triggered. The skill folder holds 28 other files, including scripts, reference files and assets (for example `agents/openai.yaml`, `assets/examples/dm.xueximeng.com.js` and `assets/examples/dm.xueximeng.manifest.json`).

It sits in Security, covering GraphQL and Reverse engineering and malware. It works with Cloudflare. The repository describes itself as: WebHomeTV 基于FongMi二次开发，增强了 WebHome 自定义首页、App Native SDK、网盘链接检测 和 Nostr推荐首页。 这个项目的核心目标是让 CSP 站点首页可以变成一个真正可开发的网页应用：开发者可以用 HTML/CSS/JavaScript 定制首页，再通过 App 暴露的 Native… The licence is GPL-3.0.

When your agent uses it

  • Codex is asked to create
  • Improve WebHome extensions
  • WebHomeExtensions
  • Sites[].extensions

Example prompts

  • “/webhome-extension-builder”

Requirements

  • Python 3
  • Node.js

Workflow steps

8 steps, taken from the first numbered list in SKILL.md.

  1. Page role and URL-pattern summary.
  2. Selector table with title, resource area, resource item, resource URL source, and episode selectors when relevant.
  3. Strategy choice and why it is the least invasive reliable option.
  4. JS reverse evidence when used: target request, initiator/script/function, runtime samples, reproduction status, and WAF classification.
  5. Complete runnable JavaScript.
  6. Manifest or sites[].extensions snippet.
  7. Test steps for WebHome extension manager, Debug workbench, console/log tags, mobile path, and TV path when applicable.
  8. Known risks and selectors, chunks, API contracts, or WAF/session assumptions most likely to break.

What it can do on your machine

Read from SKILL.md and the folder at commit 4e30ffa. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships 1 file in scripts/ (JavaScript, from the files we listed), which the agent can run.

    Shell commands in SKILL.md call:

    • python3

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Webhome Extension Builder loads about 2.8k tokens when it runs, and up to ~23k if it reads all its reference files. Until then it costs about 143 tokens; SKILL.md has 1,324 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~143
When it runs · the whole SKILL.md, loaded when a task matches
~2.8k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~23k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.

SKILL.md

The full file from webhtv/webhtv at commit 4e30ffa, republished under its GPL-3.0 licence (© webhtv). 1,324 words, ~2,815 tokens.

Download SKILL.mdSave it as .claude/skills/webhome-extension-builder/SKILL.md (or your agent's skills folder). This skill also uses 24 other files; get the full folder from GitHub.
name
webhome-extension-builder
description
Build, review, debug, reverse-engineer, and package WebHome injected extension scripts for FongMi/WebHome App WebView pages. Use when Codex is asked to create or improve WebHome extensions, `webHomeExtensions`, `sites[].extensions`, fm SDK scripts, native App play buttons, pan/magnet/native playback routing, `fm.vodInline` episode resolvers, TV remote focus helpers, WebHome extension manifests/configuration, JS/API/player reverse engineering for WebHome extensions, or Cloudflare/WAF feasibility diagnosis for extension-vs-homepage decisions.

WebHome Extension Builder

Core Workflow

Use this skill to produce production-ready WebHome extension scripts that enhance real websites loaded in the App WebView. Prefer small, site-specific enhancements over replacing the site: route verified resources to native playback, add clear App play controls, clean harmful UI, support TV focus, and keep the original site's search, filtering, login, pagination, and detail navigation intact.

Before writing a non-trivial script, read the relevant source material:

  • references/webhome-extension-guide.md: full WebHome extension guide and API reference. Read sections 4, 7, 9-15 for most scripts; read section 8 for fm.vodInline; read section 13 before final compatibility review.
  • references/template-and-example-catalog.md: choose templates and example patterns.
  • references/js-reverse-and-waf-workflow.md: read when the target requires hidden API/signature/player/resource discovery, runtime request capture, local JS reproduction, or Cloudflare/WAF diagnosis.
  • assets/templates/*.js: copy or adapt the relevant template source instead of recreating the skeleton from memory.
  • assets/examples/*.js and *.manifest.json: consult for full real-world patterns after choosing a strategy.
  • scripts/probe_webhome_target.py: run on unknown remote targets before choosing direct homepage fetching, injected extension work, or an authorized backend path.

Input Handling

Establish these facts from the user, local files, target HTML, browser inspection, or analyzer output:

  • Target website URL and target WebHome site key. If the key is unknown, propose a kebab-case key and use exact cspKeyRegex such as ^site-key$.
  • Desired behavior: click interception, injected App play buttons, pan-link validation, media sniffing, layout cleanup, TV focus, or fm.vodInline episode playback.
  • Page roles and URL patterns: home, list/search, detail, play.
  • Stable selectors for title, resource container, resource item, resource button/link, episode list, active episode, poster.
  • Resource source: DOM attributes, href, onclick, nearby text, copied text, API response, player constructor, encrypted page state, or runtime media requests.
  • Access/WAF status: direct HTTP result, App WebView result, Cloudflare/WAF/challenge signals, login/session assumptions, and whether an authorized API/proxy/HAR exists.

If page access is unavailable, ask for one of: target HTML, screenshots plus DOM snippets, or output from assets/templates/page-analyzer.js.

For login, PoW, browser safety checks, or shield/WAF pages that the user can legitimately pass, start a visible browser or attach to an App WebView with CDP/DevTools, have the user complete the interaction in that session, then capture the post-verification network, DOM, console, frames, and media evidence from the same session. Do not replace this with curl guessing, stealth automation, CAPTCHA solving, or cookie/clearance harvesting.

If the target is unknown or may be protected, first run python3 scripts/probe_webhome_target.py <url> from this skill. Treat waf-blocked as: direct fm.req scraping is not reliable; build an extension only if the App WebView can normally load the page. If the App WebView is also blocked, require authorized API access, owner-controlled proxying, or user-supplied HAR/HTML instead of attempting to bypass the challenge.

Strategy Selection

Choose the lowest-risk strategy that fits the page:

  • Existing resource links/buttons: adapt assets/templates/auto-resource-router.js.
  • Need a separate native button without changing original clicks: adapt assets/templates/inject-play-buttons.js.
  • Pan links with availability status: adapt assets/templates/pan-link-router.js; call fm.config() and only run fm.pan.check() when driveCheck is enabled.
  • Lazy episode parsing or encrypted per-episode media: adapt assets/templates/inline-episodes.js; register window.__fmWebHomeInlineResolver before calling fm.vodInline().
  • Runtime-only media URLs: use assets/templates/media-sniffer.js during analysis, then keep only the specific hook/extraction logic required.
  • Hidden signatures, encrypted player state, lazy chunks, or runtime-only APIs: follow references/js-reverse-and-waf-workflow.md; observe network and scripts first, add narrow hooks second, and use local Node reproduction only after real page evidence identifies the entry function.
  • Broad mobile/TV site enhancement: start from assets/templates/site-enhance-skeleton.js.
  • TV-only remote support shared by another extension: package assets/templates/tv-focus-helper.js as a dependency and declare depends.
  • Popups, scroll locks, or ad overlays: adapt assets/templates/site-cleanup.js conservatively.

Default to runAt: "document-end". Use document-start only for early hooks such as window.open, fetch, XMLHttpRequest, history routing, or player constructor wrapping, and make the script tolerate downgrade to document-end. Do not add stealth fingerprint patches, CAPTCHA solving, Cloudflare clearance harvesting, or token cracking to extension scripts.

Script Rules

Write one top-level IIFE with all site-specific values in CONFIG. Include these common helpers unless the chosen template already has them:

  • log() using GM_log first, console fallback second.
  • whenFm() that waits for the fmsdk event.
  • ready(fn) for DOM readiness.
  • cleanText(), URL normalization, title fallback, and resource classification.
  • A debounced scan loop using MutationObserver, fmurlchange, and data-fm-* markers to avoid duplicate injection.

Resource routing rules:

  • Never intercept every a[href]; only intercept elements classified as resources.
  • Preserve copy buttons and normal site navigation unless the user explicitly asks to replace them.
  • Use capture-phase click handlers for resource routing and wrap async actions in try/catch or .catch().
  • Use fm.play(url, title, { headers: { Referer: ... }, credentials: "include" }) for direct media.
  • Use fm.pan.play({ type, url, password, title, pic, wallPic }) for pan, magnet, ed2k, thunder, jianpian, and generic push links. Pass the best known poster as pic and backdrop/still as wallPic; do not expect pic to become a playback background.
  • Use fm.req() for JS/API reads that need native networking; use fm.res() for DOM media/image URLs that need the local resource gateway.

UI and TV rules:

  • Add injected controls only where users naturally act: resource rows, episode areas, or player panels.
  • Add async states: loading, empty, failure, and retry or toast where appropriate.
  • On mobile/non-TV WebHome pages, top fixed/sticky operation areas must reserve status-bar safe space only while the WebView is in fullscreen/fused chrome states such as chromeMode: "edge" or immersive. In normal chrome after exiting fullscreen, remove the top reservation so the page does not show a blank row. Use fm.ui.getViewport() and fmviewport when available, write a fallback first, then use max(var(--fm-safe-top, 0px), env(safe-area-inset-top, 0px)); never add native --fm-safe-top and browser env() together.
  • On TV, make actionable non-link elements focusable, use :focus styles, map OK/Enter to native .click() for custom focusables, and guard text inputs with readonly until confirmation.
  • Focus styling must not change layout dimensions; use outline, background, box-shadow, or small transform.
Show full SKILL.md (384 more words)Show less

Compatibility Rules

Assume old Android WebViews and keep generated JavaScript at ES2017 or below. Do not emit:

  • Optional chaining ?., nullish coalescing ??, logical assignment, class fields, private fields, catch {} without binding.
  • Regex lookbehind, named capture groups, or dotAll s regex literals.
  • replaceAll, Promise.allSettled, Object.fromEntries, Array.flat/flatMap, structuredClone, or unguarded AbortController.

CSS must avoid fragile modern selectors and values:

  • Do not use :is(), :where(), :has(), or :focus-visible.
  • Avoid flex gap in injected panels unless a margin fallback is already present.
  • Provide fallbacks for aspect-ratio, clamp(), inset, backdrop-filter, and viewport units.
  • Use var(--fm-web-height, 100vh) instead of bare full-screen height when sizing WebHome overlays.

Packaging

Always output a fixed manifest/config unless the user only requested a review:

json
{
  "extensions": [
    {
      "id": "site-native-router",
      "name": "Site native router",
      "version": "1.0.0",
      "runAt": "document-end",
      "cspKeyRegex": ["^site-key$"],
      "js": ["./site.js"]
    }
  ]
}

For sites[].extensions, omit cspKeyRegex unless the user wants extra narrowing. For root-level webHomeExtensions, include cspKeyRegex and enabled: true only when the extension should load by default.

Use stable kebab-case IDs containing the site name. Start new scripts at 1.0.0, and increment versions when editing an existing extension. Declare depends when sharing helpers such as tv-focus-helper.

Output Format

When creating a new extension, provide:

  1. Page role and URL-pattern summary.
  2. Selector table with title, resource area, resource item, resource URL source, and episode selectors when relevant.
  3. Strategy choice and why it is the least invasive reliable option.
  4. JS reverse evidence when used: target request, initiator/script/function, runtime samples, reproduction status, and WAF classification.
  5. Complete runnable JavaScript.
  6. Manifest or sites[].extensions snippet.
  7. Test steps for WebHome extension manager, Debug workbench, console/log tags, mobile path, and TV path when applicable.
  8. Known risks and selectors, chunks, API contracts, or WAF/session assumptions most likely to break.

When editing files in a repo, create the JS and manifest files directly, then validate with the checklist below.

Final Checklist

Verify before finishing:

  • Script has no syntax/API/CSS redline listed above.
  • No broad link interception; no account, cookie, or private data exfiltration.
  • No WAF/challenge bypass logic, stealth automation patching, CAPTCHA solving, clearance-cookie harvesting, or per-account token leakage.
  • GM_getValue/GM_setValue, fm.req, fm.play, fm.pan.play, and fm.vodInline calls are awaited or caught.
  • SPA route changes and DOM re-rendering do not duplicate buttons.
  • Empty pages do not get stray panels or buttons.
  • Manifest has fixed id, version, runAt, and exact site key matching.
  • Mobile controls have adequate touch targets; TV focus and OK activation work when TV support is in scope.

© webhtv, GPL-3.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 24 other files (scripts, references, assets) in webhome-devkit/skills/webhome-extension-builder of webhtv/webhtv.

  • SKILL.md
  • agents/openai.yaml
  • assets/examples/dm.xueximeng.com.js
  • assets/examples/dm.xueximeng.manifest.json
  • assets/examples/gying-extension.js
  • assets/examples/gying-extension.manifest.json
  • assets/examples/pomo.manifest.json
  • assets/examples/pomo.mom.js
  • assets/examples/ymvid.com.js
  • assets/examples/ymvid.manifest.json
  • assets/templates/auto-resource-router.js
  • assets/templates/inject-play-buttons.js
  • assets/templates/inline-episodes.js
  • assets/templates/media-sniffer.js
  • assets/templates/page-analyzer.js
  • assets/templates/pan-link-router.js
  • assets/templates/site-cleanup.js
  • … and 8 more

Open the folder on GitHubat commit 4e30ffa

Compare with similar skills

Webhome Extension Builder next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Webhome Extension Builder compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Webhome Extension Builder this skillwebhtv/webhtv1.7k—~2.8kAutomated safety check: PassGPL-3.0
Distilled SDKalchemy-run/distilled431—~6kAutomated safety check: PassApache-2.0
Certmanager Dns01 Gke Private Clusterdivinevideo/divine-mobile266—~1.8kAutomated safety check: PassMPL-2.0
Reverse Flowlingbol088-spec/reverse-flow-skill936—~2.4kAutomated safety check: PassMIT
Ctf Malwareljagiello/ctf-skills3.4k1 repos~2.1kAutomated safety check: NotesMIT
Openfasttrace Reverse Specsitsallcode/openfasttrace198—~2.9kAutomated safety check: PassGPL-3.0

Similar skills

  • Distilled SDK

    alchemy-run/distilled

    Build or update a distilled SDK for an API provider — sourcing its OpenAPI/Smithy/GraphQL/discovery description, adding the spec mirror that feeds it, generating packages/<provider, listing it on…

    431 GitHub stars~6k tokensUpdated yesterday
    Backend & APIsAuto-check passed

  • Certmanager Dns01 Gke Private Cluster

    divinevideo/divine-mobile

    Fix cert-manager DNS01 ACME challenges stuck in "pending" state with "DNS record not yet propagated" inside GKE private clusters, even when TXT records exist in Cloudflare DNS.

    266 GitHub stars~1.8k tokensUpdated yesterday
    DevelopmentAuto-check passed

  • Reverse Flow

    lingbol088-spec/reverse-flow-skill

    Guided reverse engineering workflow for binaries, firmware, mobile apps, scripts, document samples, protocol captures, and unknown artifacts.

    936 GitHub stars~2.4k tokensUpdated 2 mo ago
    SecurityAuto-check passed

  • Ctf Malware

    ljagiello/ctf-skills

    Provides malware analysis and network traffic techniques for CTF challenges.

    3.4k GitHub starsUsed in 1 repo~2.1k tokens
    SecurityAuto-check: notes

  • Openfasttrace Reverse Specs

    itsallcode/openfasttrace

    Reverse-engineer missing or incomplete OpenFastTrace system requirements and arc42-style design documentation from a project's user guide, existing documentation, tests, and code.

    198 GitHub stars~2.9k tokensUpdated yesterday
    SecurityAuto-check passed

  • Combine Dbc

    CSS-Electronics/can-bus-reverse-engineering-skills

    Combine multiple individual single-signal DBC files into one combined DBC at the application level.

    180 GitHub stars~826 tokensUpdated 2 days ago
    SecurityAuto-check passed

More from webhtv/webhtv

  • Webhome Homepage Builder

    webhtv/webhtv

    Build, review, debug, reverse-engineer data sources for, and package FongMi/WebHome custom homepage single-file HTML.

    1.7k GitHub stars~3.8k tokensUpdated yesterday
    Auto-check passed

  • Upstream Integration Governor

    webhtv/webhtv

    Inventory related upstream repositories, generate or refresh exhaustive commit-ledger assessment documents, and evaluate or implement dependency integrations safely, efficiently, and reversibly.

    1.7k GitHub stars~3.8k tokensUpdated yesterday
    Auto-check passed

Works with

Categories

Questions about Webhome Extension Builder

What does Webhome Extension Builder do?

Build, review, debug, reverse-engineer, and package WebHome injected extension scripts for FongMi/WebHome App WebView pages. Webhome Extension Builder is an agent skill from webhtv/webhtv. Build, review, debug, reverse-engineer, and package WebHome injected extension scripts for FongMi/WebHome App WebView pages.

When should I use Webhome Extension Builder?

Webhome Extension Builder fits situations like: Codex is asked to create; improve WebHome extensions; webHomeExtensions; sites[].extensions.

How do I install Webhome Extension Builder in Claude Code?

Run `npx skills add webhtv/webhtv --skill webhome-extension-builder -a claude-code`. Or copy the skill folder (webhome-devkit/skills/webhome-extension-builder in webhtv/webhtv) into .claude/skills/webhome-extension-builder in your project. Claude Code loads it when a task matches its description.

How do I install Webhome Extension Builder in Codex?

Run `npx skills add webhtv/webhtv --skill webhome-extension-builder -a codex`. Or copy the skill folder (webhome-devkit/skills/webhome-extension-builder in webhtv/webhtv) into .agents/skills/webhome-extension-builder in your project. Codex loads it when a task matches its description.

Can I use Webhome Extension Builder in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add webhtv/webhtv --skill webhome-extension-builder -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/webhome-extension-builder, .gemini/skills/webhome-extension-builder, .github/skills/webhome-extension-builder and .opencode/skills/webhome-extension-builder in your project.

What does Webhome Extension Builder need to run?

Going by SKILL.md and its folder, Webhome Extension Builder needs JavaScript for the scripts in its folder and the command-line tools its instructions call (python3). Our summary lists: Python 3; Node.js.

Does Webhome Extension Builder access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Webhome Extension Builder safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.

What licence does Webhome Extension Builder use?

Webhome Extension Builder is published under the GPL-3.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Webhome Extension Builder use?

About 2.8k tokens (SKILL.md is roughly 11k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 20k tokens, read only when the agent opens those files.

What are the alternatives to Webhome Extension Builder?

Skills that share tags, products or a category with Webhome Extension Builder: Distilled SDK (alchemy-run/distilled, 431 stars), Certmanager Dns01 Gke Private Cluster (divinevideo/divine-mobile, 266 stars), Reverse Flow (lingbol088-spec/reverse-flow-skill, 936 stars) and Ctf Malware (ljagiello/ctf-skills, 3.4k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Webhome Extension Builder?

webhtv (a GitHub organization) maintains it in webhtv/webhtv, which has 1,661 GitHub stars. The repository holds 3 skills in this directory. The repository was last updated on October 8, 2026.

Source: webhtv/webhtv on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.