Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add skills/jpoutrin/product-forge/console-debuggingnpx skills add jpoutrin/product-forge --skill console-debugginggit clone --depth 1 https://github.com/jpoutrin/product-forgeWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/jpoutrin/product-forge/console-debugging)<a href="https://agentmods.dev/skills/jpoutrin/product-forge/console-debugging"><img src="https://agentmods.dev/badge/skills/jpoutrin/product-forge/console-debugging.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00037 | $0.01371 |
| Opus 5 | $0.00018 | $0.00685 |
| Sonnet 5 | $0.00007 | $0.00274 |
| Haiku 4.5 | $0.00004 | $0.00137 |
Grade A, and why
console-debugging scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 200 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Console Debugging Skill
Systematic approach to analyzing browser console messages using Chrome DevTools MCP.
Console Message Categories
Error Messages (Highest Priority)
| Type | Example | Typical Cause |
|---|---|---|
| JavaScript Error | Uncaught TypeError: Cannot read property 'x' of undefined |
Null reference |
| Network Error | Failed to load resource: net::ERR_CONNECTION_REFUSED |
API unavailable |
| CORS Error | Access-Control-Allow-Origin |
Backend configuration |
| CSP Error | Content Security Policy |
Security restriction |
| Syntax Error | SyntaxError: Unexpected token |
Invalid JavaScript |
| Reference Error | ReferenceError: x is not defined |
Undefined variable |
Warning Messages (Medium Priority)
| Type | Example | Action |
|---|---|---|
| Deprecation | 'componentWillMount' is deprecated |
Plan migration |
| Performance | Long task took 200ms |
Optimize |
| Security | Insecure form submission |
Fix HTTPS |
| Mixed Content | Mixed Content: loading HTTP on HTTPS |
Update resource URLs |
Info/Log Messages (Context)
| Type | Purpose |
|---|---|
| Debug output | Developer console.log statements |
| Library info | Framework initialization messages |
| Analytics | Tracking events |
| State changes | Application state updates |
Analysis Workflow
1. Collect Console Messages
Use Chrome DevTools MCP to list all console messages:
Tool: mcp__chrome-devtools__list_console_messages
Parameters: { "level": "error" } // or "warning", "info", "debug"
2. Filter by Severity
Start with errors, then warnings:
- Errors first - These break functionality
- Warnings second - These indicate problems
- Info last - These provide context
3. Group by Source
Categorize errors by their origin:
- Application code - Your own JavaScript
- Third-party libraries - External dependencies
- Browser/extension - Not your code
- Network - API/resource failures
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 2d ago First seen · 200 lines · 37 tokens per session scan A b096ce06e119
console-debugging is a skill published in the GitHub repository jpoutrin/product-forge (15 stars, last pushed 6mo ago), licensed MIT. It adds 37 tokens to every session and 1,371 once invoked, about $0.0002 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-09-03.
Other skills, from other repositories
fixing-motion-performance
Audit and fix animation performance issues including layout thrashing, compositor properties, scroll-linked motion, and blur effects. Use when animations stutter, transitions jank, or reviewing CSS/JS animation performance.
optimize-web-animations
Profile, audit, and optimize frontend page performance with emphasis on animation work, memory-leak risks, long-session slowdowns, CSS animations, canvas/WebGL requestAnimationFrame loops, marquees, skeletons, GSAP/Three/Matter effects, timers, listeners, and observers. Use when the user asks to make animations…
weapp-tailwindcss-troubleshoot
诊断 weapp-tailwindcss 与 weapp-tw CLI 的样式未生成、JS/模板 class 未转译、classNameSet、@source/cssEntries、source candidates、rpx、伪类/custom variant、组件隔离、Rspack、压缩、watch/HMR、H5/Web/App/uni-app x 多端产物问题。Use for debugging, troubleshooting, CLI output failures, classes not working, broken hot reload, wrong output, or runtime…
performance-audit
Performance audit — bundle size, image opt, lazy load, code split, caching, CWV. Deep-dive for /launch-check performance.
web-animation-perf
Prevent layout/transition/reflow thrash in JS-driven CSS animations. Use when building or debugging continuous motion (rotation, orbit, parallax, scroll-linked effects, marquee, carousels) and when symptoms appear like jank, stutter, lag, animation drift, ghosting, "elements collapsing toward center", "going slow"…
guidance-webgpu-performance
Diagnose and improve browser WebGPU rendering performance, including frame pacing, draw and state-submission overhead, buffer uploads, shaders, and JavaScript work on the render critical path. Use for slow or stuttering GPU-backed interfaces, rendering regressions, CPU/GPU bottleneck analysis, or renderer performance…