studio-chrome-devtools

Connect Chrome DevTools to the Studio Electron app for debugging.

3|Updated Apr 6, 2026
One-click install
npx skills add https://github.com/instrument-org/instrument --skill studio-chrome-devtools
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: studio-chrome-devtools
Source: https://github.com/instrument-org/instrument/tree/main/.agents/skills/studio-chrome-devtools
Command: npx skills add https://github.com/instrument-org/instrument --skill studio-chrome-devtools

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill provides a guide to connect Chrome DevTools with the Studio Electron app, enabling users to debug and interact with the app's internal pages and components.

Core Features & Use Cases

  • Chrome DevTools Integration: Connect and interact with Chrome DevTools from the Studio Electron app.
  • Remote Debugging Endpoint: Use a remote debugging endpoint to debug the app.
  • Page Selection and Snapshots: Select and snapshot specific pages within the app for debugging purposes.
  • Script Evaluation: Evaluate JavaScript code on selected pages for debugging.
  • Use Case: For developers working on the Studio Electron app, this skill helps in debugging and verifying the behavior of the app's internal pages.

Quick Start

Run the script to connect Chrome DevTools to the Studio Electron app and list available pages.

bash .agents/skills/studio-chrome-devtools/scripts/connect-cli.sh

Frequently Asked Questions about studio-chrome-devtools

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I debug the Studio Electron app with Chrome DevTools?

To debug the Studio Electron app with Chrome DevTools, you connect to a remote debugging endpoint using a CLI script, which allows you to inspect and interact with internal pages.

Can I evaluate JavaScript on internal pages of a Studio Electron app?

Yes, you can evaluate JavaScript on internal pages of a Studio Electron app by connecting Chrome DevTools through the provided remote debugging endpoint and script evaluation tools.

What's the best way to snapshot specific pages in a Studio Electron app?

The best way to snapshot specific pages in a Studio Electron app is to use the Chrome DevTools integration, which provides page selection and snapshotting capabilities for debugging purposes.

Does the Studio Electron app support remote debugging?

Yes, the Studio Electron app supports remote debugging by exposing a remote debugging endpoint that Chrome DevTools connects to for inspecting and evaluating internal pages.

How do I list available pages for debugging in the Studio Electron app?

To list available pages for debugging in the Studio Electron app, run the provided connect-cli.sh script, which connects Chrome DevTools and returns the accessible internal pages.

When do I need to use remote debugging for a Studio Electron app?

You need to use remote debugging for a Studio Electron app when you want to inspect internal components, evaluate scripts, or snapshot pages that are not accessible through standard web browser developer tools.