CONTRIBUTING.md

Contributing

More tests are always welcome. Pull requests containing new features must include tests for these features.

Installing development dependencies

Run npm install (npm comes bundled with node.js) to install all the development dependencies to build and test the project.

Building the extension

JavaScript source is located at /src, and uses gulp to build for Chrome at /ng-inspector.chrome, Safari at /ng-inspector.safariextension and Firefox at /ng-inspector.firefox.

Gulp Tasks:

• default: runs all the build tasks
• build:icons: copies the icons over to each browser folders
• build:css: compiles the less files over to each browser folders
• build:js: concatenates the source JavaScript over to each browser folder
• bump:major, bump:minor, bump:patch: bumps the version in the manifest files, stages the changes in git, commits with a "Prepare for vX.Y.Z" message and tag the commit with the version number. Manifest files updated:
  • package.json
  • ng-inspector.safariextension/Info.plist (Safari)
  • ng-inspector.chrome/manifest.json (Chrome)
  • ng-inspector.firefox/package.json (Firefox)

Packaging the extension

Each of the supported browsers require a different packaging process. Begin by building the extension with the default gulp task, then follow the browser-specific instructions below.

Safari

Make sure Show Develop menu in menu bar is selected in Preferences… > Advanced tab. Navigate to Develop > Show Extension Builder, click the + button and select the ng-inspector.safariextension directory to add the extension to Safari in development mode. Finally, click Build Package….

Chrome

Compress the ng-inspector.chrome directory in a .zip file and upload to the Chrome Web Store.

Firefox

For 30 <= Firefox < 38, use CFX:

• Install addon-sdk 1.17 from https://ftp.mozilla.org/pub/mozilla.org/labs/jetpack/jetpack-sdk-latest.zip (Reference: https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Installation)
• Activate cfx (e.g. source bin/activate)
• In the terminal, navigate to the ng-inspector.firefox directory.
  • To try the extension: cfx run -b /path/to/firefox-30.0/firefox
  • To build the xpi: cfx xpi

For Firefox >= 38, use JPM:

• Make sure to have installed the npm dependencies via npm install
• To try: npm run run-xpi -- -b /path/to/firefox-38/firefox
• To build the xpi: npm run build-xpi

Testing

Prerequisites

• JDK
• Chrome & Firefox

ng-inspector uses Protractor to run e2e tests in Chrome and Firefox. Tests are run against several releases of Angular.

Running Tests

There are two different options for running tests locally:

• npm test - Will open as many browsers as possible when running tests
• npm run test-throttled - Will limit tests to one browser at a time

Creating a new e2e test

The protractor tests in this repo follow a specific pattern, that helps to automate testing against the different versions of Angular. To scaffold a basic new e2e test, run gulp newtest --name test-name-here. This will create the basic test files for you, and place them in a new directory under test/e2e/tests.

Angular Versions

Tests are executed against multiple versions of Angular, and can be configured in test/e2e/angular-versions.conf.js.