This is a project to demonstrate the current unit and end-to-end testing capabilities in AngularJS. Currently these are the relevant technologies:
- Karma for unit testing
- Protractor for end-to-end testing
To make things as standardized as possible, I created this project with the latest Yeoman generator for Angular. Since the Angular generator doesn't support Protractor yet, I added all the protractor stuff.
The presentation slides for this project are located here.
So this is a simple application to manage the planning of a Super Bowl party. You can add, edit, and remove guests. Also, you can assign goodies (food and drink) for guests to bring. These simple user stories bring some good testing discussion to the surface. The project includes both unit and E2E tests, and we can discuss the merits of both in the context of the application.
If this were a real project, we'd probably use $http or $resource to interact with a real backend. Here we're only demonstrating frontend testing, so the data services are only temporary.
This is a standard yeoman project, so building is straightforward. Assuming you have npm installed, run these commands from the project root:
npm install -g grunt-cli
npm install -g bower
npm install
bower install
grunt test
To run only the karma tests:
grunt karma
To run only the protractor tests:
grunt protractor
To run the development server:
grunt serve
The protractor project includes handy scripts for managing both the Selenium server and the individual browser web drivers. To download the latest Selenium and web drivers:
./node_modules/.bin/webdriver-manager update
Next, you can use the same script to launch a local Selenium server instance for all your protractor testing:
./node_modules/.bin/webdriver-manager start
This command takes awhile, so be patient. The script kills the server when it detects anything on standard input.
If you need to run protractor outside of grunt:
./node_modules/.bin/protractor protractor-config.js
This is effectively the same as:
grunt protractor
- Yeoman
- Yeoman Angular Generator (version 0.7.1)
- Example E2E test from the Yeoman protractor generator project