fingerartur/mobx_prettier

Chrome extension - Prettifier / formatter for easy debugging of Mobx objects in Dev Tools console and debugger.

Mobx Prettier

Mobx Prettier is a Chrome extension that prettifies / formats Mobx objects in Dev Tools console and debugger for easy inspection.

Setup

npm i

Develop

# Start up the example
npm run example
# Build the extension
npm run build

# Load the extension via chrome devtools: Chrome > Extensions > Load unpacked
# Test the extension on the example

Read about developing extensions.

Publish

npm run pack

Read about publishing extensions.

Inspiration

There is no official documentation for writing chrome formatters and that just sucks immensely.

• chrome formatters blog post #1
• chrome formatters blog post #2
• example #1 - mobx formatter, not very good
• example #2 - immutable.js formatter

Author's notes:

1. I am not making any improvements to this extension until Google releases documentation for Chrome Dev Tool Formatters, now it's just a black box.
2. Chrome Dev Tool Formatters get install to window. However, chrome extensions do not have access to window, so this part is a bit tricky. Here's how to do it