Agent skill

Extension Development

by nimbalyst in nimbalyst/nimbalyst

Build, install, and hot-reload Nimbalyst extensions using MCP tools.

MITAuto-check passedDevelopment

Install Extension Development

skills CLI
$ npx skills add nimbalyst/nimbalyst --skill extension-development -a claude-code

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

GitHub CLI
$ gh skill install nimbalyst/nimbalyst extension-development --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/nimbalyst/nimbalyst.git skills-src && mkdir -p .claude/skills && cp -r skills-src/packages/extensions/extension-dev-kit/claude-plugin/skills/extension-development .claude/skills/extension-development && 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
extension-development
GitHub stars
1.8k
Token cost
~1.5k tokens
SKILL.md length
655 words
Files
1
Skills in repo
14
Repo updated
First seen
Licence
MIT

At a glance

Build, install, and hot-reload Nimbalyst extensions using MCP tools.

  • Works in 5 steps: Create extension project with… → Implement the extension code → Build with extension_build → …
  • Iterating on Nimbalyst extensions
  • SKILL.md covers Available MCP Tools, Testing Tools, Development Workflow and Important Notes, plus 1 more section
  • Calls npm

What it does

Extension Development is an agent skill from nimbalyst/nimbalyst. Build, install, and hot-reload Nimbalyst extensions using MCP tools. Use when developing, testing, or iterating on Nimbalyst extensions.

Its SKILL.md is about 1.5k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Development, covering Browser extensions and MCP servers. It works with Playwright. The repository describes itself as: Nimbalyst - The open-source visual workspace for Claude Code, Codex, and OpenCode. Run multiple coding agents in parallel, edit their work visually in markdown, mockups, and… The licence is MIT.

When your agent uses it

  • Iterating on Nimbalyst extensions
  • Tasks that involve Browser extensions
  • Tasks that involve MCP servers

Example prompts

  • “/extension-development”

Requirements

  • Node.js

Workflow steps

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

  1. Create extension project with /new-extension [file-patterns]
  2. Implement the extension code
  3. Build with extension_build
  4. Install with extension_install
  5. Test in Nimbalyst

What it can do on your machine

Read from SKILL.md and the folder at commit a3dbdb4. 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

    Shell commands in SKILL.md call:

    • npm

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

  • Network

    No URLs in SKILL.md. Its commands use npm, which can reach the network depending on how they are called.

    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

Extension Development loads about 1.5k tokens when it runs. Until then it costs about 40 tokens; SKILL.md has 655 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~40
When it runs · the whole SKILL.md, loaded when a task matches
~1.5k

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); files beside SKILL.md are not scanned.

SKILL.md

The full file from nimbalyst/nimbalyst at commit a3dbdb4, republished under its MIT licence (© nimbalyst). 655 words, ~1,539 tokens.

