skills.rest
mattothomas
mattothomasCOMMUNITY
Explore all skills by this author →
GitHub

connect-chrome

Connect Claude to a headed Chrome window with the Side Panel extension auto-loaded.

Updated Mar 28, 2026
Search Tags:#automation#playwright#chrome#browser-control#side-panel#headful#gstack
One-click install
npx skills add https://github.com/mattothomas/sp26_hackpsu --skill connect-chrome-mattothomas
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: connect-chrome
Source: https://github.com/mattothomas/sp26_hackpsu/tree/main/.claude/skills/gstack/connect-chrome
Command: npx skills add https://github.com/mattothomas/sp26_hackpsu --skill connect-chrome-mattothomas

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Claude needs a reliable bridge to interact with a real Chrome browser in a controllable environment for demonstrations, debugging, and automation, without manual setup steps.

Core Features & Use Cases

  • Headed Chrome control: Claude drives a real browser window with live activity feed in the Side Panel.
  • Auto-loaded extension: Side Panel extension is loaded automatically for visibility.
  • Use Case: Demonstrations, debugging, and live automation workflows.

Quick Start

Ask Claude to connect to a visible Chrome window with the Side Panel extension loaded and begin watching actions in real time.

Frequently Asked Questions about connect-chrome

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

FAQPage Schema
How do I control a headed Chrome window with Playwright for live debugging?▼

Headed Chrome control is established by connecting Claude to a visible browser window using gstack, which launches Playwright and auto-loads the Side Panel extension for real-time observation of automation actions.

Can I automate browser interactions and see the Side Panel activity feed in real time?▼

Yes, the Side Panel extension is auto-loaded into the headed Chrome window, enabling you to watch live activity feeds and interact with the side panel during step-by-step guided browser automation workflows.

What is the best way to set up a visible Chrome environment for live demonstrations?▼

The setup uses gstack to launch a headed Chrome instance with the Side Panel extension loaded automatically, handling pre-flight cleanup and providing step-by-step connect and verify guidance for reliable demonstrations.

Do I need any dependencies installed to connect Claude to a visible Chrome browser?▼

No external dependencies are required to use this Skill, as it relies on the built-in gstack framework to manage the Playwright launch, pre-flight cleanup, and Side Panel extension auto-loading.

Why does my browser automation not show up in the Chrome Side Panel during setup?▼

If the Side Panel is not visible, ensure the connection is established through gstack, which performs pre-flight cleanup and auto-loads the extension to guarantee side-panel interaction across all setup steps.

Does this approach support recording telemetry and usage analytics during browser automation?▼

Yes, the functional requirements include recording telemetry and usage analytics, capturing data during the headed Chrome automation, demonstrations, and side-panel interactions across all steps.

Related Skills

Explore More Software Engineering Skills→
huichenhuichen

connect-chrome

Launch headed Chrome with the Side Panel extension via gstack on port 34567.

Community
Advanced
marquesfelipmarquesfelip

customer-offboarding

Automate end-to-end customer offboarding workflows for SaaS platforms.

Community
Advanced
timurgaleevtimurgaleev
5

open-browser

Launch vibestack Browser with a live activity feed and side-panel extension.

Community
Advanced
ArabelaTsoArabelaTso
142

playwright-automation

Automate browser navigation, interaction, and data extraction with Playwright.

Community
Intermediate