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

0•

ブラウザ自動化

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.

主な機能

01Custom JavaScript execution for state and component analysis

02Automated Chrome browser navigation and interaction

03Natural language element searching and accessibility tree inspection

040 GitHub stars

05Visual bug tracking with screenshots and GIF recording

06Real-time monitoring of network requests and console logs

ユースケース

01Verifying feature parity and successful deployment after shipping code

02Analyzing live user flows and network activity to identify performance bottlenecks

03Investigating and documenting visual discrepancies or UI bugs in production

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add tidemann/st44-home live-debug

For use in Claude.ai and ChatGPT

Download Skill