coding-agents
Test Electron Apps with an Agent Skill for Hubble
Learn how the test-desktop-app skill lets AI agents inspect, click, and screenshot a real Electron app via CDP.
Where this fits
You're building the Hubble note-taking app and need to verify that a real note edit actually sticks in the desktop client. Clicking through a file picker, waiting for renders, and checking DOM state manually is slow—especially when the agent can't see the window. The test-desktop-app skill from bholmesdev/hubble.md solves this by giving your agent direct access to the running Electron renderer through the Chrome DevTools Protocol.
Why agents benefit
- Drive the real app, not a mock: The skill boots the dev server with CDP enabled, so the agent interacts with the actual production code path—no simulated clicks or stubbed APIs.
- Inspect and mutate DOM state: Agents can evaluate JavaScript in the renderer, read note editor contents, and verify that changes persist after a save.
- Click controls and navigate iframes: CDP commands handle complex interactions like custom toolbars or embedded editors that Computer Use often fumbles.
- Capture screenshots from the renderer: Perfect for visual regression or for the agent to "see" what the user sees before making a decision.
- Clean teardown: The skill includes a stop step that kills the dev server and checks for lingering
Hubble Devprocesses, preventing zombie instances.
Practical scenarios
Verifying a note edit after a keyboard shortcut
Your agent types a markdown note, presses Cmd+S, and then uses CDP to read the editor's innerText. It confirms the note content matches what was saved, then takes a screenshot to check formatting.
Inspecting iframe-based plugins
Some Hubble views render inside an iframe. The skill shows how to fetch the page list, connect to the right webSocketDebuggerUrl, and switch execution context to the iframe—then assert that a plugin's UI updated correctly.
Debugging a flaky UI test
Instead of guessing why a test failed, the agent uses CDP to evaluate document.querySelector('.note-editor')?.innerHTML and logs the exact state. This turns a black-box failure into a specific DOM assertion.
Add it to your agent workflow
Install the skill with:
npx skills add bholmesdev/hubble.md --skill test-desktop-app
Then instruct your agent to follow the README steps. A minimal usage prompt: "Use the test-desktop-app skill to launch Hubble, then connect via CDP and verify that the note title updates after editing." The skill handles the server startup, CDP connection, and cleanup.
Compare before adopting
Before you commit, compare this skill against other testing approaches: check the repo's last commit date and open issues for maintenance freshness. Alternatives like Playwright's Electron support or raw CDP scripts may fit if you need cross-app coverage. Also weigh the skill's narrow scope—it's tuned for Hubble's dev setup, so it won't generalize to other Electron apps without adaptation.
Why it is worth tracking
With 1,386 stars and an active author, this skill shows real community traction. It's a concrete example of an agent skill that bridges the gap between headless automation and a real GUI. Track it if you're building Electron apps or want a reference pattern for CDP-driven agent testing. For more agent-skill discoveries, see OpenAgentSkill's listing. Evaluate it when your agent needs reliable, introspection-heavy desktop testing beyond simple mouse clicks.
Featured Skill
test-desktop-app
Skill by bholmesdev