Debug Mode
doraemonkeys/claude-code-debug-mode
Interactive debugging mode that generates hypotheses, instruments code with runtime logs, and iteratively fixes bugs with human-in-the-loop verification.
Guidelines and step-by-step workflow for debugging DevTools extensions locally, including stub mode, fixed-port launching, browser auto-opening, URL query parameters, target app connection, and…
Install Debugging Devtools Extensions
$ npx skills add flutter/devtools --skill debugging-devtools-extensions -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install flutter/devtools debugging-devtools-extensions --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/flutter/devtools.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/debugging-devtools-extensions .claude/skills/debugging-devtools-extensions && rm -rf skills-srcUse ~/.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/
Install the "debugging-devtools-extensions" agent skill from https://github.com/flutter/devtools/tree/master/.agents/skills/debugging-devtools-extensions into .claude/skills/debugging-devtools-extensions/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "debugging-devtools-extensions", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/flutter/devtools/tree/master/.agents/skills/debugging-devtools-extensionsType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add flutter/devtools --skill debugging-devtools-extensions -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install flutter/devtools debugging-devtools-extensions --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/flutter/devtools.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/debugging-devtools-extensions .agents/skills/debugging-devtools-extensions && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "debugging-devtools-extensions" agent skill from https://github.com/flutter/devtools/tree/master/.agents/skills/debugging-devtools-extensions into .agents/skills/debugging-devtools-extensions/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "debugging-devtools-extensions", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add flutter/devtools --skill debugging-devtools-extensions -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install flutter/devtools debugging-devtools-extensions --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/flutter/devtools.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/debugging-devtools-extensions .cursor/skills/debugging-devtools-extensions && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "debugging-devtools-extensions" agent skill from https://github.com/flutter/devtools/tree/master/.agents/skills/debugging-devtools-extensions into .cursor/skills/debugging-devtools-extensions/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "debugging-devtools-extensions", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/flutter/devtools.git --path .agents/skills/debugging-devtools-extensions--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add flutter/devtools --skill debugging-devtools-extensions -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install flutter/devtools debugging-devtools-extensions --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/flutter/devtools.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/debugging-devtools-extensions .gemini/skills/debugging-devtools-extensions && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "debugging-devtools-extensions" agent skill from https://github.com/flutter/devtools/tree/master/.agents/skills/debugging-devtools-extensions into .gemini/skills/debugging-devtools-extensions/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "debugging-devtools-extensions", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install flutter/devtools debugging-devtools-extensionsInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add flutter/devtools --skill debugging-devtools-extensions -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/flutter/devtools.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/debugging-devtools-extensions .github/skills/debugging-devtools-extensions && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "debugging-devtools-extensions" agent skill from https://github.com/flutter/devtools/tree/master/.agents/skills/debugging-devtools-extensions into .github/skills/debugging-devtools-extensions/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "debugging-devtools-extensions", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add flutter/devtools --skill debugging-devtools-extensions -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install flutter/devtools debugging-devtools-extensions --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/flutter/devtools.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/debugging-devtools-extensions .opencode/skills/debugging-devtools-extensions && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "debugging-devtools-extensions" agent skill from https://github.com/flutter/devtools/tree/master/.agents/skills/debugging-devtools-extensions into .opencode/skills/debugging-devtools-extensions/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "debugging-devtools-extensions", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
debugging-devtools-extensions- GitHub stars
- 1.7k
- Token cost
- ~839 tokens
- SKILL.md length
- 319 words
- Files
- 1
- Skills in repo
- 10
- Repo updated
- First seen
- Licence
- BSD-3-Clause
At a glance
Guidelines and step-by-step workflow for debugging DevTools extensions locally, including stub mode, fixed-port launching, browser auto-opening, URL query parameters, target app connection, and…
- Works in 4 steps: Local Stub Extensions Mode (No Server… → Automated Launch & Browser Navigation → Connecting to an End-User Target App → …
- Testing DevTools extension behavior
- SKILL.md covers 1. Local Stub Extensions Mode…, 2. Automated Launch & Browser…, 3. Connecting to an End-User… and 4. Human Interaction & User…
- Calls flutter
What it does
Debugging Devtools Extensions is an agent skill from flutter/devtools. Guidelines and step-by-step workflow for debugging DevTools extensions locally, including stub mode, fixed-port launching, browser auto-opening, URL query parameters, target app connection, and human-in-the-loop interaction. Use when debugging or testing DevTools extension behavior.
Its SKILL.md is about 840 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 Debugging and Human-in-the-loop approvals. It works with Flutter. The repository describes itself as: Developer tools for Flutter & Dart. The licence is BSD-3-Clause.
When your agent uses it
- Testing DevTools extension behavior
- Tasks that involve Debugging
- Tasks that involve Human-in-the-loop approvals
Example prompts
- “Use the debugging-devtools-extensions skill to guideline and step-by-step workflow for debugging DevTools extensions locally, including stub mode…”
- “/debugging-devtools-extensions”
Workflow steps
4 steps, taken from the step headings in SKILL.md.
What it can do on your machine
Read from SKILL.md and the folder at commit 3a3b64a. 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:
flutter
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
Debugging Devtools Extensions loads about 839 tokens when it runs. Until then it costs about 78 tokens; SKILL.md has 319 words of instructions outside code blocks.
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 flutter/devtools at commit 3a3b64a, republished under its BSD-3-Clause licence (© flutter). 319 words, ~839 tokens.
Download SKILL.mdSave it as
.claude/skills/debugging-devtools-extensions/SKILL.md (or your agent's skills folder).- name
- debugging-devtools-extensions
- description
- Guidelines and step-by-step workflow for debugging DevTools extensions locally, including stub mode, fixed-port launching, browser auto-opening, URL query parameters, target app connection, and human-in-the-loop interaction. Use when debugging or testing DevTools extension behavior.
Debugging DevTools Extensions
Follow this workflow to test and debug DevTools extensions locally.
1. Local Stub Extensions Mode (No Server Needed)
When running DevTools in standalone web mode (flutter run -d chrome), DevTools does not run the devtools_server backend by default. To test extensions without a running server backend:
- Open
packages/devtools_app/lib/src/shared/development_helpers.dart. - Set
const _debugDevToolsExtensions = true;.
[!WARNING] Never commit
_debugDevToolsExtensions = true;to git. A repository unit test (development_helpers_test.dart) enforces that this flag remainsfalse.
Activating stub mode registers the following mock extensions:
foo_ext(package:foo)bar_ext(package:bar)provider_ext(package:provider)
2. Automated Launch & Browser Navigation
The agent can automate running DevTools AND launching the browser directly to the target URL:
Step 2a: Launch DevTools on a Fixed Port
In packages/devtools_app, launch DevTools specifying a fixed --web-port:
flutter run -d chrome --web-port=52941Step 2b: Open Browser to Target URL Automatically
Use the system OS open command to launch Chrome/browser directly to the desired test URL:
- macOS:
open "http://localhost:52941/foo_ext?embedMode=one" - Linux:
xdg-open "http://localhost:52941/foo_ext?embedMode=one" - Windows:
start "http://localhost:52941/foo_ext?embedMode=one"
3. Connecting to an End-User Target App
To test against real pub package extensions:
- Run the sample app in
packages/devtools_extensions/example/app_that_uses_foo:bash cd packages/devtools_extensions/example/app_that_uses_foo flutter run -d chrome - Ask the user to copy/paste the VM Service URI from the terminal output (e.g.
ws://127.0.0.1:8181/xxx=/ws). - Open the browser automatically with the
uriparameter using the appropriate OS command (as described in Step 2b):- macOS:
open "http://localhost:52941/foo_ext?embedMode=one&uri=<VM_SERVICE_URI>" - Linux:
xdg-open "http://localhost:52941/foo_ext?embedMode=one&uri=<VM_SERVICE_URI>" - Windows:
start "http://localhost:52941/foo_ext?embedMode=one&uri=<VM_SERVICE_URI>"
- macOS:
4. Human Interaction & User Prompting Steps
When an AI agent is performing this workflow:
- Obtaining VM Service URI: When connecting to a target app, ask the user to provide the VM Service URI printed in the target app's console output (using
ask_questionor a direct prompt). - Automated Browser Opening: The agent should launch DevTools and execute the appropriate OS command (
open,xdg-open, orstartas described in Step 2b) to launch the browser automatically. - Manual Visual Verification: Ask the user to inspect the opened browser window and confirm whether the expected extension UI or behavior is visible.
© flutter, BSD-3-Clause. 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 .agents/skills/debugging-devtools-extensions of flutter/devtools.
Open the folder on GitHubat commit 3a3b64a
Compare with similar skills
Debugging Devtools Extensions 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.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Debugging Devtools Extensions this skillflutter/devtools | 1.7k | — | ~839 | Automated safety check: Pass | BSD-3-Clause | |
| Debug Modedoraemonkeys/claude-code-debug-mode | 117 | — | ~1.3k | Automated safety check: Pass | MIT | |
| iOS ImplementMacMagazine/app-iOS | 171 | — | ~741 | Automated safety check: Pass | None | |
| Grix Code Reviewaskie/grix | 153 | — | ~799 | Automated safety check: Pass | Custom licence | |
| Frb Issue To Green PRfzyzcjy/flutter_rust_bridge | 5.4k | — | ~1.8k | Automated safety check: Pass | MIT | |
| Refactorsd0xdev/sd0x-harness | 192 | — | ~3k | Automated safety check: Notes | MIT |
Similar skills
iOS Implement
MacMagazine/app-iOS
Complete feature-implementation workflow for MacMagazine with pattern matching, review gates, and quality verification.
Grix Code Review
askie/grix
Audit Grix diffs and pull requests for correctness, regressions, security, lifecycle safety, and cross-component contract consistency.
Frb Issue To Green PR
fzyzcjy/flutter_rust_bridge
A skill your agent uses when implementing a GitHub issue, bug fix, or feature in flutterrustbridge end-to-end: develop the change, add regression coverage, prepare and open a PR, and use the user's…
Refactor
sd0xdev/sd0x-harness
Multi-target refactoring orchestrator. An agent skill from sd0xdev/sd0x-harness.
Bug Fix
sd0xdev/sd0x-harness
Bug fix workflow. An agent skill from sd0xdev/sd0x-harness.
More from flutter/devtools
All 10 skills in this repoAdding Release Notes
flutter/devtools
Adds user-facing change descriptions to DevTools release notes.
Adding Copyright Headers
flutter/devtools
Adds copyright headers to files based on file type. An agent skill from flutter/devtools.
Reviewing PRs
flutter/devtools
General workflow for fetching, inspecting, reviewing GitHub Pull Requests using the gh CLI, drafting user-aligned review comments, and securing approval before posting.
Closing Obsolete Issues
flutter/devtools
Find and close obsolete, stale, or not reproducible issues in the flutter/devtools repository.
Reviewing Devtools PRs
flutter/devtools
DevTools repository-specific PR review workflow enforcing DevTools style guidelines and common review patterns.
Adding Changelog Entries
flutter/devtools
A skill your agent uses when documenting changes in CHANGELOG.md files for devtoolsshared, devtoolsappshared, or devtoolsextensions.
Related
Works with
Categories
Questions about Debugging Devtools Extensions
What does Debugging Devtools Extensions do?
Guidelines and step-by-step workflow for debugging DevTools extensions locally, including stub mode, fixed-port launching, browser auto-opening, URL query parameters, target app connection, and…. Debugging Devtools Extensions is an agent skill from flutter/devtools. Guidelines and step-by-step workflow for debugging DevTools extensions locally, including stub mode, fixed-port launching, browser auto-opening, URL query parameters, target app connection, and human-in-the-loop interaction.
When should I use Debugging Devtools Extensions?
Debugging Devtools Extensions fits situations like: testing DevTools extension behavior; tasks that involve Debugging; tasks that involve Human-in-the-loop approvals.
How do I install Debugging Devtools Extensions in Claude Code?
Run `npx skills add flutter/devtools --skill debugging-devtools-extensions -a claude-code`. Or copy the skill folder (.agents/skills/debugging-devtools-extensions in flutter/devtools) into .claude/skills/debugging-devtools-extensions in your project. Claude Code loads it when a task matches its description.
How do I install Debugging Devtools Extensions in Codex?
Run `npx skills add flutter/devtools --skill debugging-devtools-extensions -a codex`. Or copy the skill folder (.agents/skills/debugging-devtools-extensions in flutter/devtools) into .agents/skills/debugging-devtools-extensions in your project. Codex loads it when a task matches its description.
Can I use Debugging Devtools Extensions 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 flutter/devtools --skill debugging-devtools-extensions -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/debugging-devtools-extensions, .gemini/skills/debugging-devtools-extensions, .github/skills/debugging-devtools-extensions and .opencode/skills/debugging-devtools-extensions in your project.
What does Debugging Devtools Extensions need to run?
Going by SKILL.md and its folder, Debugging Devtools Extensions needs the command-line tools its instructions call (flutter).
Does Debugging Devtools Extensions 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 Debugging Devtools Extensions 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 Debugging Devtools Extensions use?
Debugging Devtools Extensions is published under the BSD-3-Clause licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does Debugging Devtools Extensions use?
About 839 tokens (SKILL.md is roughly 3.4k 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 Debugging Devtools Extensions?
Skills that share tags, products or a category with Debugging Devtools Extensions: Debug Mode (doraemonkeys/claude-code-debug-mode, 117 stars), iOS Implement (MacMagazine/app-iOS, 171 stars), Grix Code Review (askie/grix, 153 stars) and Frb Issue To Green PR (fzyzcjy/flutter_rust_bridge, 5.4k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Debugging Devtools Extensions?
flutter (a GitHub organization) maintains it in flutter/devtools, which has 1,732 GitHub stars. The repository holds 10 skills in this directory. The repository was last updated on October 7, 2026.
Source: flutter/devtools on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.