diff --git a/.dockerignore b/.dockerignore
deleted file mode 100644
index c2658d7d1..000000000
--- a/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/.editorconfig b/.editorconfig
index f2abacf6d..b8a6e5723 100644
--- a/.editorconfig
+++ b/.editorconfig
@@ -5,7 +5,6 @@ root = true
charset = utf-8
indent_style = space
indent_size = 2
-end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
diff --git a/.gitignore b/.gitignore
index f23176b5b..9b3a09fc9 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,18 +1,14 @@
.idea
-typings/**
node_modules
jspm_packages
-link-checker-results.txt
-**/*npm-debug.log.*
-*.js
+npm-debug.log
+debug.log
+src/**/*.js
+!src/systemjs.config.extras.js
+!src/systemjs.config.js
+!src/systemjs-angular-loader.js
*.js.map
e2e/**/*.js
e2e/**/*.js.map
_test-output
_temp
-
-!karma*.js
-!protractor*.js
-!systemjs.config.js
-!typings/typings.d.ts
-!wallaby.js
diff --git a/.travis.yml b/.travis.yml
index a20396221..808bc2c4e 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -16,5 +16,5 @@ install:
- npm install
script:
- npm run lint
- - npm run test-once
+ - npm run test:once
- npm run e2e
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1fec51860..4c991b119 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,111 @@
+## Angular Documentation QuickStart Changelog
+Upgraders: for a fresh start, consider running these commands
+* `git clean -xdf`
+* `npm install`
+
+
+# 0.4.1 (2017-03-24)
+* Replace systemjs-angular-loader with version that works for IE
+
+
+# 0.4.0 (2017-03-24)
+* Update to Angular 4.0.0
+
+
+# 0.3.0 (2017-03-22)
+* Remove moduleId with a systemjs loader.
+
+
+# 0.2.22 (2017-01-05)
+* Add `non-essential-files.txt` and instructions to use it to README
+
+
+# 0.2.21 (2016-12-14)
+* Update to in-memory-web-api v.0.2.1
+
+
+# 0.2.20 (2016-12-07)
+* Update to Angular 2.3.0
+
+
+# 0.2.19 (2016-11-30)
+* remove upgrade mappings from `systemjs.config.js` PR #301
+
+
+# 0.2.18 (2016-11-30)
+* remove `exclude` clause from `tsconfig.json`; it was just confusing people
+* karma.config + karma-test-shim can handle multiple spec source paths (issue #294)
+* cosmetic `app.component.spec.ts` changes
+* cosmetic `karma.config.js` changes
+
+
+# 0.2.17 (2016-11-16)
+* Conform to updated QuickStart advice
+ * removed docker everywhere (was nice but not necessary)
+ * removed wallaby
+ * shrink styles.css
+ * refine tsconfig.json
+ * `AppComponent` uses interpolation
+
+
+# 0.2.16 (2016-11-14)
+* Update to Angular 2.2.0
+
+
+# 0.2.15 (2016-10-29)
+* Revert to Jasmine 2.4.1 because bug in 2.5.x (see [jasmine issue #1231](https://github.com/jasmine/jasmine/issues/1231))
+
+
+# 0.2.14 (2016-10-29)
+* Remove bootstrap.css install
+* Angular v2.1.2
+
+
+# 0.2.13 (2016-10-20)
+* Protractor 4
+* Move from `typings` to `@types`. See `tsconfig.json` changes.
+* Angular v2.1.1
+
+
+# 0.2.12 (2016-10-06)
+* Angular v2.1.0
+
+
+# 0.2.11 (2016-10-06)
+* Angular v2.0.2
+* License is MIT
+* Current testing configuration
+* No code changes
+
+
+# 0.2.10 (2016-09-19)
+* All "Angular 2" references become just "Angular"
+* No code changes
+
+
+# 0.2.9 (2016-09-14)
+* Angular 2.0.0 version
+* Update to Typescript 2.0.2
+* Fix e2e test missing dir
+
+
+# 0.2.8 (2016-09-01)
+* remove @angular test libraries from system.js (now in shim)
+* update test related files
+* wallaby doesn't completely work. Researching.
+
+
+# 0.2.7 (2016-08-31)
+* Angular 2 RC6 version
+* Updated new forms, router, angular2-in-memory-web-api, karma, core-js, rxjs and zone.js packages
+* Removed router-deprecated package
+* Updated karma.conf.js and systemjs.config.js
+
+
+# 0.2.6 (2016-08-09)
+* Angular 2 RC5 version
+* Updated new forms, router and angular2-in-memory-web-api
+
# 0.2.5 (2016-06-30)
* Angular 2 RC4 version
diff --git a/Dockerfile b/Dockerfile
deleted file mode 100644
index 724cbf350..000000000
--- a/Dockerfile
+++ /dev/null
@@ -1,21 +0,0 @@
-# To build and run with Docker:
-#
-# $ docker build -t ng2-quickstart .
-# $ docker run -it --rm -p 3000:3000 -p 3001:3001 ng2-quickstart
-#
-FROM node:latest
-
-RUN mkdir -p /quickstart /home/nodejs && \
- groupadd -r nodejs && \
- useradd -r -g nodejs -d /home/nodejs -s /sbin/nologin nodejs && \
- chown -R nodejs:nodejs /home/nodejs
-
-WORKDIR /quickstart
-COPY package.json typings.json /quickstart/
-RUN npm install --unsafe-perm=true
-
-COPY . /quickstart
-RUN chown -R nodejs:nodejs /quickstart
-USER nodejs
-
-CMD npm start
diff --git a/README.md b/README.md
index b70d29fa9..aeccb7d76 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,13 @@
-# Angular 2 QuickStart Source
+# Angular QuickStart Source
+[![Build Status][travis-badge]][travis-badge-url]
+
+**This repository is now deprecated. The Angular Quickstart project was a nice starting point for creating Angular applications. Now we recommend using the [Angular CLI](https://github.com/angular/angular-cli) to create new Angular projects.**
+
+**Starting from 1 November 2017, all the Angular documentation, at [angular.io](https://angular.io), is based on the Angular CLI.**
+
+**Let's [get started](https://angular.io/guide/quickstart)**
+
+---
This repository holds the TypeScript source code of the [angular.io quickstart](https://angular.io/docs/ts/latest/quickstart.html),
the foundation for most of the documentation samples and potentially a good starting point for your application.
@@ -6,19 +15,37 @@ the foundation for most of the documentation samples and potentially a good star
It's been extended with testing support so you can start writing tests immediately.
**This is not the perfect arrangement for your application. It is not designed for production.
-It exists primarily to get you started quickly with learning and prototyping in Angular 2**
+It exists primarily to get you started quickly with learning and prototyping in Angular**
We are unlikely to accept suggestions about how to grow this QuickStart into something it is not.
Please keep that in mind before posting issues and PRs.
+## Updating to a newer version of the Quickstart Repo
+
+From time to time the QuickStart will be enhanced with support for new features or to reflect
+changes to the [official Style Guide](https://angular.io/docs/ts/latest/guide/style-guide.html).
+
+You can update your existing project to an up-to-date QuickStart by following these instructions:
+- Create a new project using the [instructions below](#create-a-new-project-based-on-the-quickstart)
+- Copy the code you have in your project's `main.ts` file onto `src/app/main.ts` in the new project
+- Copy your old `app` folder into `src/app`
+- Delete `src/app/main.ts` if you have one (we now use `src/main.ts` instead)
+- Copy your old `index.html`, `styles.css` and `tsconfig.json` into `src/`
+- Install all your third party dependencies
+- Copy your old `e2e/` folder into `e2e/`
+- Copy over any other files you added to your project
+- Copy your old `.git` folder into your new project's root
+
+Now you can continue working on the new project.
+
## Prerequisites
-Node.js and npm are essential to Angular 2 development.
+Node.js and npm are essential to Angular development.
Get it now if it's not already installed on your machine.
-**Verify that you are running at least node `v5.x.x` and npm `3.x.x`**
+**Verify that you are running at least node `v4.x.x` and npm `3.x.x`**
by running `node -v` and `npm -v` in a terminal/console window.
Older versions produce errors.
@@ -27,16 +54,35 @@ We recommend [nvm](https://github.com/creationix/nvm) for managing multiple vers
## Create a new project based on the QuickStart
Clone this repo into new project folder (e.g., `my-proj`).
-```bash
-git clone https://github.com/angular/quickstart my-proj
+```shell
+git clone https://github.com/angular/quickstart my-proj
cd my-proj
```
We have no intention of updating the source on `angular/quickstart`.
-Discard everything "git-like" by deleting the `.git` folder.
-```bash
-rm -rf .git // non-Windows
-rd .git /S/Q // windows
+Discard the `.git` folder..
+```shell
+rm -rf .git # OS/X (bash)
+rd .git /S/Q # windows
+```
+### Delete _non-essential_ files (optional)
+
+You can quickly delete the _non-essential_ files that concern testing and QuickStart repository maintenance
+(***including all git-related artifacts*** such as the `.git` folder and `.gitignore`!)
+by entering the following commands while in the project folder:
+
+##### OS/X (bash)
+```shell
+xargs rm -rf < non-essential-files.osx.txt
+rm src/app/*.spec*.ts
+rm non-essential-files.osx.txt
+```
+
+##### Windows
+```shell
+for /f %i in (non-essential-files.txt) do del %i /F /S /Q
+rd .git /s /q
+rd e2e /s /q
```
### Create a new git repo
@@ -44,16 +90,19 @@ You could [start writing code](#start-development) now and throw it all away whe
If you'd rather preserve your work under source control, consider taking the following steps.
Initialize this project as a *local git repo* and make the first commit:
-```bash
+```shell
git init
git add .
git commit -m "Initial commit"
```
+>Recover the deleted `.gitignore` from the QuickStart repository
+if you lost it in the _Delete non-essential files_ step.
+
Create a *remote repository* for this project on the service of your choice.
Grab its address (e.g. *`https://github.com//my-proj.git`*) and push the *local repo* to the *remote*.
-```bash
+```shell
git remote add origin
git push -u origin master
```
@@ -63,22 +112,18 @@ git push -u origin master
Install the npm packages described in the `package.json` and verify that it works:
-**Attention Windows Developers: You must run all of these commands in administrator mode**.
-
-```bash
+```shell
npm install
npm start
```
-> If the `typings` folder doesn't show up after `npm install` please install them manually with:
-
-> `npm run typings -- install`
+>Doesn't work in _Bash for Windows_ which does not support servers as of January, 2017.
The `npm start` command first compiles the application,
then simultaneously re-compiles and runs the `lite-server`.
Both the compiler and the server watch for file changes.
-Shut it down manually with Ctrl-C.
+Shut it down manually with `Ctrl-C`.
You're ready to write your application.
@@ -87,17 +132,16 @@ You're ready to write your application.
We've captured many of the most useful commands in npm scripts defined in the `package.json`:
* `npm start` - runs the compiler and a server at the same time, both in "watch mode".
-* `npm run tsc` - runs the TypeScript compiler once.
-* `npm run tsc:w` - runs the TypeScript compiler in watch mode; the process keeps running, awaiting changes to TypeScript files and re-compiling when it sees them.
-* `npm run lite` - runs the [lite-server](https://www.npmjs.com/package/lite-server), a light-weight, static file server, written and maintained by
+* `npm run build` - runs the TypeScript compiler once.
+* `npm run build:w` - runs the TypeScript compiler in watch mode; the process keeps running, awaiting changes to TypeScript files and re-compiling when it sees them.
+* `npm run serve` - runs the [lite-server](https://www.npmjs.com/package/lite-server), a light-weight, static file server, written and maintained by
[John Papa](https://github.com/johnpapa) and
[Christopher Martin](https://github.com/cgmartin)
with excellent support for Angular apps that use routing.
-* `npm run typings` - runs the typings tool.
-* `npm run postinstall` - called by *npm* automatically *after* it successfully completes package installation. This script installs the TypeScript definition files this app requires.
+
Here are the test related scripts:
* `npm test` - compiles, runs and watches the karma unit tests
-* `npm run e2e` - run protractor e2e tests, written in JavaScript (*e2e-spec.js)
+* `npm run e2e` - compiles and run protractor e2e tests, written in Typescript (*e2e-spec.ts)
## Testing
@@ -110,9 +154,9 @@ These tools are configured for specific conventions described below.
We recommend that you shut down one before starting another.*
### Unit Tests
-TypeScript unit-tests are usually in the `app` folder. Their filenames must end in `.spec`.
+TypeScript unit-tests are usually in the `src/app` folder. Their filenames must end in `.spec.ts`.
-Look for the example `app/app.component.spec.ts`.
+Look for the example `src/app/app.component.spec.ts`.
Add more `.spec.ts` files as you wish; we configured karma to find them.
Run it with `npm test`
@@ -120,31 +164,32 @@ Run it with `npm test`
That command first compiles the application, then simultaneously re-compiles and runs the karma test-runner.
Both the compiler and the karma watch for (different) file changes.
-Shut it down manually with Ctrl-C.
+Shut it down manually with `Ctrl-C`.
Test-runner output appears in the terminal window.
We can update our app and our tests in real-time, keeping a weather eye on the console for broken tests.
-Karma is occasionally confused and it is often necessary to shut down its browser or even shut the command down (Ctrl-C) and
+Karma is occasionally confused and it is often necessary to shut down its browser or even shut the command down (`Ctrl-C`) and
restart it. No worries; it's pretty quick.
-The `HTML-Reporter` is also wired in. That produces a prettier output; look for it in `~_test-output/tests.html`.
-
### End-to-end (E2E) Tests
-E2E tests are in the `e2e` directory, side by side with the `app` folder.
+E2E tests are in the `e2e` directory, side by side with the `src` folder.
Their filenames must end in `.e2e-spec.ts`.
Look for the example `e2e/app.e2e-spec.ts`.
Add more `.e2e-spec.js` files as you wish (although one usually suffices for small projects);
-we configured protractor to find them.
+we configured Protractor to find them.
Thereafter, run them with `npm run e2e`.
-That command first compiles, then simultaneously starts the Http-Server at `localhost:8080`
-and launches protractor.
+That command first compiles, then simultaneously starts the `lite-server` at `localhost:8080`
+and launches Protractor.
The pass/fail test results appear at the bottom of the terminal window.
A custom reporter (see `protractor.config.js`) generates a `./_test-output/protractor-results.txt` file
which is easier to read; this file is excluded from source control.
-Shut it down manually with Ctrl-C.
+Shut it down manually with `Ctrl-C`.
+
+[travis-badge]: https://travis-ci.org/angular/quickstart.svg?branch=master
+[travis-badge-url]: https://travis-ci.org/angular/quickstart
diff --git a/app/app.component.spec.ts b/app/app.component.spec.ts
deleted file mode 100644
index d1f2a8cfd..000000000
--- a/app/app.component.spec.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import { AppComponent } from './app.component';
-
-import { async, inject } from '@angular/core/testing';
-
-import { TestComponentBuilder } from '@angular/core/testing';
-
-import { By } from '@angular/platform-browser';
-import { provide } from '@angular/core';
-import { ViewMetadata } from '@angular/core';
-import { PromiseWrapper } from '@angular/core/src/facade/promise';
-
-//////// SPECS /////////////
-
-/// Delete this
-describe('Smoke test', () => {
- it('should run a passing test', () => {
- expect(true).toEqual(true, 'should pass');
- });
-});
-
-describe('AppComponent with TCB', function () {
-
- it('should instantiate component',
- async(inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
-
- tcb.createAsync(AppComponent).then(fixture => {
- expect(fixture.componentInstance instanceof AppComponent).toBe(true, 'should create AppComponent');
- });
- })));
-
- it('should have expected
text',
- async(inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
-
- tcb.createAsync(AppComponent).then(fixture => {
- // fixture.detectChanges(); // would need to resolve a binding but we don't have a binding
-
- let h1 = fixture.debugElement.query(el => el.name === 'h1').nativeElement; // it works
-
- h1 = fixture.debugElement.query(By.css('h1')).nativeElement; // preferred
-
- expect(h1.innerText).toMatch(/angular 2 app/i, '
should say something about "Angular 2 App"');
- });
-
- })));
-});
diff --git a/app/app.component.ts b/app/app.component.ts
deleted file mode 100644
index da0e1ba7a..000000000
--- a/app/app.component.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
- selector: 'my-app',
- template: '
My First Angular 2 App
'
-})
-export class AppComponent { }
diff --git a/app/main.ts b/app/main.ts
deleted file mode 100644
index ad256f082..000000000
--- a/app/main.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import { bootstrap } from '@angular/platform-browser-dynamic';
-
-import { AppComponent } from './app.component';
-
-bootstrap(AppComponent);
diff --git a/bs-config.e2e.json b/bs-config.e2e.json
new file mode 100644
index 000000000..24570dbcc
--- /dev/null
+++ b/bs-config.e2e.json
@@ -0,0 +1,14 @@
+{
+ "open": false,
+ "logLevel": "silent",
+ "port": 8080,
+ "server": {
+ "baseDir": "src",
+ "routes": {
+ "/node_modules": "node_modules"
+ },
+ "middleware": {
+ "0": null
+ }
+ }
+}
diff --git a/bs-config.json b/bs-config.json
new file mode 100644
index 000000000..4e5859526
--- /dev/null
+++ b/bs-config.json
@@ -0,0 +1,8 @@
+{
+ "server": {
+ "baseDir": "src",
+ "routes": {
+ "/node_modules": "node_modules"
+ }
+ }
+}
diff --git a/e2e/app.e2e-spec.ts b/e2e/app.e2e-spec.ts
index 54ba789f7..67f5d8d6a 100644
--- a/e2e/app.e2e-spec.ts
+++ b/e2e/app.e2e-spec.ts
@@ -1,8 +1,8 @@
+import { browser, element, by } from 'protractor';
describe('QuickStart E2E Tests', function () {
- let expectedMsg = 'My First Angular 2 App';
-
+ let expectedMsg = 'Hello Angular';
beforeEach(function () {
browser.get('');
diff --git a/tsconfig.json b/e2e/tsconfig.json
similarity index 89%
rename from tsconfig.json
rename to e2e/tsconfig.json
index fd1d10190..2c7260d1b 100644
--- a/tsconfig.json
+++ b/e2e/tsconfig.json
@@ -6,7 +6,7 @@
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
- "removeComments": false,
+ "lib": [ "es2015", "dom" ],
"noImplicitAny": true,
"suppressImplicitAnyIndexErrors": true
}
diff --git a/karma-test-shim.js b/karma-test-shim.js
index ec50e1ff6..fe5aa7761 100644
--- a/karma-test-shim.js
+++ b/karma-test-shim.js
@@ -1,21 +1,32 @@
// /*global jasmine, __karma__, window*/
-Error.stackTraceLimit = Infinity;
+Error.stackTraceLimit = 0; // "No stacktrace"" is usually best for app testing.
+
+// Uncomment to get full stacktrace output. Sometimes helpful, usually not.
+// Error.stackTraceLimit = Infinity; //
+
jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;
-__karma__.loaded = function () {
-};
+// builtPaths: root paths for output ("built") files
+// get from karma.config.js, then prefix with '/base/' (default is 'src/')
+var builtPaths = (__karma__.config.builtPaths || ['src/'])
+ .map(function(p) { return '/base/'+p;});
+
+__karma__.loaded = function () { };
function isJsFile(path) {
return path.slice(-3) == '.js';
}
function isSpecFile(path) {
- return /\.spec\.js$/.test(path);
+ return /\.spec\.(.*\.)?js$/.test(path);
}
+// Is a "built" file if is JavaScript file in one of the "built" folders
function isBuiltFile(path) {
- var builtPath = '/base/app/';
- return isJsFile(path) && (path.substr(0, builtPath.length) == builtPath);
+ return isJsFile(path) &&
+ builtPaths.reduce(function(keep, bp) {
+ return keep || (path.substr(0, bp.length) === bp);
+ }, false);
}
var allSpecFiles = Object.keys(window.__karma__.files)
@@ -23,32 +34,63 @@ var allSpecFiles = Object.keys(window.__karma__.files)
.filter(isBuiltFile);
System.config({
- baseURL: '/base',
- packageWithIndex: true // sadly, we can't use umd packages (yet?)
+ // Base URL for System.js calls. 'base/' is where Karma serves files from.
+ baseURL: 'base/src',
+ // Extend usual application package list with test folder
+ packages: { 'testing': { main: 'index.js', defaultExtension: 'js' } },
+
+ // Assume npm: is set in `paths` in systemjs.config
+ // Map the angular testing umd bundles
+ map: {
+ '@angular/core/testing': 'npm:@angular/core/bundles/core-testing.umd.js',
+ '@angular/common/testing': 'npm:@angular/common/bundles/common-testing.umd.js',
+ '@angular/compiler/testing': 'npm:@angular/compiler/bundles/compiler-testing.umd.js',
+ '@angular/platform-browser/testing': 'npm:@angular/platform-browser/bundles/platform-browser-testing.umd.js',
+ '@angular/platform-browser-dynamic/testing': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic-testing.umd.js',
+ '@angular/http/testing': 'npm:@angular/http/bundles/http-testing.umd.js',
+ '@angular/router/testing': 'npm:@angular/router/bundles/router-testing.umd.js',
+ '@angular/forms/testing': 'npm:@angular/forms/bundles/forms-testing.umd.js',
+ },
});
System.import('systemjs.config.js')
- .then(function () {
- return Promise.all([
- System.import('@angular/core/testing'),
- System.import('@angular/platform-browser-dynamic/testing')
- ])
- })
- .then(function (providers) {
- var testing = providers[0];
- var testingBrowser = providers[1];
+ .then(importSystemJsExtras)
+ .then(initTestBed)
+ .then(initTesting);
+
+/** Optional SystemJS configuration extras. Keep going w/o it */
+function importSystemJsExtras(){
+ return System.import('systemjs.config.extras.js')
+ .catch(function(reason) {
+ console.log(
+ 'Warning: System.import could not load the optional "systemjs.config.extras.js". Did you omit it by accident? Continuing without it.'
+ );
+ console.log(reason);
+ });
+}
- testing.setBaseTestProviders(
- testingBrowser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
- testingBrowser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);
+function initTestBed(){
+ return Promise.all([
+ System.import('@angular/core/testing'),
+ System.import('@angular/platform-browser-dynamic/testing')
+ ])
+ .then(function (providers) {
+ var coreTesting = providers[0];
+ var browserTesting = providers[1];
+
+ coreTesting.TestBed.initTestEnvironment(
+ browserTesting.BrowserDynamicTestingModule,
+ browserTesting.platformBrowserDynamicTesting());
})
- .then(function() {
- // Finally, load all spec files.
- // This will run the tests directly.
- return Promise.all(
- allSpecFiles.map(function (moduleName) {
- return System.import(moduleName);
- }));
- })
+}
+
+// Import all spec files and start karma
+function initTesting () {
+ return Promise.all(
+ allSpecFiles.map(function (moduleName) {
+ return System.import(moduleName);
+ })
+ )
.then(__karma__.start, __karma__.error);
+}
diff --git a/karma.conf.js b/karma.conf.js
index faa52df98..5a51e814f 100644
--- a/karma.conf.js
+++ b/karma.conf.js
@@ -1,17 +1,27 @@
module.exports = function(config) {
- var appBase = 'app/'; // transpiled app JS files
- var appAssets ='/base/app/'; // component assets fetched by Angular's compiler
+ var appBase = 'src/'; // transpiled app JS and map files
+ var appSrcBase = appBase; // app source TS files
+
+ // Testing helpers (optional) are conventionally in a folder called `testing`
+ var testingBase = 'testing/'; // transpiled test JS and map files
+ var testingSrcBase = 'testing/'; // test source TS files
config.set({
basePath: '',
frameworks: ['jasmine'],
+
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
- require('karma-htmlfile-reporter')
+ require('karma-jasmine-html-reporter')
],
+ client: {
+ builtPaths: [appBase, testingBase], // add more spec base paths as needed
+ clearContext: false // leave Jasmine Spec Runner output visible in browser
+ },
+
customLaunchers: {
// From the CLI. Not used here but interesting
// chrome setup for travis CI using chromium
@@ -20,6 +30,7 @@ module.exports = function(config) {
flags: ['--no-sandbox']
}
},
+
files: [
// System.js for module loading
'node_modules/systemjs/dist/system.src.js',
@@ -27,56 +38,54 @@ module.exports = function(config) {
// Polyfills
'node_modules/core-js/client/shim.js',
- // Reflect and Zone.js
- 'node_modules/reflect-metadata/Reflect.js',
+ // zone.js
'node_modules/zone.js/dist/zone.js',
+ 'node_modules/zone.js/dist/long-stack-trace-zone.js',
+ 'node_modules/zone.js/dist/proxy.js',
+ 'node_modules/zone.js/dist/sync-test.js',
'node_modules/zone.js/dist/jasmine-patch.js',
'node_modules/zone.js/dist/async-test.js',
'node_modules/zone.js/dist/fake-async-test.js',
- // RxJs.
+ // RxJs
{ pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false },
{ pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false },
- // Angular 2 itself and the testing library
- {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
- {pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false},
+ // Paths loaded via module imports:
+ // Angular itself
+ { pattern: 'node_modules/@angular/**/*.js', included: false, watched: false },
+ { pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false },
- {pattern: 'systemjs.config.js', included: false, watched: false},
- 'karma-test-shim.js',
+ { pattern: appBase + '/systemjs.config.js', included: false, watched: false },
+ { pattern: appBase + '/systemjs.config.extras.js', included: false, watched: false },
+ 'karma-test-shim.js', // optionally extend SystemJS mapping e.g., with barrels
// transpiled application & spec code paths loaded via module imports
- {pattern: appBase + '**/*.js', included: false, watched: true},
+ { pattern: appBase + '**/*.js', included: false, watched: true },
+ { pattern: testingBase + '**/*.js', included: false, watched: true },
- // asset (HTML & CSS) paths loaded via Angular's component compiler
- // (these paths need to be rewritten, see proxies section)
- {pattern: appBase + '**/*.html', included: false, watched: true},
- {pattern: appBase + '**/*.css', included: false, watched: true},
- // paths for debugging with source maps in dev tools
- {pattern: appBase + '**/*.ts', included: false, watched: false},
- {pattern: appBase + '**/*.js.map', included: false, watched: false}
+ // Asset (HTML & CSS) paths loaded via Angular's component compiler
+ // (these paths need to be rewritten, see proxies section)
+ { pattern: appBase + '**/*.html', included: false, watched: true },
+ { pattern: appBase + '**/*.css', included: false, watched: true },
+
+ // Paths for debugging with source maps in dev tools
+ { pattern: appBase + '**/*.ts', included: false, watched: false },
+ { pattern: appBase + '**/*.js.map', included: false, watched: false },
+ { pattern: testingSrcBase + '**/*.ts', included: false, watched: false },
+ { pattern: testingBase + '**/*.js.map', included: false, watched: false}
],
- // proxied base paths for loading assets
+ // Proxied base paths for loading assets
proxies: {
- // required for component assets fetched by Angular's compiler
- "/app/": appAssets
+ // required for modules fetched by SystemJS
+ '/base/src/node_modules/': '/base/node_modules/'
},
exclude: [],
preprocessors: {},
- reporters: ['progress', 'html'],
-
- // HtmlReporter configuration
- htmlReporter: {
- // Open this file to see results in browser
- outputFile: '_test-output/tests.html',
-
- // Optional
- pageTitle: 'Unit Tests',
- subPageTitle: __dirname
- },
+ reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
diff --git a/non-essential-files.osx.txt b/non-essential-files.osx.txt
new file mode 100644
index 000000000..653a8db9b
--- /dev/null
+++ b/non-essential-files.osx.txt
@@ -0,0 +1 @@
+.git .gitignore .travis.yml bs-config.e2e.json CHANGELOG.md e2e favicon.ico karma.conf.js karma-test-shim.js LICENSE non-essential-files.txt protractor.config.js README.md
\ No newline at end of file
diff --git a/non-essential-files.txt b/non-essential-files.txt
new file mode 100644
index 000000000..644808a66
--- /dev/null
+++ b/non-essential-files.txt
@@ -0,0 +1,15 @@
+.git
+.gitignore
+.travis.yml
+*.spec*.ts
+bs-config.e2e.json
+CHANGELOG.md
+e2e
+favicon.ico
+karma.conf.js
+karma-test-shim.js
+LICENSE
+non-essential-files.txt
+non-essential-files.osx.txt
+protractor.config.js
+README.md
diff --git a/package.json b/package.json
index a8a16fe1c..25513978a 100644
--- a/package.json
+++ b/package.json
@@ -1,65 +1,63 @@
{
- "name": "angular2-quickstart",
+ "name": "angular-quickstart",
"version": "1.0.0",
"description": "QuickStart package.json from the documentation, supplemented with testing support",
"scripts": {
- "start": "tsc && concurrently \"tsc -w\" \"lite-server\" ",
- "docker-build": "docker build -t ng2-quickstart .",
- "docker": "npm run docker-build && docker run -it --rm -p 3000:3000 -p 3001:3001 ng2-quickstart",
- "pree2e": "npm run webdriver:update",
- "e2e": "tsc && concurrently \"http-server -s\" \"protractor protractor.config.js\" --kill-others --success first",
- "lint": "tslint ./app/**/*.ts -t verbose",
- "lite": "lite-server",
- "postinstall": "typings install",
- "test": "tsc && concurrently \"tsc -w\" \"karma start karma.conf.js\"",
- "test-once": "tsc && karma start karma.conf.js --single-run",
- "tsc": "tsc",
- "tsc:w": "tsc -w",
- "typings": "typings",
- "webdriver:update": "webdriver-manager update"
+ "build": "tsc -p src/",
+ "build:watch": "tsc -p src/ -w",
+ "build:e2e": "tsc -p e2e/",
+ "serve": "lite-server -c=bs-config.json",
+ "serve:e2e": "lite-server -c=bs-config.e2e.json",
+ "prestart": "npm run build",
+ "start": "concurrently \"npm run build:watch\" \"npm run serve\"",
+ "pree2e": "npm run build:e2e",
+ "e2e": "concurrently \"npm run serve:e2e\" \"npm run protractor\" --kill-others --success first",
+ "preprotractor": "webdriver-manager update",
+ "protractor": "protractor protractor.config.js",
+ "pretest": "npm run build",
+ "test": "concurrently \"npm run build:watch\" \"karma start karma.conf.js\"",
+ "pretest:once": "npm run build",
+ "test:once": "karma start karma.conf.js --single-run",
+ "lint": "tslint ./src/**/*.ts -t verbose"
},
"keywords": [],
"author": "",
- "license": "ISC",
+ "license": "MIT",
"dependencies": {
- "@angular/common": "2.0.0-rc.4",
- "@angular/compiler": "2.0.0-rc.4",
- "@angular/core": "2.0.0-rc.4",
- "@angular/forms": "0.2.0",
- "@angular/http": "2.0.0-rc.4",
- "@angular/platform-browser": "2.0.0-rc.4",
- "@angular/platform-browser-dynamic": "2.0.0-rc.4",
- "@angular/router": "3.0.0-beta.2",
- "@angular/router-deprecated": "2.0.0-rc.2",
- "@angular/upgrade": "2.0.0-rc.4",
+ "@angular/common": "~4.3.4",
+ "@angular/compiler": "~4.3.4",
+ "@angular/core": "~4.3.4",
+ "@angular/forms": "~4.3.4",
+ "@angular/http": "~4.3.4",
+ "@angular/platform-browser": "~4.3.4",
+ "@angular/platform-browser-dynamic": "~4.3.4",
+ "@angular/router": "~4.3.4",
- "systemjs": "0.19.27",
- "core-js": "^2.4.0",
- "reflect-metadata": "^0.1.3",
- "rxjs": "5.0.0-beta.6",
- "zone.js": "^0.6.12",
-
- "angular2-in-memory-web-api": "0.0.14",
- "bootstrap": "^3.3.6"
+ "angular-in-memory-web-api": "~0.3.0",
+ "systemjs": "0.19.40",
+ "core-js": "^2.4.1",
+ "rxjs": "5.0.1",
+ "zone.js": "^0.8.4"
},
"devDependencies": {
- "concurrently": "^2.2.0",
- "lite-server": "^2.2.0",
- "typescript": "^1.8.10",
- "typings": "^1.0.4",
+ "concurrently": "^3.2.0",
+ "lite-server": "^2.2.2",
+ "typescript": "~2.1.0",
"canonical-path": "0.0.2",
- "http-server": "^0.9.0",
- "tslint": "^3.7.4",
- "lodash": "^4.11.1",
+ "tslint": "^3.15.1",
+ "lodash": "^4.16.4",
"jasmine-core": "~2.4.1",
- "karma": "^0.13.22",
- "karma-chrome-launcher": "^0.2.3",
- "karma-cli": "^0.1.2",
- "karma-htmlfile-reporter": "^0.2.2",
- "karma-jasmine": "^0.3.8",
- "protractor": "^3.3.0",
- "rimraf": "^2.5.2"
+ "karma": "^1.3.0",
+ "karma-chrome-launcher": "^2.0.0",
+ "karma-cli": "^1.0.1",
+ "karma-jasmine": "^1.0.2",
+ "karma-jasmine-html-reporter": "^0.2.2",
+ "protractor": "~4.0.14",
+ "rimraf": "^2.5.4",
+
+ "@types/node": "^6.0.46",
+ "@types/jasmine": "2.5.36"
},
"repository": {}
}
diff --git a/protractor.config.js b/protractor.config.js
index fcadab644..8d4e0416a 100644
--- a/protractor.config.js
+++ b/protractor.config.js
@@ -5,7 +5,7 @@
//
// AND THEN EVERYTIME ...
// 1. Compile with `tsc`
-// 2. Make sure the test server (e.g., http-server: localhost:8080) is running.
+// 2. Make sure the test server (e.g., lite-server: localhost:8080) is running.
// 3. ./node_modules/.bin/protractor protractor.config.js
//
// To do all steps, try: `npm run e2e`
@@ -30,7 +30,7 @@ exports.config = {
specs: ['**/*e2e-spec.js' ],
- // For angular2 tests
+ // For angular tests
useAllAngular2AppRoots: true,
// Base URL for application server
@@ -49,8 +49,6 @@ exports.config = {
// console.log('browser.params:' + JSON.stringify(browser.params));
jasmine.getEnv().addReporter(new Reporter( browser.params )) ;
- global.sendKeys = sendKeys;
-
// Allow changing bootstrap mode to NG1 for upgrade tests
global.setProtractorToNg1Mode = function() {
browser.useAllAngular2AppRoots = false;
@@ -66,16 +64,6 @@ exports.config = {
}
};
-// Hack - because of bug with protractor send keys
-function sendKeys(element, str) {
- return str.split('').reduce(function (promise, char) {
- return promise.then(function () {
- return element.sendKeys(char);
- });
- }, element.getAttribute('value'));
- // better to create a resolved promise here but ... don't know how with protractor;
- }
-
// Custom reporter
function Reporter(options) {
var _defaultOutputFile = path.resolve(process.cwd(), './_test-output', 'protractor-results.txt');
@@ -129,7 +117,26 @@ function Reporter(options) {
fs.appendFileSync(outputFile, output);
};
+ function ensureDirectoryExistence(filePath) {
+ var dirname = path.dirname(filePath);
+ if (directoryExists(dirname)) {
+ return true;
+ }
+ ensureDirectoryExistence(dirname);
+ fs.mkdirSync(dirname);
+ }
+
+ function directoryExists(path) {
+ try {
+ return fs.statSync(path).isDirectory();
+ }
+ catch (err) {
+ return false;
+ }
+ }
+
function initOutputFile(outputFile) {
+ ensureDirectoryExistence(outputFile);
var header = "Protractor results for: " + (new Date()).toLocaleString() + "\n\n";
fs.writeFileSync(outputFile, header);
}
diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts
new file mode 100644
index 000000000..776902446
--- /dev/null
+++ b/src/app/app.component.spec.ts
@@ -0,0 +1,33 @@
+import { AppComponent } from './app.component';
+
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { DebugElement } from '@angular/core';
+
+describe('AppComponent', function () {
+ let de: DebugElement;
+ let comp: AppComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ AppComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AppComponent);
+ comp = fixture.componentInstance;
+ de = fixture.debugElement.query(By.css('h1'));
+ });
+
+ it('should create component', () => expect(comp).toBeDefined() );
+
+ it('should have expected