What is the Live Debug skill used for?

It is a specialized capability for Claude Code to automate Chrome browser interactions for debugging the live application at home.st44.no.

Can this skill capture visual evidence of bugs?

Yes, it can take high-resolution screenshots and record GIFs of user flows to document exactly how a bug occurs in the production environment.

Can I monitor API calls and console errors?

Absolutely. The skill includes tools to read network requests, filter by URL patterns, and capture console messages to identify failing backend calls or script errors.

Does it support authenticated sessions?

Yes, the skill can navigate to login pages, interact with form fields, and utilize existing browser sessions to debug authenticated areas of the site.

How do I find specific elements on the page?

You can use the 'find' tool to locate elements using natural language descriptions or use 'read_page' to view the full interactive accessibility tree of the site.

Live Production Debugger

Name: Live Production Debugger
Author: tidemann

bytidemann

浏览器自动化

Debugs and inspects the live production environment of home.st44.no using automated Chrome browser tools.

关于

The Live Debug skill provides a powerful suite of browser automation tools specifically tailored for troubleshooting the production environment at home.st44.no. It enables developers to capture visual state through screenshots and GIFs, inspect the accessibility tree, monitor live network requests, and execute JavaScript directly within the browser context. This skill is essential for reproducing production-only bugs, verifying deployments, and gaining a deep understanding of current UI behavior and data flow without leaving the Claude environment.

主要功能

Custom JavaScript execution for state and component analysis
Automated Chrome browser navigation and interaction
Natural language element searching and accessibility tree inspection
0 GitHub stars
Visual bug tracking with screenshots and GIF recording
Real-time monitoring of network requests and console logs

使用场景

Verifying feature parity and successful deployment after shipping code
Analyzing live user flows and network activity to identify performance bottlenecks
Investigating and documenting visual discrepancies or UI bugs in production

关于

主要功能

Custom JavaScript execution for state and component analysis
Automated Chrome browser navigation and interaction
Natural language element searching and accessibility tree inspection
0 GitHub stars
Visual bug tracking with screenshots and GIF recording
Real-time monitoring of network requests and console logs

使用场景

Verifying feature parity and successful deployment after shipping code
Analyzing live user flows and network activity to identify performance bottlenecks
Investigating and documenting visual discrepancies or UI bugs in production