Simple Chrome extension that decodes MessagePack requests and responses directly in DevTools.
When your app communicates over MessagePack, Chrome's Network tab shows raw binary blobs — unreadable. MessageUnpack adds a dedicated MessageUnpack panel to DevTools that automatically captures those requests, decodes both the request body and the response, and displays them as formatted JSON side by side.
- Adds a MessageUnpack tab to Chrome DevTools
- Automatically detects MessagePack traffic by content type (
application/x-msgpack,application/msgpack,application/octet-stream) and URL patterns - Decodes request and response bodies into readable, syntax-highlighted JSON
- Side-by-side view: Request on the left, Response on the right
- Filter requests by URL
- Resizable panes (both horizontal list/detail split and vertical request/response split)
- Clear button to reset captured traffic
- Light and dark theme support (follows system preference)
- Zero external dependencies — ships its own full MessagePack decoder
The built-in decoder covers the complete MessagePack spec:
| Type | Details |
|---|---|
| Integers | fixint, uint8/16/32/64, int8/16/32/64 |
| Floats | float32, float64 |
| Strings | fixstr, str8/16/32 |
| Binary | bin8/16/32 — displayed as hex |
| Arrays | fixarray, array16/32 |
| Maps | fixmap, map16/32 |
| Nil / Bool | null, true, false |
| Ext | fixext1–16, ext8/16/32 — Timestamp ext decoded to ISO 8601 |
The extension is not published to the Chrome Web Store. Load it manually:
- Clone or download this repository
- Open Chrome and navigate to
chrome://extensions/ - Enable Developer mode (toggle in the top-right corner)
- Click Load unpacked and select the
extension/folder - Open DevTools (
F12) on any page — a MessageUnpack tab will appear
- Open DevTools and switch to the MessageUnpack tab
- Navigate to or interact with your application
- MessagePack requests appear in the list automatically
- Click any row to see the decoded request body on the left and the decoded response on the right
- Use the filter bar to narrow results by URL
- Drag the horizontal divider to resize the request list vs. the detail pane
- Drag the vertical divider to adjust the request/response split
extension/
├── manifest.json Chrome extension manifest (MV3)
├── devtools.html DevTools page entry point
├── devtools.js Registers the MessageUnpack panel
├── panel.html Panel markup
├── panel.css Styles (light + dark theme)
├── panel.js Capture, decode, and render logic
├── msgpack.js Self-contained MessagePack decoder
└── icons/ Extension icons (16, 48, 128 px)
GNU GPL 3