websocket-devtools-extension

Official

Debug WebSockets with message simulation

AuthorAradotso
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill removes the frustration of debugging WebSocket failures by letting you observe, reproduce, and test message behavior directly inside the browser DevTools.

Core Features & Use Cases

  • Real-time WebSocket monitoring: Captures WebSocket connections and all sent/received messages with timestamps, sizes, and state changes so you never miss activity.
  • Message simulation: Sends custom client→server or server→client messages to test your handlers without modifying application code.
  • Traffic blocking: Intercepts and blocks messages (including pattern-based rules) to validate reconnection logic, timeouts, retries, and error handling.
  • Favorites for repeatable tests: Saves common messages and scenarios so teams can quickly replay complex debugging flows.

Quick Start

Install the extension, open a page that uses WebSockets, then use the WebSocket DevTools panel to monitor traffic and send a simulated message to reproduce the bug.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: websocket-devtools-extension
Download link: https://github.com/Aradotso/devtools-skills/archive/main.zip#websocket-devtools-extension

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.