Add flutter-app-runtime skill for runtime inspection MCP tools - #230
Add flutter-app-runtime skill for runtime inspection MCP tools#230jwren wants to merge 1 commit into
Conversation
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request introduces a new skill, flutter-app-runtime, which enables interaction with running Dart and Flutter applications using Dart MCP server tools. The changes include adding the skill to the README, defining its configuration in flutter_skills.yaml, and creating a comprehensive guide in SKILL.md. The feedback recommends adding a trailing newline to the end of flutter_skills.yaml to ensure POSIX compatibility.
| resources: | ||
| - https://docs.flutter.dev/ai/mcp-server | ||
| - https://docs.flutter.dev/ai/get-started | ||
| - https://docs.flutter.dev/tools/hot-reload No newline at end of file |
There was a problem hiding this comment.
The file does not end with a trailing newline. It is a standard practice to end all text files with a newline character to ensure compatibility with POSIX tools and avoid diff warnings.
- https://docs.flutter.dev/tools/hot-reload
03b4e18 to
fe246ac
Compare
Add the `flutter-app-runtime` skill to provide runtime application discovery, live widget inspection, layout/error diagnostics, and proactive hot reloading via the Dart MCP server. This skill provides the runtime management workflows referenced by the proactive Flutter hot reload rule introduced in flutter#228 (rules/flutter-app-runtime.md). While the rule triggers upon `.dart` file modifications, this skill also equips agents to handle non-edit observational queries about the running application without falling back to static source code assumptions. Key capabilities and workflows added: - Live UI & Hierarchy Inspection: Query the live widget tree via `widget_inspector` (`get_widget_tree`), supporting `summaryOnly: false` to inspect exact immediate parent widgets and framework styling wrappers, and `summaryOnly: true` for user code structure. - Layout Overflow & Error Diagnostics: Check for active `RenderFlex` overflows and framework exceptions using `get_runtime_errors` and inspect render box constraints. - Proactive Hot Reload / Hot Restart: Execute `hot_reload` on UI modifications or `hot_restart` on foundational state/initialization changes, followed by verifying runtime stability. - Application Discovery: Discover and connect to active instances via `dtd` (`listDtdUris`, `connect`, `listConnectedApps`) with clear fallback handling when no running app is connected. Related: - Companion rule: flutter#228 - Supersedes: flutter#221
fe246ac to
34d5533
Compare
| - https://docs.flutter.dev/data-and-backend/serialization/json No newline at end of file | ||
| - https://docs.flutter.dev/data-and-backend/serialization/json | ||
| - name: flutter-app-runtime | ||
| description: "Interacts with running Dart and Flutter applications via Dart MCP server tools (widget_inspector, dtd, get_runtime_errors, hot_reload, hot_restart) to inspect live widget trees, diagnose layout clipping and runtime errors, and execute proactive hot reloads. Use when answering questions about the active screen, inspecting widget structure, styling, or colors, checking for runtime overflows, debugging errors, or modifying UI widgets in a running app." |
There was a problem hiding this comment.
Use when answering questions about the active screen, inspecting widget structure, styling, or colors, checking for runtime overflows, debugging errors, or modifying UI widgets in a running app."
This is a lot of different user journeys crammed into one skill:
- inspect the running application
- debug runtime errors
- editing UI code
Is there a reason we aren't addressing each of these user journeys separately?
| ## Prerequisites | ||
| Ensure the Dart and Flutter MCP server is configured and active. This skill relies on the Dart Tooling Daemon (DTD) and associated MCP tools to interact with running application instances. | ||
|
|
||
| ## Application Discovery |
There was a problem hiding this comment.
The dtd tool itself already contains all these instructions, so this really should not be necessary. We may need something to just encourage it to look at the tool at all, but the specific instructions for how to use it shouldn't be needed (and also will be more up to date when read from the actual tool description/schema).
3 participants
Add the
flutter-app-runtimeskill to provide runtime application discovery,live widget inspection, layout/error diagnostics, and proactive hot reloading
via the Dart MCP server.
This skill provides the runtime management workflows referenced by the proactive
Flutter hot reload rule introduced in #228 (rules/flutter-app-runtime.md). While
the rule triggers upon
.dartfile modifications, this skill also equips agentsto handle non-edit observational queries about the running application without
falling back to static source code assumptions.
Key capabilities and workflows added:
widget_inspector(
get_widget_tree), supportingsummaryOnly: falseto inspect exact immediateparent widgets and framework styling wrappers, and
summaryOnly: truefor usercode structure.
RenderFlexoverflows andframework exceptions using
get_runtime_errorsand inspect render box constraints.hot_reloadon UI modifications orhot_restarton foundational state/initialization changes, followed byverifying runtime stability.
dtd(
listDtdUris,connect,listConnectedApps) with clear fallback handlingwhen no running app is connected.
Related: