ember-chrome-devtools
ember-chrome-devtools copied to clipboard
Chrome DevTools addon for Ember.js
ember-chrome-devtools
This addon formats Ember objects so that you can see their type and internal state at a glance. No more typing .get()
into your console!

Installation
-
Install the addon:
ember install ember-chrome-devtools
(it will not affect your production build)
-
Enable custom formatters in DevTools Settings:

Running
-
ember serve
- Visit your app at http://localhost:4200.
Running Tests
-
npm test
(Runsember try:each
to test your addon against multiple Ember versions) -
ember test
-
ember test --server
Building
-
ember build
Debugging the debugger
It can be helpful to inspect the html created by the formatters. Fortunately you can debug DevTools using a second DevTools instance.
-
Hit Cmd-Alt-I to open DevTools
-
Split DevTools in its own window using the first "Dock side" option:
-
With DevTools focused, hit Cmd-Alt-I to open a second DevTools