Skip to content

AngularJS seed based on grunt JavaScript tasks runner and bower a package manager for the web

License

Notifications You must be signed in to change notification settings

lucassus/angular-coffee-seed

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Custom AngularJS seed project

Build status Dependency Status Stories in Ready

This is a custom AngularJS seed project based on grunt the JavaScript task runner.

  • AngularJS 1.2.0
  • CoffeeScript and Less support
  • Bower for front-end packages management
  • Full support for unit and end2end tests
  • Unit tests with Mocha, Chai and SinonJS
  • Generates test code coverage for the unit tests
  • Support for protractor integration tests
  • Support for Karma Test Runner (formerly Testacular)
  • Continuous Integration ready ready via grunt test:ci task
  • Grunt task runner along with several useful plugins
  • Production release minification and angular template caching
  • ..and a lot more

Demo: http://lucassus-angular-seed.herokuapp.com

Directory structure

  • ./app - contains CoffeeScript sources, styles, images, fonts and other assets
    • ./app/scripts - CoffeeScript sources
    • ./app/styles - stylesheets
    • ./app/views - html templates used by AngularJS
  • ./test - contains tests for the application
    • ./tests/integration - protractor integration specs
    • ./test/e2e - AngularJS end2end scenarios
    • ./tests/unit - unit tests for AngularJS components

Third-party libraries

  • ./bower_components - components dowloaded by bower install command
  • ./custom_components - you could put custom components here
  • ./node_modules - command dowloaded by npm install command

Generated stuff

  • ./dev - compiled development release
  • ./dist - created by grunt build command, contains the minified production release of the app

Bootstrap

Install nodejs v0.10.12 from the sources:

sudo apt-get install build-essential openssl libssl-dev pkg-config

wget http://nodejs.org/dist/v0.10.12/node-v0.10.12.tar.gz
tar -xzf node-v0.10.12.tar.gz

cd node-v0.10.7
./configure
make
sudo make install

Install grunt, nodemon and bower globally

sudo npm install -g grunt-cli
sudo npm install -g nodemon
sudo npm install -g bower

Run the app

npm install
bower install
script/start-server

Navigate to http://localhost:9000

Running tests

By default all tests are executed in PhantomJS browser

  • grunt test:unit or grunt test - run unit tests
  • grunt test:unit:watch or
  • grunt test:watch - run unit tests in watch mode
  • grunt test --coverage-reporter=html - generate html code coverage report

Run test against specific browsers

grunt test:unit --browsers=Chrome,Firefox,Opera,PhantomJS

Running integration tests

  • script/test-unit - run unit tests
  • script/test-integration - run integration specs

How to develop specs

  • install standalone Selenium node_modules/protractor/bin/webdriver-manager update
  • start the app in the test evn script/start-test-server
  • run it with grunt coffee:test && protractor dev/test/protractor-conf.js

WebDriver and PhantomJS

  • stop selenium
  • run PhantomJS with WebDriver support phantomjs --webdriver=4444
  • setup protractor browserName: "phantomjs"
  • run specs

Running tests for the server side application

mocha --compilers coffee:coffee-script --watch --reporter spec server/test

How to debug failing specs

Put debugger in the failing spec:

describe "Failing spec", ->

  it "should run smoothly", ->
    debugger # this is like setting a breakpoint
    failMiserably()

Run karma in Chrome browser:

grunt test:unit:watch --browsers=Chrome

  • Go to the newly opened Chrome Browser
  • Open Chrome's DevTools and refresh the page
  • Now in the source tab you should see the execution stopped at the debugger

Run karma directly without CoffeeScript compilation:

karma start test/karma-conf.coffee --single-run

or with auto watch option:

karma start test/karma-conf.coffee

or

karma test:unit:watch

Running tests headlessly

Start Xvfb and export DISPLAY variable:

./script/xvfb start
export DISPLAY=:99

Perform single run:

grunt test --browsers=Firefox,Chrome,Opera,PhantomJS

or

grunt test:watch --browsers=Chrome

Build process

script/build will build the minified production release.

(cd dist/ ; python -m SimpleHTTPServer 8000) will serve a static assets from ./dist directory.

Navigate to http://localhost:8000 to see the production release.

Heroku deployment

git co heroku-production
git merge master
grunt build
git push heroku heroku-production:master -f

About

AngularJS seed based on grunt JavaScript tasks runner and bower a package manager for the web

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published