Immerx DevTools

Immerx debugging tools in Chrome developer console.

What is Immerx DevTools?

Immerx DevTools is a Chrome extension developed by Ionut Achim, and its main feature is "Immerx debugging tools in Chrome developer console.".

Extension Screenshots

screenshot
screenshot
screenshot

Download Immerx DevTools Extension CRX File

Download Immerx DevTools extension files in crx format, manually install Chrome extensions in the browser, or share the crx files with friends to easily install Chrome extensions.

Extension Usage Instructions

                        ImmerX DevTools is a Chrome DevTools extension for the open-source JS state management library - ImmerX.

It helps developers visualise ImmerX state changes in the Chrome Developer Tools. It creates a new panel called "Immerx DevTools" that contains 4 main components:

1. "Update List" - A filterable, vertical scrolling list of all the state updates.
2. "Patches" - Where you can see all the immer patches that were applied during the selected state update. Each patch containing information about he operation type, the path and the diff.
3. "State" - Display the state value resulted from the selected update, or the current value if no update is selected.
4. "Diff" - Shows a diff between the state values before and after the selected update.

See an interactive demo of the inlined version here:
https://monojack.github.io/immerx-todomvc

You can learn more about ImmerX here:
https://github.com/monojack/immerx

Code for this extension is open-sourced at:
https://github.com/monojack/immerx-devtools

Extension Basic Information

Name Immerx DevTools Immerx DevTools
ID jchcefekimgnfceonnnekpgmphepengp
Official URL https://chromewebstore.google.com/detail/immerx-devtools/jchcefekimgnfceonnnekpgmphepengp
Description Immerx debugging tools in Chrome developer console.
File Size 81.98 KB
Installation Count 24
Current Version 0.2.0
Last Updated 2020-06-08
Publish Date 2020-06-08
Developer Ionut Achim
Email [email protected]
Payment Type free
Extension Website https://github.com/monojack/immerx-devtools
Help Page URL https://github.com/monojack/immerx-devtools/issues
Supported Languages en-GB
manifest.json 
{
    "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
    "version": "0.2.0",
    "author": "Ionut Achim ",
    "name": "Immerx DevTools",
    "short_name": "Immerx DevTools",
    "description": "Immerx debugging tools in Chrome developer console.",
    "icons": {
        "16": "icons\/icon-64.png",
        "48": "icons\/icon-128.png",
        "128": "icons\/icon-400.png"
    },
    "page_action": [],
    "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
    "permissions": [
        "tabs",
        "http:\/\/*\/*",
        "https:\/\/*\/*"
    ],
    "devtools_page": "devtools.html",
    "background": {
        "scripts": [
            "background.js"
        ],
        "persistent": false
    },
    "web_accessible_resources": [
        "panel.html"
    ],
    "content_scripts": [
        {
            "matches": [
                ""
            ],
            "js": [
                "hook.js",
                "contentScript.js"
            ],
            "run_at": "document_start"
        }
    ],
    "manifest_version": 2
}

Related Extensions

Solid Devtools
Solid Devtools
React Developer Tools
React Developer Tools
Preact Developer Tools
Preact Developer Tools
Livewire devtools
Livewire devtools
Web Developer Tool for Chrome
Web Developer Tool for Chrome