Download SKILL.mdSave it as .claude/skills/extension-development/SKILL.md (or your agent's skills folder).
name
extension-development
description
Build, install, and hot-reload Nimbalyst extensions using MCP tools. Use when developing, testing, or iterating on Nimbalyst extensions.

Extension Development in Nimbalyst

Nimbalyst provides MCP tools for building, installing, and hot-reloading extensions directly from within the running app. This enables rapid iteration on extension development without manually running build commands.

The recommended in-app scaffold flow uses File > New Extension Project, Developer > New Extension Project, or the Extension Developer Kit's /new-extension command. Enable Extension Dev Tools in Settings > Advanced before using the build/install workflow.

Available MCP Tools

Build Extension
mcp__nimbalyst-extension-dev__extension_build

Runs npm run build (vite build) on an extension project.

Parameters:

  • path: Absolute path to the extension project root (directory containing package.json and manifest.json)

Returns: Build output including any errors or warnings.

Install Extension
mcp__nimbalyst-extension-dev__extension_install

Installs a built extension into the running Nimbalyst instance. The extension must be built first.

Parameters:

  • path: Absolute path to the extension project root

Returns: Installation status and any validation warnings.

Hot Reload Extension
mcp__nimbalyst-extension-dev__extension_reload

Rebuilds and reinstalls an extension in one step. This is the most common tool for iterating on extension development.

Parameters:

  • extensionId: The extension ID from manifest.json (e.g., "com.nimbalyst.my-extension")
  • path: Absolute path to the extension project root

Returns: Build and reload status.

Uninstall Extension
mcp__nimbalyst-extension-dev__extension_uninstall

Removes an installed extension from the running Nimbalyst instance.

Parameters:

  • extensionId: The extension ID to uninstall
Get Extension Status
mcp__nimbalyst-extension-dev__extension_get_status

Gets the current status of an installed extension, including whether it loaded successfully and what it contributes.

Parameters:

  • extensionId: The extension ID to query
Restart Nimbalyst
mcp__nimbalyst-extension-dev__restart_nimbalyst

Restarts the entire Nimbalyst application. Only use when explicitly requested by the user.

Testing Tools

Run Playwright Tests
mcp__nimbalyst-extension-dev__extension_test_run

Execute Playwright scripts against the running Nimbalyst instance via CDP. Supports inline scripts or .spec.ts file paths.

Parameters:

  • script: Inline Playwright code (runs inside an async test with page connected to Nimbalyst)
  • testFile: Absolute path to a .spec.ts file
  • timeout: Max execution time in ms (default: 30000)

Provide either script or testFile, not both.

Open File for Testing
mcp__nimbalyst-extension-dev__extension_test_open_file

Opens a file in Nimbalyst and waits for the editor to mount. Use before running tests that need a specific file open.

Parameters:

  • filePath: Absolute path to the file to open
  • waitForExtension: Extension ID to wait for (waits until the extension's editor container renders)
  • timeout: Max wait time in ms (default: 5000)
Test AI Tool Handler
mcp__nimbalyst-extension-dev__extension_test_ai_tool

Execute an extension's AI tool handler directly and return the result. Bypasses full MCP routing.

Parameters:

  • extensionId: The extension ID
  • toolName: Tool name without extension prefix (e.g., "get_elements")
  • args: Arguments object to pass to the handler
  • filePath: For editor-scoped tools: file path for context
Show full SKILL.md (253 more words)Show less

Development Workflow

Initial Setup
  1. Create extension project with /new-extension <path> <name> [file-patterns]
  2. Implement the extension code
  3. Build with extension_build
  4. Install with extension_install
  5. Test in Nimbalyst
Iteration Loop with Testing
  1. Make code changes
  2. Run extension_reload to rebuild and reinstall
  3. Run extension_get_status to verify it loaded
  4. Run extension_test_open_file to open a sample file
  5. Run extension_test_run with Playwright scripts to verify behavior
  6. Use capture_editor_screenshot for visual verification
  7. Check get_renderer_debug_logs for runtime errors
  8. Fix issues and repeat from step 1

Inline test example:

extension_test_run({
  script: `
    const editor = page.locator('[data-extension-id="com.nimbalyst.my-ext"]');
    await expect(editor).toBeVisible();
    await editor.locator('.save-btn').click();
    await expect(editor.locator('.status')).toHaveText('Saved');
  `
})

Test file example:

extension_test_run({ testFile: "/path/to/extension/tests/basics.spec.ts" })
Debugging
  1. Check extension status with extension_get_status
  2. Read logs with mcp__nimbalyst-extension-dev__get_main_process_logs (filter by component: "EXTENSION")
  3. Check renderer logs with mcp__nimbalyst-extension-dev__get_renderer_debug_logs

Important Notes

  • Always build before install - extension_install requires a pre-built extension
  • Use extension_reload for iteration - It combines build + reinstall in one step
  • Check manifest validation - Build and install tools validate manifest.json and report warnings
  • Extensions load on app start - For full reload, user may need to restart Nimbalyst
  • Never restart without permission - Only use restart_nimbalyst when the user explicitly asks

Common Issues

"Extension not found" after install
  • Check that the extension ID in manifest.json matches what you're querying
  • Verify the build output exists in dist/index.js
Build fails
  • Check that npm install was run in the extension directory
  • Verify vite.config.ts is properly configured
  • Check for TypeScript errors in the output
Extension doesn't appear
  • Use extension_get_status to check if it's loaded
  • Check the release channel - some extensions require "alpha" channel
  • Verify the extension is enabled in Settings > Extensions

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

Files

Just SKILL.md in packages/extensions/extension-dev-kit/claude-plugin/skills/extension-development of nimbalyst/nimbalyst.

Open the folder on GitHubat commit a3dbdb4

Compare with similar skills

Extension Development 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.

Extension Development compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Extension Development this skillnimbalyst/nimbalyst1.8k—~1.5kAutomated safety check: PassMIT
Project Pull Requestswimmwatch/cloakbrowser-mcp161—~1kAutomated safety check: PassMIT
Project Docs Maintainerswimmwatch/cloakbrowser-mcp161—~569Automated safety check: PassMIT
Browser DebuggingMadAppGang/claude-code283—~4.3kAutomated safety check: PassMIT
Project Releaseswimmwatch/cloakbrowser-mcp161—~1.9kAutomated safety check: PassMIT
Michel UI Demo RecorderPackmindHub/packmind317—~6.4kAutomated safety check: PassApache-2.0

Similar skills

  • Project Pull Request

    swimmwatch/cloakbrowser-mcp

    Create, update, prepare, or review a cloakbrowser-mcp GitHub Pull Request only when the user explicitly requests PR work.

    161 GitHub stars~1k tokensUpdated 6 days ago
    DevelopmentAuto-check passed
  • Project Docs Maintainer

    swimmwatch/cloakbrowser-mcp

    Maintain, organize, consolidate, or audit the cloakbrowser-mcp documentation set only when the user explicitly requests project documentation maintenance or an authorized public change requires it.

    161 GitHub stars~569 tokensUpdated 6 days ago
    DevelopmentAuto-check passed
  • Browser Debugging

    MadAppGang/claude-code

    Systematically tests UI functionality, validates design fidelity with AI visual analysis, monitors console output, tracks network requests, and provides debugging reports using Chrome Extension MCP…

    283 GitHub stars~4.3k tokensUpdated 6 mo ago
    DevelopmentAuto-check passed
  • Project Release

    swimmwatch/cloakbrowser-mcp

    Prepare, publish, verify, or recover a cloakbrowser-mcp release only when the user explicitly requests release work.

    161 GitHub stars~1.9k tokensUpdated 6 days ago
    Agent WorkflowsAuto-check passed
  • Michel UI Demo Recorder

    PackmindHub/packmind

    Record polished UI demo videos and screenshots of a running web app using Playwright MCP — for client deliverables, release notes, feature walkthroughs, or bug repros.

    317 GitHub stars~6.4k tokensUpdated yesterday
    Media & CreativeAuto-check passed
  • Identify and name Chrome instances connected to the Claude-in-Chrome extension under the current Claude account, and persist a stable deviceId - name mapping to a local file outside the repo.

    236 GitHub stars~1.5k tokensUpdated yesterday
    Productivity & AutomationAuto-check passed

More from nimbalyst/nimbalyst

All 14 skills in this repo
  • Knowledge Graph

    nimbalyst/nimbalyst

    Write a project's knowledge pages in Nimbalyst Pages -- record what people said and decided in the page it affects, keep typed pages for the things the team tracks (its own types, such as modules…

    1.8k GitHub stars~3.5k tokensUpdated 2 days ago
    Auto-check passed
  • Knowledge Setup

    nimbalyst/nimbalyst

    Set up or check a project's knowledge pages in Nimbalyst Pages -- install the editable "How we write this wiki" guide page, define the team's own page types (and subtypes) and the named relations…

    1.8k GitHub stars~1.8k tokensUpdated 2 days ago
    Auto-check passed
  • Canvas

    nimbalyst/nimbalyst

    Author Nimbalyst Project Canvas boards (.canvas files) — an infinite canvas whose cards are live editors for real workspace files and shared documents, arranged spatially and wired with edges.

    1.8k GitHub stars~2.6k tokensUpdated 2 days ago
    Auto-check passed
  • Datamodellm

    nimbalyst/nimbalyst

    Create visual data models for database schemas using Nimbalyst's DataModelLM editor.

    1.8k GitHub stars~713 tokensUpdated 2 days ago
    Auto-check passed
  • Excalidraw

    nimbalyst/nimbalyst

    Create diagrams and visual drawings using Excalidraw (.excalidraw files).

    1.8k GitHub stars~1.4k tokensUpdated 2 days ago
    Auto-check passed
  • Git Commit

    nimbalyst/nimbalyst

    Create git commits using Nimbalyst's interactive commit proposal widget.

    1.8k GitHub stars~696 tokensUpdated 2 days ago
    Auto-check passed

Works with

Categories

Questions about Extension Development

What does Extension Development do?

Build, install, and hot-reload Nimbalyst extensions using MCP tools. Extension Development is an agent skill from nimbalyst/nimbalyst. Build, install, and hot-reload Nimbalyst extensions using MCP tools.

When should I use Extension Development?

Extension Development fits situations like: iterating on Nimbalyst extensions; tasks that involve Browser extensions; tasks that involve MCP servers.

How do I install Extension Development in Claude Code?

Run `npx skills add nimbalyst/nimbalyst --skill extension-development -a claude-code`. Or copy the skill folder (packages/extensions/extension-dev-kit/claude-plugin/skills/extension-development in nimbalyst/nimbalyst) into .claude/skills/extension-development in your project. Claude Code loads it when a task matches its description.

How do I install Extension Development in Codex?

Run `npx skills add nimbalyst/nimbalyst --skill extension-development -a codex`. Or copy the skill folder (packages/extensions/extension-dev-kit/claude-plugin/skills/extension-development in nimbalyst/nimbalyst) into .agents/skills/extension-development in your project. Codex loads it when a task matches its description.

Can I use Extension Development 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 nimbalyst/nimbalyst --skill extension-development -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/extension-development, .gemini/skills/extension-development, .github/skills/extension-development and .opencode/skills/extension-development in your project.

What does Extension Development need to run?

Going by SKILL.md and its folder, Extension Development needs the command-line tools its instructions call (npm). Our summary lists: Node.js.

Does Extension Development access the network?

SKILL.md contains no URLs. Its commands use npm, which can reach the network depending on how they are called. This is read from the text; nothing was executed.

Is Extension Development 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. Review the folder before installing.

What licence does Extension Development use?

Extension Development is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Extension Development use?

About 1.5k tokens (SKILL.md is roughly 6.2k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Extension Development?

Skills that share tags, products or a category with Extension Development: Project Pull Request (swimmwatch/cloakbrowser-mcp, 161 stars), Project Docs Maintainer (swimmwatch/cloakbrowser-mcp, 161 stars), Browser Debugging (MadAppGang/claude-code, 283 stars) and Project Release (swimmwatch/cloakbrowser-mcp, 161 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Extension Development?

nimbalyst (a GitHub organization) maintains it in nimbalyst/nimbalyst, which has 1,847 GitHub stars. The repository holds 14 skills in this directory. The repository was last updated on October 5, 2026.

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