Browser DevTools

Inspect Immutable collections
the way you think about them

Out of the box, DevTools shows the internal data structure of a collection — not its contents. A custom formatter fixes that, so a List reads like a list, right in the Console.

Console output without the formatter — Without the formatter

→

Console output with the formatter — With the formatter

Supported in Chrome (v47+) and Firefox (116+) via custom DevTools formatters.

Install the extension

Add it to your browser and it just works — no configuration.

Prefer not to install an extension?

Add the devtools as a dev dependency in your project instead.

Install

npm install --save-dev @immutable/devtools

Enable

import * as Immutable from 'immutable';
import installDevTools from '@immutable/devtools';

installDevTools(Immutable);

See more details in the GitHub repository.

Inspect Immutable collectionsthe way you think about them

Install the extension

Prefer not to install an extension?

Inspect Immutable collections
the way you think about them