Frontend component for Test Driven Node CodeMash 2014. The backend piece is found here.
This was built from the project template for Angular JS applications using Lineman.
It includes the following features:
- Template Precompilation into Angulars $templateCache using
grunt-angular-templates
- A basic login, logout service bound to sample routes inside
config/server.js
- A router, and 2 views
home
andlogin
- A directive that shows a message on mouseover
- 2 Controllers, for
home
andlogin
, with $scope variables set and bound - A working, bound login form (username/password don't matter, but are required)
- Configured grunt-ngmin so you don't have to fully qualify angular dependencies.
- Auto generated sourcemaps with inlined sources via grunt-concat-sourcemap (you'll need to enable sourcemaps in Firefox/Chrome to see this)
- Unit Tests and End-to-End Tests
- Configuration to run Protractor for End-to-End Tests
git clone https://github.com/testdouble/testdrivennode-frontend
cd my-lineman-app
sudo npm install -g lineman
npm install
lineman run
- open your web browser to localhost:8000
This template was used as the basis of @davemo's Testing Strategies for Angular JS screencast, and contains all the tests we wrote in the screencast and a few more!
To run the unit tests:
lineman run
from 1 terminal windowlineman spec
from another terminal window, this will launch Testem and execute specs in Chrome
To run the end-to-end tests:
npm install protractor
brew install selenium-server-standalone
- Make sure you have chrome installed.
lineman run
from 1 terminal windowlineman grunt spec-e2e
from another terminal window
Troubleshooting:
If you see this error: Warning: there's no selenium server jar at the specified location,
you may need to change the selenium-server-standalone jar version in config/spec-e2e.js
to the actual you see in /user/local/opt/selenium-server-standalone.
If you see this error: Fatal error: The path to the driver executable must be set by the
webdriver.chrome.driver system property, you may need to download the chromedriver
(https://code.google.com/p/selenium/wiki/ChromeDriver) and place it in /usr/local/bin (mac).
If you are using Coffeescript to define the angular.module for your app, you will need to swap the concat order in config/application.js
such that coffeescript files are included before javascript, here's a sample config. (If you are using JavaScript for defining the angular.module the default concat order is fine).
Replace config/application.js
with the following if you want to define your app module in coffeescript:
/* Exports an object that defines
* all of the configuration needed by the projects'
* depended-on grunt tasks.
*
* You can find the parent object in: node_modules/lineman/config/application.coffee
*/
module.exports = require(process.env['LINEMAN_MAIN']).config.extend('application', {
concat_sourcemap: {
js: {
src: [
"<%= files.js.vendor %>",
"<%= files.coffee.generated %>",
"<%= files.js.app %>",
"<%= files.ngtemplates.dest %>"
]
}
}
});
Hopefully this helps you get up and running with AngularJS!