Repository files navigation

1. VisitChrome Web Store
2. Click"Add to Chrome" and confirm installation
3. Open DevTools (F12) →"WebSocket DevTools" tab

1. VisitMicrosoft Edge Add-ons
2. Click"Get" and confirm installation
3. Open DevTools (F12) →"WebSocket DevTools" tab

• 🌐WebSocket DevTools - Official website with documentation and demos
• 📺YouTube Video - Demo video

• 🔄 Background Monitoring - Continuously monitor connections even when DevTools panel is closed
• 🎮 Message Simulation - Send custom messages in both directions (Client ↔ Server)
• 🚧 Traffic Control - Block messages and simulate network issues for testing
• 💾 Favorites System - Save and organize frequently used messages
• 🎨 DevTools Integration - Native Chrome DevTools panel experience
• 🖼️ Iframe Support - Full WebSocket proxy support for iframe embedded connections

Key Features Demonstrated:

• Message Blocking: Intercept and block WebSocket messages in real-time
• Message Simulation: Send custom messages to test different scenarios
• Traffic Control: Manage WebSocket traffic flow for debugging
• JSON Support: Full JSON parsing and formatting capabilities

Message Details & JSON Viewer

Message Simulation & Traffic Control

Smart Favorites System

1. Install Extension - Add to Chrome and enable background monitoring
2. Open DevTools (F12) → Find"WebSocket DevTools" tab
3. View Captured Data - All WebSocket connections are automatically captured in background
4. Inspect Messages - Click connections to view message history
5. Simulate Messages - Use Simulate tab with JSON editor
6. Save Favorites - Star frequently used messages for quick access

💡 Pro Tip: The extension monitors WebSocket connections in the background, so you won't miss any connections even if you open DevTools after the WebSocket is established!

• ✅No data collection - Everything stays in your browser
• ✅Local storage only - No external servers or tracking
• ✅Open source - Fully transparent and auditable code
• ✅Minimal permissions - Only what's needed for functionality