Skip to content
This repository has been archived by the owner on Aug 13, 2018. It is now read-only.
Jan Odvarko edited this page Oct 16, 2015 · 35 revisions

WebSocket monitor is a Firefox extension that can be used to monitor WebSocket connections in Firefox. It allows to inspect all data sent and received.

Download

Prerequisites

  • WebSocket monitor requires a platform support that isn't part of any standard release channel yet. You need to either manually apply patches from bug 1203802 and build your own Firefox or download provided try builds, see releases.
  • The extension isn't signed, so you might need to set xpinstall.signatures.required pref to false. You might also want to checkout a simple online test page

Features

Are you missing a feature? Create a report.

Start With WebSocket Monitor

When you open Firefox developer Toolbox (press F12) you should see a new Web Sockets panel. Select the panel and open e.g. this simple test page. Initiate web socket connection on the page and see list of frames appearing in the panel.

wsm

Frame Inspection

It's possible to inspect all sent and received WS frames. The extension visualizes frame meta data as well as the payload.

  • Select a frame in the list of frames
  • All details are displayed on the right side

wsm3

Frame Filtering

The extension allows simple filtering of frames. It's possible to filter the list of frames using a keyword. Only frames that contains the keyword in the payload are displayed.

wsm2

Summary Data

There is a quick summary displayed at the bottom of the frame list.

  • Number of frames in the list
  • Total size of transferred payload
  • Total time since the first frame

wsm5

Themes

Both built-in DevTools themes (Dark and Light) are supported. If you have Firebug 3 (aka Firebug.next) installed you can also use Firebug theme.

  • Firebug Theme
  • Light Theme
  • Dark Theme

wsm6

wsm

wsm7

Socket.IO Support

Socket.IO library has an extra support. Payload of all frames is parsed and visualized as an expandable tree.

  • Select a frame generated using Socket.IO
  • Check out the Socket.IO side-bar

wsm8

Table and List Perspectives

There are two ways how to visualize frames. Apart from the tabular view (see screenshots above) there is also a list view that uses well know 'chat' approach (well known from various messengers).

wsm9

Inline Data Preview

The List perspective offers also an inline data preview. You don't have to always select the frame and go to the side bar, just open the data directly in the frame.

wsm10

Clone this wiki locally