This is the source code for the sample application from the [Writing Testable Apps With Yeoman] 1 presentation at the July 10, 2013 Denver AngularJS Meetup. The purpose of the app is to demonstarte the use of [Yeoman] 2 to create a testable, well structured [AngularJS] 3 application, provides examples of integrating testing with [Grunt] 4 and [grunt-karma] 5, and provide general purpose configuration of the [Karma] 6 test runner.
Before the application can be run locally, the following steps are required:
It's also a good idea to take a look at both of the [Yeoman] 2, [Karma] 6 web pages to get familiar with the core concepts.
Once these items are installed, and the source code has been cloned, change to the ImaginaryRecords directory and run: npm install
followed by:
bower install
Once this is done, you should be able to run the application locally using:
grunt server
while in the ImaginaryRecords directory.
The application uses [Yeoman] 2 to scaffold an [AngularJS] 3 application. The scaffolding component of [Yeoman] 2 is known as [Yo] 12, and it leverages a concept known as [generators] 9, or project templates. One of the out-of-the box generators is [generator-angular] 10, which will scaffold out a new AngularJS application. This sample application was generated using the [generator-angular] 10 template. Each of the pages in the app were generated using:
yo angular:route "myroute"
This will leverage the [generator-angular] 10 scaffolding to update the route definitions in app.js, generate a new controller, a new view, and a new unit test.
Some important changes were made to the code generated by [Yeoman] 2 to support e2e testing:
First, The Gruntfile.js file changed the 'karma' task to the following:
karma: {
unit: {
configFile: 'karma.conf.js',
singleRun: true
},
e2e: {
configFile: "karma-e2e.conf.js",
singleRun: true
}
},
This allows us to use grunt karma:unit
or grunt karma:e2e
to run unit or e2e tests respectively. The karma-e2e-conf.js file adds additional configuration that allows for use of the [AngularJS Scenario Runner] 11
Finally, the following was added to the karma-e2e-conf.js file:
// Keep this in sync with localhost port in Gruntfile.
proxies = {
'/': 'http://localhost:9000'
};
urlRoot = '/__e2e/';
This allows open browsers navigate to http://localhost:9000/__e2e for socket.io connections from karma. This allows browsers on remote machines (like an iPad) to connect to Karma using this configuration.