Adds an Ember tab to Chrome or Firefox Developer Tools that allows you to inspect Ember objects in your application.
Install the extension from the Chrome Web Store.
OR:
- Clone the repository
- cd into the repo directory
- run
npm install && bower install
- run
npm install -g ember-cli
- run
npm run build
to build thedist
directory - Visit chrome://extensions in chrome
- Make sure
Developer mode
is checked - Click on 'Load unpacked extension...'
- Choose the
dist/chrome
folder in the cloned repo - Close and re-open developer tools if it's already open
Install the Firefox addon.
OR:
- Clone the repository
- cd into the repo directory
- run
npm install && bower install
- run
npm install -g ember-cli
- run
npm run build:xpi
to build thedist
directory, download Firefox Addon SDK and build Firefox Addon XPI to 'tmp/xpi/ember-inspector.xpi' ornpm run run-xpi
to run the Firefox Addon in a temporary profile (or useFIREFOX_BIN
andFIREFOX_PROFILE
to customize Firefox profile directory and Firefox binary used to run the extension)
- Clone the repository
- cd into the repo directory
- run
npm install
- run
npm install -g ember-cli
- run
npm run build
to build thedist
directory - Visit chrome://extensions in chrome
- Make sure
Developer mode
is checked - Click on 'Load unpacked extension...'
- Choose the
dist/chrome
folder in the cloned repo - Close and re-open developer tools if it's already open
javascript: (function() { var s = document.createElement('script'); s.src = '//ember-extension.s3.amazonaws.com/dist_bookmarklet/load_inspector.js'; document.body.appendChild(s); }());
Internet explorer will open an iframe instead of a popup due to the lack of support for cross-origin messaging.
For development:
- run
npm run serve:bookmarklet
- create a bookmark (make sure you unblock the popup when you run the bookmarklet):
javascript: (function() { var s = document.createElement('script'); s.src = 'http://localhost:9191/bookmarklet/load_inspector.js'; document.body.appendChild(s); }());
Run npm install && npm install -g ember-cli && && npm install -g bower && bower install && npm install -g grunt-cli
to install the required modules.
npm run build
to build the files in thedist
directorynpm run watch
To watch the files and re-build indist
when anything changes (useful during development).npm test
To run the tests in the terminalnpm run build:xpi
to download and build Firefox Addon XPI intotmp/xpi/ember-inspector.xpi
npm run run-xpi
to run the Firefox Addon XPI on a temporary new profile (or useFIREFOX_BIN
andFIREFOX_PROFILE
to customize Firefox profile directory and Firefox binary used to run the extension)npm start
To start the test server atlocalhost:4200/testing/tests
Patch versions are only committed to the stable branch. So we need to cherry-pick the commits we need from master and bump stable to the new patch version.
git checkout stable
- Cherry-pick the needed commits from master to stable
- Bump the patch version in package.json and run
grunt version
. Add the change log entry and commit. - Follow the "Steps to publish" below.
git checkout master
- Commit the change log entry to the master branch.
When releasing a major/minor version, master would already have this version set, so what we need to do is to merge master into stable and release.
- Add the new minor/major version's change log entry in
CHANGELOG.md
and commit to master. git checkout stable
git merge -X theirs master
- Follow the "Steps to publish" steps below.
git checkout master
- Update
package.json
to the future major/minor version and rungrunt version
- Push the
stable
branch to github (this will publish the bookmarklet version). npm run build:production
- Publish
dist/chrome/ember-inspector.zip
to the Chrome web store - Publish
tmp/xpi/ember-inspector.xpi
to the Mozilla Addons npm publish ./
git tag
the new version
The Ember Inspector uses window messages, so if you are using window messages in your application code, make sure you verify the sender and add checks to your event listener so as not to conflict with the inspector's messages.