├── .bowerrc ├── .gitignore ├── .jshintrc ├── .travis.yml ├── LICENSE ├── README.md ├── README.md~ ├── app ├── app.css ├── app.js ├── components │ └── version │ │ ├── interpolate-filter.js │ │ ├── interpolate-filter_test.js │ │ ├── version-directive.js │ │ ├── version-directive_test.js │ │ ├── version.js │ │ └── version_test.js ├── home │ ├── home.html │ └── home.js ├── index-async.html ├── index.html ├── signin │ ├── signin.html │ └── signin.js └── signup │ ├── signup.html │ └── signup.js ├── bower.json ├── e2e-tests ├── protractor.conf.js └── scenarios.js ├── karma.conf.js └── package.json /.bowerrc: -------------------------------------------------------------------------------- 1 | { 2 | "directory": "app/bower_components" 3 | } -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | logs/* 2 | !.gitkeep 3 | node_modules/ 4 | bower_components/ 5 | tmp 6 | .DS_Store 7 | .idea -------------------------------------------------------------------------------- /.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "globalstrict": true, 3 | "globals": { 4 | "angular": false, 5 | "describe": false, 6 | "it": false, 7 | "expect": false, 8 | "beforeEach": false, 9 | "afterEach": false, 10 | "module": false, 11 | "inject": false 12 | } 13 | } -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: 3 | - "0.10" 4 | 5 | before_script: 6 | - export DISPLAY=:99.0 7 | - sh -e /etc/init.d/xvfb start 8 | - npm start > /dev/null & 9 | - npm run update-webdriver 10 | - sleep 1 # give server time to start 11 | 12 | script: 13 | - node_modules/.bin/karma start karma.conf.js --no-auto-watch --single-run --reporters=dots --browsers=Firefox 14 | - node_modules/.bin/protractor e2e-tests/protractor.conf.js --browser=firefox 15 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License 2 | 3 | Copyright (c) 2010-2014 Google, Inc. http://angularjs.org 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | To get started, simply clone the repository and install the required dependencies. 2 | ``` 3 | git clone https://github.com/codehandbook/AngularJS_Python_App.git 4 | cd AngularJS_Python_App 5 | npm install 6 | ``` 7 | Tutorial for this source code can be found at [Code Handbook](http://codehandbook.org/creating-an-angularjs-app-powered-by-python-flask-restful-api/) 8 | -------------------------------------------------------------------------------- /README.md~: -------------------------------------------------------------------------------- 1 | # angular-seed — the seed for AngularJS apps 2 | 3 | This project is an application skeleton for a typical [AngularJS](http://angularjs.org/) web app. 4 | You can use it to quickly bootstrap your angular webapp projects and dev environment for these 5 | projects. 6 | 7 | The seed contains a sample AngularJS application and is preconfigured to install the Angular 8 | framework and a bunch of development and testing tools for instant web development gratification. 9 | 10 | The seed app doesn't do much, just shows how to wire two controllers and views together. 11 | 12 | 13 | ## Getting Started 14 | 15 | To get you started you can simply clone the angular-seed repository and install the dependencies: 16 | 17 | ### Prerequisites 18 | 19 | You need git to clone the angular-seed repository. You can get git from 20 | [http://git-scm.com/](http://git-scm.com/). 21 | 22 | We also use a number of node.js tools to initialize and test angular-seed. You must have node.js and 23 | its package manager (npm) installed. You can get them from [http://nodejs.org/](http://nodejs.org/). 24 | 25 | ### Clone angular-seed 26 | 27 | Clone the angular-seed repository using [git][git]: 28 | 29 | ``` 30 | git clone https://github.com/angular/angular-seed.git 31 | cd angular-seed 32 | ``` 33 | 34 | If you just want to start a new project without the angular-seed commit history then you can do: 35 | 36 | ```bash 37 | git clone --depth=1 https://github.com/angular/angular-seed.git 38 | ``` 39 | 40 | The `depth=1` tells git to only pull down one commit worth of historical data. 41 | 42 | ### Install Dependencies 43 | 44 | We have two kinds of dependencies in this project: tools and angular framework code. The tools help 45 | us manage and test the application. 46 | 47 | * We get the tools we depend upon via `npm`, the [node package manager][npm]. 48 | * We get the angular code via `bower`, a [client-side code package manager][bower]. 49 | 50 | We have preconfigured `npm` to automatically run `bower` so we can simply do: 51 | 52 | ``` 53 | npm install 54 | ``` 55 | 56 | Behind the scenes this will also call `bower install`. You should find that you have two new 57 | folders in your project. 58 | 59 | * `node_modules` - contains the npm packages for the tools we need 60 | * `app/bower_components` - contains the angular framework files 61 | 62 | *Note that the `bower_components` folder would normally be installed in the root folder but 63 | angular-seed changes this location through the `.bowerrc` file. Putting it in the app folder makes 64 | it easier to serve the files by a webserver.* 65 | 66 | ### Run the Application 67 | 68 | We have preconfigured the project with a simple development web server. The simplest way to start 69 | this server is: 70 | 71 | ``` 72 | npm start 73 | ``` 74 | 75 | Now browse to the app at `http://localhost:8000/app/index.html`. 76 | 77 | 78 | 79 | ## Directory Layout 80 | 81 | ``` 82 | app/ --> all of the source files for the application 83 | app.css --> default stylesheet 84 | components/ --> all app specific modules 85 | version/ --> version related components 86 | version.js --> version module declaration and basic "version" value service 87 | version_test.js --> "version" value service tests 88 | version-directive.js --> custom directive that returns the current app version 89 | version-directive_test.js --> version directive tests 90 | interpolate-filter.js --> custom interpolation filter 91 | interpolate-filter_test.js --> interpolate filter tests 92 | view1/ --> the view1 view template and logic 93 | view1.html --> the partial template 94 | view1.js --> the controller logic 95 | view1_test.js --> tests of the controller 96 | view2/ --> the view2 view template and logic 97 | view2.html --> the partial template 98 | view2.js --> the controller logic 99 | view2_test.js --> tests of the controller 100 | app.js --> main application module 101 | index.html --> app layout file (the main html template file of the app) 102 | index-async.html --> just like index.html, but loads js files asynchronously 103 | karma.conf.js --> config file for running unit tests with Karma 104 | e2e-tests/ --> end-to-end tests 105 | protractor-conf.js --> Protractor config file 106 | scenarios.js --> end-to-end scenarios to be run by Protractor 107 | ``` 108 | 109 | ## Testing 110 | 111 | There are two kinds of tests in the angular-seed application: Unit tests and End to End tests. 112 | 113 | ### Running Unit Tests 114 | 115 | The angular-seed app comes preconfigured with unit tests. These are written in 116 | [Jasmine][jasmine], which we run with the [Karma Test Runner][karma]. We provide a Karma 117 | configuration file to run them. 118 | 119 | * the configuration is found at `karma.conf.js` 120 | * the unit tests are found next to the code they are testing and are named as `..._test.js`. 121 | 122 | The easiest way to run the unit tests is to use the supplied npm script: 123 | 124 | ``` 125 | npm test 126 | ``` 127 | 128 | This script will start the Karma test runner to execute the unit tests. Moreover, Karma will sit and 129 | watch the source and test files for changes and then re-run the tests whenever any of them change. 130 | This is the recommended strategy; if your unit tests are being run every time you save a file then 131 | you receive instant feedback on any changes that break the expected code functionality. 132 | 133 | You can also ask Karma to do a single run of the tests and then exit. This is useful if you want to 134 | check that a particular version of the code is operating as expected. The project contains a 135 | predefined script to do this: 136 | 137 | ``` 138 | npm run test-single-run 139 | ``` 140 | 141 | 142 | ### End to end testing 143 | 144 | The angular-seed app comes with end-to-end tests, again written in [Jasmine][jasmine]. These tests 145 | are run with the [Protractor][protractor] End-to-End test runner. It uses native events and has 146 | special features for Angular applications. 147 | 148 | * the configuration is found at `e2e-tests/protractor-conf.js` 149 | * the end-to-end tests are found in `e2e-tests/scenarios.js` 150 | 151 | Protractor simulates interaction with our web app and verifies that the application responds 152 | correctly. Therefore, our web server needs to be serving up the application, so that Protractor 153 | can interact with it. 154 | 155 | ``` 156 | npm start 157 | ``` 158 | 159 | In addition, since Protractor is built upon WebDriver we need to install this. The angular-seed 160 | project comes with a predefined script to do this: 161 | 162 | ``` 163 | npm run update-webdriver 164 | ``` 165 | 166 | This will download and install the latest version of the stand-alone WebDriver tool. 167 | 168 | Once you have ensured that the development web server hosting our application is up and running 169 | and WebDriver is updated, you can run the end-to-end tests using the supplied npm script: 170 | 171 | ``` 172 | npm run protractor 173 | ``` 174 | 175 | This script will execute the end-to-end tests against the application being hosted on the 176 | development server. 177 | 178 | 179 | ## Updating Angular 180 | 181 | Previously we recommended that you merge in changes to angular-seed into your own fork of the project. 182 | Now that the angular framework library code and tools are acquired through package managers (npm and 183 | bower) you can use these tools instead to update the dependencies. 184 | 185 | You can update the tool dependencies by running: 186 | 187 | ``` 188 | npm update 189 | ``` 190 | 191 | This will find the latest versions that match the version ranges specified in the `package.json` file. 192 | 193 | You can update the Angular dependencies by running: 194 | 195 | ``` 196 | bower update 197 | ``` 198 | 199 | This will find the latest versions that match the version ranges specified in the `bower.json` file. 200 | 201 | 202 | ## Loading Angular Asynchronously 203 | 204 | The angular-seed project supports loading the framework and application scripts asynchronously. The 205 | special `index-async.html` is designed to support this style of loading. For it to work you must 206 | inject a piece of Angular JavaScript into the HTML page. The project has a predefined script to help 207 | do this. 208 | 209 | ``` 210 | npm run update-index-async 211 | ``` 212 | 213 | This will copy the contents of the `angular-loader.js` library file into the `index-async.html` page. 214 | You can run this every time you update the version of Angular that you are using. 215 | 216 | 217 | ## Serving the Application Files 218 | 219 | While angular is client-side-only technology and it's possible to create angular webapps that 220 | don't require a backend server at all, we recommend serving the project files using a local 221 | webserver during development to avoid issues with security restrictions (sandbox) in browsers. The 222 | sandbox implementation varies between browsers, but quite often prevents things like cookies, xhr, 223 | etc to function properly when an html page is opened via `file://` scheme instead of `http://`. 224 | 225 | 226 | ### Running the App during Development 227 | 228 | The angular-seed project comes preconfigured with a local development webserver. It is a node.js 229 | tool called [http-server][http-server]. You can start this webserver with `npm start` but you may choose to 230 | install the tool globally: 231 | 232 | ``` 233 | sudo npm install -g http-server 234 | ``` 235 | 236 | Then you can start your own development web server to serve static files from a folder by 237 | running: 238 | 239 | ``` 240 | http-server -a localhost -p 8000 241 | ``` 242 | 243 | Alternatively, you can choose to configure your own webserver, such as apache or nginx. Just 244 | configure your server to serve the files under the `app/` directory. 245 | 246 | 247 | ### Running the App in Production 248 | 249 | This really depends on how complex your app is and the overall infrastructure of your system, but 250 | the general rule is that all you need in production are all the files under the `app/` directory. 251 | Everything else should be omitted. 252 | 253 | Angular apps are really just a bunch of static html, css and js files that just need to be hosted 254 | somewhere they can be accessed by browsers. 255 | 256 | If your Angular app is talking to the backend server via xhr or other means, you need to figure 257 | out what is the best way to host the static files to comply with the same origin policy if 258 | applicable. Usually this is done by hosting the files by the backend server or through 259 | reverse-proxying the backend server(s) and webserver(s). 260 | 261 | 262 | ## Continuous Integration 263 | 264 | ### Travis CI 265 | 266 | [Travis CI][travis] is a continuous integration service, which can monitor GitHub for new commits 267 | to your repository and execute scripts such as building the app or running tests. The angular-seed 268 | project contains a Travis configuration file, `.travis.yml`, which will cause Travis to run your 269 | tests when you push to GitHub. 270 | 271 | You will need to enable the integration between Travis and GitHub. See the Travis website for more 272 | instruction on how to do this. 273 | 274 | ### CloudBees 275 | 276 | CloudBees have provided a CI/deployment setup: 277 | 278 | 279 | 280 | 281 | If you run this, you will get a cloned version of this repo to start working on in a private git repo, 282 | along with a CI service (in Jenkins) hosted that will run unit and end to end tests in both Firefox and Chrome. 283 | 284 | 285 | ## Contact 286 | 287 | For more information on AngularJS please check out http://angularjs.org/ 288 | 289 | [git]: http://git-scm.com/ 290 | [bower]: http://bower.io 291 | [npm]: https://www.npmjs.org/ 292 | [node]: http://nodejs.org 293 | [protractor]: https://github.com/angular/protractor 294 | [jasmine]: http://jasmine.github.io 295 | [karma]: http://karma-runner.github.io 296 | [travis]: https://travis-ci.org/ 297 | [http-server]: https://github.com/nodeapps/http-server 298 | -------------------------------------------------------------------------------- /app/app.css: -------------------------------------------------------------------------------- 1 | /* Space out content a bit */ 2 | body { 3 | padding-top: 20px; 4 | padding-bottom: 20px; 5 | } 6 | 7 | /* Everything but the jumbotron gets side spacing for mobile first views */ 8 | .header, 9 | .marketing, 10 | .footer { 11 | padding-right: 15px; 12 | padding-left: 15px; 13 | } 14 | 15 | /* Custom page header */ 16 | .header { 17 | padding-bottom: 20px; 18 | border-bottom: 1px solid #e5e5e5; 19 | } 20 | /* Make the masthead heading the same height as the navigation */ 21 | .header h3 { 22 | margin-top: 0; 23 | margin-bottom: 0; 24 | line-height: 40px; 25 | } 26 | 27 | /* Custom page footer */ 28 | .footer { 29 | padding-top: 19px; 30 | color: #777; 31 | border-top: 1px solid #e5e5e5; 32 | } 33 | 34 | /* Customize container */ 35 | @media (min-width: 768px) { 36 | .container { 37 | max-width: 730px; 38 | } 39 | } 40 | .container-narrow > hr { 41 | margin: 30px 0; 42 | } 43 | 44 | /* Main marketing message and sign up button */ 45 | .jumbotron { 46 | text-align: center; 47 | border-bottom: 1px solid #e5e5e5; 48 | } 49 | .jumbotron .btn { 50 | padding: 14px 24px; 51 | font-size: 21px; 52 | } 53 | 54 | /* Supporting marketing content */ 55 | .marketing { 56 | margin: 40px 0; 57 | } 58 | .marketing p + h4 { 59 | margin-top: 28px; 60 | } 61 | 62 | /* Responsive: Portrait tablets and up */ 63 | @media screen and (min-width: 768px) { 64 | /* Remove the padding we set earlier */ 65 | .header, 66 | .marketing, 67 | .footer { 68 | padding-right: 0; 69 | padding-left: 0; 70 | } 71 | /* Space out the masthead */ 72 | .header { 73 | margin-bottom: 30px; 74 | } 75 | /* Remove the bottom border on the jumbotron for visual effect */ 76 | .jumbotron { 77 | border-bottom: 0; 78 | } 79 | } -------------------------------------------------------------------------------- /app/app.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | // Declare app level module which depends on views, and components 4 | angular.module('myApp', [ 5 | 'ngRoute', 6 | 'myApp.home', 7 | 'myApp.signin', 8 | 'myApp.signup' 9 | ]). 10 | config(['$routeProvider', function($routeProvider) { 11 | $routeProvider 12 | .otherwise({redirectTo: '/home'}); 13 | }]); 14 | -------------------------------------------------------------------------------- /app/components/version/interpolate-filter.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | angular.module('myApp.version.interpolate-filter', []) 4 | 5 | .filter('interpolate', ['version', function(version) { 6 | return function(text) { 7 | return String(text).replace(/\%VERSION\%/mg, version); 8 | }; 9 | }]); 10 | -------------------------------------------------------------------------------- /app/components/version/interpolate-filter_test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | describe('myApp.version module', function() { 4 | beforeEach(module('myApp.version')); 5 | 6 | describe('interpolate filter', function() { 7 | beforeEach(module(function($provide) { 8 | $provide.value('version', 'TEST_VER'); 9 | })); 10 | 11 | it('should replace VERSION', inject(function(interpolateFilter) { 12 | expect(interpolateFilter('before %VERSION% after')).toEqual('before TEST_VER after'); 13 | })); 14 | }); 15 | }); 16 | -------------------------------------------------------------------------------- /app/components/version/version-directive.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | angular.module('myApp.version.version-directive', []) 4 | 5 | .directive('appVersion', ['version', function(version) { 6 | return function(scope, elm, attrs) { 7 | elm.text(version); 8 | }; 9 | }]); 10 | -------------------------------------------------------------------------------- /app/components/version/version-directive_test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | describe('myApp.version module', function() { 4 | beforeEach(module('myApp.version')); 5 | 6 | describe('app-version directive', function() { 7 | it('should print current version', function() { 8 | module(function($provide) { 9 | $provide.value('version', 'TEST_VER'); 10 | }); 11 | inject(function($compile, $rootScope) { 12 | var element = $compile('')($rootScope); 13 | expect(element.text()).toEqual('TEST_VER'); 14 | }); 15 | }); 16 | }); 17 | }); 18 | -------------------------------------------------------------------------------- /app/components/version/version.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | angular.module('myApp.version', [ 4 | 'myApp.version.interpolate-filter', 5 | 'myApp.version.version-directive' 6 | ]) 7 | 8 | .value('version', '0.1'); 9 | -------------------------------------------------------------------------------- /app/components/version/version_test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | describe('myApp.version module', function() { 4 | beforeEach(module('myApp.version')); 5 | 6 | describe('version service', function() { 7 | it('should return current version', inject(function(version) { 8 | expect(version).toEqual('0.1'); 9 | })); 10 | }); 11 | }); 12 | -------------------------------------------------------------------------------- /app/home/home.html: -------------------------------------------------------------------------------- 1 |
2 |

AngularJS Web App

3 |

AngularJS App Powered By Python Flask

4 |

Sign up today

5 |
-------------------------------------------------------------------------------- /app/home/home.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | angular.module('myApp.home', ['ngRoute']) 4 | 5 | .config(['$routeProvider', function($routeProvider) { 6 | $routeProvider.when('/home', { 7 | templateUrl: 'home/home.html', 8 | controller: 'HomeCtrl' 9 | }); 10 | }]) 11 | 12 | .controller('HomeCtrl', [function() { 13 | 14 | }]); -------------------------------------------------------------------------------- /app/index-async.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 12 | 13 | 44 | My AngularJS App 45 | 46 | 47 | 48 | 52 | 53 |
54 | 55 |
Angular seed app: v
56 | 57 | 58 | 59 | -------------------------------------------------------------------------------- /app/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | My AngularJS App 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 | 27 |

AngularJS & Python

28 |
29 | 30 |
31 | 32 |
33 |

© Company 2014

34 |
35 | 36 |
37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | -------------------------------------------------------------------------------- /app/signin/signin.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 4 | 5 | 6 | 7 |
8 | 11 |
12 | 13 |
-------------------------------------------------------------------------------- /app/signin/signin.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | angular.module('myApp.signin', ['ngRoute']) 4 | 5 | .config(['$routeProvider', function($routeProvider) { 6 | $routeProvider.when('/signin', { 7 | templateUrl: 'signin/signin.html', 8 | controller: 'SignInCtrl' 9 | }); 10 | }]) 11 | 12 | .controller('SignInCtrl', [function() { 13 | 14 | }]); -------------------------------------------------------------------------------- /app/signup/signup.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 |
-------------------------------------------------------------------------------- /app/signup/signup.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | angular.module('myApp.signup', ['ngRoute']) 4 | 5 | .config(['$routeProvider', function($routeProvider) { 6 | $routeProvider.when('/signup', { 7 | templateUrl: 'signup/signup.html', 8 | controller: 'SignUpCtrl' 9 | }); 10 | }]) 11 | 12 | .controller('SignUpCtrl', [function() { 13 | 14 | }]); -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "angular-seed", 3 | "description": "A starter project for AngularJS", 4 | "version": "0.0.0", 5 | "homepage": "https://github.com/angular/angular-seed", 6 | "license": "MIT", 7 | "private": true, 8 | "dependencies": { 9 | "angular": "~1.4.0", 10 | "angular-route": "~1.4.0", 11 | "angular-loader": "~1.4.0", 12 | "angular-mocks": "~1.4.0", 13 | "html5-boilerplate": "~5.2.0" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /e2e-tests/protractor.conf.js: -------------------------------------------------------------------------------- 1 | exports.config = { 2 | allScriptsTimeout: 11000, 3 | 4 | specs: [ 5 | '*.js' 6 | ], 7 | 8 | capabilities: { 9 | 'browserName': 'chrome' 10 | }, 11 | 12 | baseUrl: 'http://localhost:8000/app/', 13 | 14 | framework: 'jasmine', 15 | 16 | jasmineNodeOpts: { 17 | defaultTimeoutInterval: 30000 18 | } 19 | }; 20 | -------------------------------------------------------------------------------- /e2e-tests/scenarios.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | /* https://github.com/angular/protractor/blob/master/docs/toc.md */ 4 | 5 | describe('my app', function() { 6 | 7 | 8 | it('should automatically redirect to /view1 when location hash/fragment is empty', function() { 9 | browser.get('index.html'); 10 | expect(browser.getLocationAbsUrl()).toMatch("/view1"); 11 | }); 12 | 13 | 14 | describe('view1', function() { 15 | 16 | beforeEach(function() { 17 | browser.get('index.html#/view1'); 18 | }); 19 | 20 | 21 | it('should render view1 when user navigates to /view1', function() { 22 | expect(element.all(by.css('[ng-view] p')).first().getText()). 23 | toMatch(/partial for view 1/); 24 | }); 25 | 26 | }); 27 | 28 | 29 | describe('view2', function() { 30 | 31 | beforeEach(function() { 32 | browser.get('index.html#/view2'); 33 | }); 34 | 35 | 36 | it('should render view2 when user navigates to /view2', function() { 37 | expect(element.all(by.css('[ng-view] p')).first().getText()). 38 | toMatch(/partial for view 2/); 39 | }); 40 | 41 | }); 42 | }); 43 | -------------------------------------------------------------------------------- /karma.conf.js: -------------------------------------------------------------------------------- 1 | module.exports = function(config){ 2 | config.set({ 3 | 4 | basePath : './', 5 | 6 | files : [ 7 | 'app/bower_components/angular/angular.js', 8 | 'app/bower_components/angular-route/angular-route.js', 9 | 'app/bower_components/angular-mocks/angular-mocks.js', 10 | 'app/components/**/*.js', 11 | 'app/view*/**/*.js' 12 | ], 13 | 14 | autoWatch : true, 15 | 16 | frameworks: ['jasmine'], 17 | 18 | browsers : ['Chrome'], 19 | 20 | plugins : [ 21 | 'karma-chrome-launcher', 22 | 'karma-firefox-launcher', 23 | 'karma-jasmine', 24 | 'karma-junit-reporter' 25 | ], 26 | 27 | junitReporter : { 28 | outputFile: 'test_out/unit.xml', 29 | suite: 'unit' 30 | } 31 | 32 | }); 33 | }; 34 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "angular-seed", 3 | "private": true, 4 | "version": "0.0.0", 5 | "description": "A starter project for AngularJS", 6 | "repository": "https://github.com/angular/angular-seed", 7 | "license": "MIT", 8 | "devDependencies": { 9 | "bower": "^1.3.1", 10 | "http-server": "^0.6.1", 11 | "jasmine-core": "^2.3.4", 12 | "karma": "~0.12", 13 | "karma-chrome-launcher": "^0.1.12", 14 | "karma-firefox-launcher": "^0.1.6", 15 | "karma-jasmine": "^0.3.5", 16 | "karma-junit-reporter": "^0.2.2", 17 | "protractor": "^2.1.0", 18 | "shelljs": "^0.2.6" 19 | }, 20 | "scripts": { 21 | "postinstall": "bower install", 22 | 23 | "prestart": "npm install", 24 | "start": "http-server -a localhost -p 8000 -c-1", 25 | 26 | "pretest": "npm install", 27 | "test": "karma start karma.conf.js", 28 | "test-single-run": "karma start karma.conf.js --single-run", 29 | 30 | "preupdate-webdriver": "npm install", 31 | "update-webdriver": "webdriver-manager update", 32 | 33 | "preprotractor": "npm run update-webdriver", 34 | "protractor": "protractor e2e-tests/protractor.conf.js", 35 | 36 | "update-index-async": "node -e \"require('shelljs/global'); sed('-i', /\\/\\/@@NG_LOADER_START@@[\\s\\S]*\\/\\/@@NG_LOADER_END@@/, '//@@NG_LOADER_START@@\\n' + sed(/sourceMappingURL=angular-loader.min.js.map/,'sourceMappingURL=bower_components/angular-loader/angular-loader.min.js.map','app/bower_components/angular-loader/angular-loader.min.js') + '\\n//@@NG_LOADER_END@@', 'app/index-async.html');\"" 37 | } 38 | } 39 | --------------------------------------------------------------------------------