feat: update to angular2 rc4

* changes to rc4

* fix: MdDataTable checkbox click

* fix: radio button example

* fix: router upgrade

* fix beforeEachProviders() and provide() deprecations

* remove MockAppliacationHref deprecated API

* wip update specs.

* fix: tests

* fix: MdDataTable rangeFormat issue

* fix examples with new angular forms, disabled deprecated forms.

* doc: update package.json about contributors

Fix #268
Fix #248

* fix: webpack module package version

* chore: fix issue where documentation was not highlighted on route change

 - rather than binding innerHTML, bind to content property and use setter to highlight whenever the value changes.
 - cleanup route param subscription when components route is destroyed

* fix: tests

* chore: drop IE9 and IE10 from testing and add Microsoft Edge

 BREAKING CHANGE: The automated builds will no longer execute tests against IE9 and IE10 browsers. IE11 and Microsoft Edge (currently 13.10586) will be tested.

* chore: Edge just cannot catch a break

 - travis is flaky on it, even though it runs reliably from my terminal

* chore(travis): remove unused firefox v30 reference

.travis.yml

@@ -1,7 +1,7 @@
 language: node_js
 sudo: false
 node_js:
-- '4.2.6'
+- '5.6.0'
 before_install:
 - npm install -g karma-cli typings
 - export CHROME_BIN=chromium-browser
@@ -17,9 +17,9 @@ install:
 - ./node_modules/.bin/grunt build
 
 script:
-#- karma start karma.sauce.conf.js --browsers MICROSOFTEDGE_V20.10240
-- karma start karma.sauce.conf.js --browsers IE_V9,IE_V10,IE_V11
-- karma start karma.sauce.conf.js --browsers FIREFOX_V40,FIREFOX_V30,FIREFOX_V35
+# TODO: When it can be run reliably from travis, add MICROSOFTEDGE_V13.10586
+- karma start karma.sauce.conf.js --browsers IE_V11
+- karma start karma.sauce.conf.js --browsers FIREFOX_V40,FIREFOX_V35
 - karma start karma.sauce.conf.js --browsers CHROME_VBETA,CHROME_VDEV,CHROME_V39,CHROME_V26
 - karma start karma.sauce.conf.js --browsers ANDROID_V5.1,ANDROID_V4.4
 after_script:

Gruntfile.js

@@ -213,7 +213,7 @@ module.exports = function (grunt) {
   grunt.loadNpmTasks('grunt-contrib-clean');
   grunt.loadNpmTasks('grunt-contrib-connect');
   grunt.loadNpmTasks('grunt-contrib-watch');
-  grunt.loadNpmTasks('grunt-contrib-sass');
+  grunt.loadNpmTasks('grunt-sass');
   grunt.loadNpmTasks('grunt-postcss');
   grunt.loadNpmTasks('grunt-notify');
   grunt.loadNpmTasks('grunt-karma');

config.karma.js

@@ -33,7 +33,8 @@ var packageNames = [
   '@angular/platform-browser',
   '@angular/platform-browser-dynamic',
   '@angular/router',
-  '@angular/router-deprecated',
+  '@angular/forms',
+  '@angular/router',
   '@angular/testing',
   '@angular/upgrade'
 ];

karma.conf.js

@@ -17,20 +17,36 @@ module.exports = function (config) {
     frameworks: ['jasmine'],
 
     files: [
-      { pattern: 'node_modules/es6-shim/es6-shim.js', included: true, watched: false },
-      { pattern: 'node_modules/zone.js/dist/zone.js', included: true, watched: false },
-      { pattern: 'node_modules/reflect-metadata/Reflect.js', included: true, watched: false },
-      { pattern: 'node_modules/systemjs/dist/system-polyfills.js', included: true, watched: false },
-      { pattern: 'node_modules/systemjs/dist/system.src.js', included: true, watched: false },
-      { pattern: 'node_modules/zone.js/dist/async-test.js', included: true, watched: false },
+      // Polyfills.
+      'node_modules/core-js/client/shim.min.js',
+
+      // System.js for module loading
+      // Polyfills.
+      'node_modules/core-js/client/shim.min.js',
+
+      // System.js for module loading
+      'node_modules/systemjs/dist/system.src.js',
+
+      // Zone.js dependencies
+      'node_modules/zone.js/dist/zone.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.
       { pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false },
-      { pattern: 'node_modules/@angular/**/*.js', included: false, watched: false },
+      { pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false },
+
+      // paths loaded via module imports
+      // Angular itself
+      { pattern: 'node_modules/@angular/**/*.js', included: false, watched: true },
       { pattern: 'node_modules/@angular2-material/**/*.js', included: false, watched: false },
       'karma.ie.shims.js',
       "config.karma.js",
       { pattern: 'dist/*.*', included: false, watched: true },
       { pattern: 'dist/components/**/*.js', included: false, watched: true },
       { pattern: 'dist/core/**/*.js', included: false, watched: true },
+      { pattern: 'node_modules/systemjs/dist/system-polyfills.js', included: false, watched: false }, // PhantomJS2 (and possibly others) might require it
       { pattern: 'dist/platform/**/*.js', included: false, watched: true },
       "karma.main.js"
     ],
@@ -45,7 +61,7 @@ module.exports = function (config) {
     // - Chrome, ChromeCanary, Firefox, Opera, Safari (only Mac), PhantomJS, IE (only Windows)
     browsers: process.env.TRAVIS ? ['Firefox'] : ['Chrome'],
     browserNoActivityTimeout: 15000,
-    singleRun: false,
+    singleRun: true,
     reportSlowerThan: 500,
     plugins: [
       'karma-*'

karma.sauce.conf.js

@@ -16,10 +16,8 @@ module.exports = function (config) {
     ['chrome', '39'],
     ['chrome', '26'],
 
-    ['microsoftedge', '20.10240', 'Windows 10'],
+    ['microsoftedge', '13.10586', 'Windows 10'],
     ['internet explorer', '11', 'Windows 10'],
-    ['internet explorer', '10', 'Windows 8'],
-    ['internet explorer', '9', 'Windows 7'],
 
     ['android', '5.1'],
     ['android', '4.4']

modules/site/angular-cli-build.js

@@ -20,7 +20,7 @@ module.exports = function(defaults) {
       'rxjs/**/*.js',
       'ng2-material/**/*.*',
       '@angular2-material/**/*.*',
-      '@angular/**/*.js'
+      '@angular/**/*.*'
     ]
   });
 };

modules/site/package.json

@@ -14,22 +14,22 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/common": "2.0.0-rc.1",
-    "@angular/compiler": "2.0.0-rc.1",
-    "@angular/core": "2.0.0-rc.1",
-    "@angular/http": "2.0.0-rc.1",
-    "@angular/platform-browser": "2.0.0-rc.1",
-    "@angular/platform-browser-dynamic": "2.0.0-rc.1",
-    "@angular/router": "2.0.0-rc.1",
-    "@angular2-material/checkbox": "2.0.0-alpha.5-2",
-    "@angular2-material/core": "2.0.0-alpha.5-2",
-    "@angular2-material/input": "2.0.0-alpha.5-2",
-    "@angular2-material/progress-bar": "2.0.0-alpha.5-2",
-    "@angular2-material/progress-circle": "2.0.0-alpha.5-2",
-    "@angular2-material/radio": "2.0.0-alpha.5-2",
-    "@angular2-material/sidenav": "2.0.0-alpha.5-2",
-    "@angular2-material/tabs": "^2.0.0-alpha.5-2",
-    "@angular2-material/toolbar": "2.0.0-alpha.5-2",
+    "@angular/common": "2.0.0-rc.4",
+    "@angular/compiler": "2.0.0-rc.4",
+    "@angular/core": "2.0.0-rc.4",
+    "@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-alpha.8",
+    "@angular2-material/checkbox": "2.0.0-alpha.6",
+    "@angular2-material/core": "2.0.0-alpha.6",
+    "@angular2-material/input": "2.0.0-alpha.6",
+    "@angular2-material/progress-bar": "2.0.0-alpha.6",
+    "@angular2-material/progress-circle": "2.0.0-alpha.6",
+    "@angular2-material/radio": "2.0.0-alpha.6",
+    "@angular2-material/sidenav": "2.0.0-alpha.6",
+    "@angular2-material/tabs": "^2.0.0-alpha.6",
+    "@angular2-material/toolbar": "2.0.0-alpha.6",
     "es6-shim": "^0.35.0",
     "highlightjs": "^8.7.0",
     "ng2-material": "file:../../dist",

modules/site/src/app/+components/components.component.html

@@ -7,5 +7,5 @@ <h1 class="examples-title">Examples</h1>
 <docs-highlight-container
   class="examples-intro"
   *ngIf="value.documentation"
-  selector="pre > code" [innerHtml]="value.documentation">
+  selector="pre > code" [content]="value.documentation">
 </docs-highlight-container>

modules/site/src/app/+components/components.component.spec.ts

@@ -1,14 +1,19 @@
 import {ComponentFixture, TestComponentBuilder} from '@angular/compiler/testing';
 import {Component} from '@angular/core';
-import {beforeEach, beforeEachProviders, describe, expect, it, inject} from '@angular/core/testing';
+import {addProviders, inject} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
 
 import {ComponentsComponent} from './components.component';
 
 describe('Component: Components', () => {
   let builder: TestComponentBuilder;
 
-  beforeEachProviders(() => [ComponentsComponent]);
+  beforeEach(() => {
+    addProviders([
+      ComponentsComponent,
+    ]);
+  });
+
   beforeEach(
       inject([TestComponentBuilder], function(tcb: TestComponentBuilder) { builder = tcb; }));
 

modules/site/src/app/+components/components.component.ts

@@ -1,8 +1,9 @@
-import {Component} from '@angular/core';
-import {OnActivate, RouteSegment, ROUTER_DIRECTIVES} from '@angular/router';
+import {Component, OnInit, OnDestroy} from '@angular/core';
+import {ActivatedRoute, ROUTER_DIRECTIVES} from '@angular/router';
 import {MATERIAL_DIRECTIVES} from 'ng2-material';
 import {ComponentsService, IComponentMeta, NavigationService, ExampleComponent} from '../shared';
 import {HighlightComponent, HighlightContainerComponent} from '../shared/highlight/index';
+import {Subscription} from 'rxjs/Subscription';
 
 
 @Component({
@@ -15,28 +16,39 @@ import {HighlightComponent, HighlightContainerComponent} from '../shared/highlig
     HighlightContainerComponent
   ]
 })
-export class ComponentsComponent implements OnActivate {
+export class ComponentsComponent implements OnInit, OnDestroy {
   public id: string;
 
   public value: IComponentMeta = <IComponentMeta>{};
 
   public next: IComponentMeta = null;
   public previous: IComponentMeta = null;
 
-  constructor(private _components: ComponentsService, private _navigation: NavigationService) {}
+  private subscription: Subscription;
 
-  routerOnActivate(curr: RouteSegment): void {
-    this.id = curr.getParam('id');
-    this._components.getComponent(this.id).then((c: IComponentMeta) => {
-      this.value = c;
-      document.title = 'ng2-material – ' + c.name;
-      this._navigation.currentTitle = c.name;
-      this._components.getNext(c).then((next: IComponentMeta) => {
-        this._navigation.nextLink = this._navigation.componentLink(next);
-      });
-      this._components.getPrevious(c).then((previous: IComponentMeta) => {
-        this._navigation.prevLink = this._navigation.componentLink(previous);
+  constructor(private _route: ActivatedRoute,
+              private _components: ComponentsService,
+              private _navigation: NavigationService) {}
+
+  ngOnInit(): void {
+    this.subscription = this._route.params.subscribe((params) => {
+      this.id = params['id'];
+      this._components.getComponent(this.id).then((c: IComponentMeta) => {
+        this.value = c;
+        document.title = 'ng2-material – ' + c.name;
+        this._navigation.currentTitle = c.name;
+        this._components.getNext(c).then((next: IComponentMeta) => {
+          this._navigation.nextLink = this._navigation.componentLink(next);
+        });
+        this._components.getPrevious(c).then((previous: IComponentMeta) => {
+          this._navigation.prevLink = this._navigation.componentLink(previous);
+        });
       });
     });
   }
+
+  ngOnDestroy(): any {
+    this.subscription.unsubscribe();
+  }
+
 }

modules/site/src/app/+index/index.component.spec.ts

@@ -1,14 +1,19 @@
 import {ComponentFixture, TestComponentBuilder} from '@angular/compiler/testing';
 import {Component} from '@angular/core';
-import {beforeEach, beforeEachProviders, describe, expect, it, inject} from '@angular/core/testing';
+import {addProviders, inject} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
 
 import {IndexComponent} from './index.component';
 
 describe('Component: Index', () => {
   let builder: TestComponentBuilder;
 
-  beforeEachProviders(() => [IndexComponent]);
+  beforeEach(() => {
+    addProviders([
+      IndexComponent,
+    ]);
+  });
+
   beforeEach(
       inject([TestComponentBuilder], function(tcb: TestComponentBuilder) { builder = tcb; }));
 

modules/site/src/app/examples/button/button-basic-usage.component.spec.ts

@@ -1,20 +1,17 @@
-import {
-  beforeEach,
-  beforeEachProviders,
-  describe,
-  expect,
-  it,
-  inject,
-} from '@angular/core/testing';
-import {ComponentFixture, TestComponentBuilder} from '@angular/compiler/testing';
+import {addProviders, inject, ComponentFixture, TestComponentBuilder} from '@angular/core/testing';
 import {Component} from '@angular/core';
 import {By} from '@angular/platform-browser';
 import {ButtonBasicUsageComponent} from './button-basic-usage.component';
 
 describe('Component: ButtonBasicUsage', () => {
   let builder: TestComponentBuilder;
 
-  beforeEachProviders(() => [ButtonBasicUsageComponent]);
+  beforeEach(() => {
+    addProviders([
+      ButtonBasicUsageComponent,
+    ]);
+  });
+
   beforeEach(
       inject([TestComponentBuilder], function(tcb: TestComponentBuilder) { builder = tcb; }));
 

modules/site/src/app/examples/card/card-action-buttons.component.spec.ts

@@ -1,11 +1,4 @@
-import {
-  beforeEach,
-  beforeEachProviders,
-  describe,
-  expect,
-  it,
-  inject,
-} from '@angular/core/testing';
+import {addProviders, inject} from '@angular/core/testing';
 import {ComponentFixture, TestComponentBuilder} from '@angular/compiler/testing';
 import {Component} from '@angular/core';
 import {By} from '@angular/platform-browser';
@@ -14,7 +7,12 @@ import {CardActionButtonsComponent} from './card-action-buttons.component';
 describe('Component: CardActionButtons', () => {
   let builder: TestComponentBuilder;
 
-  beforeEachProviders(() => [CardActionButtonsComponent]);
+  beforeEach(() => {
+    addProviders([
+      CardActionButtonsComponent,
+    ]);
+  });
+
   beforeEach(
       inject([TestComponentBuilder], function(tcb: TestComponentBuilder) { builder = tcb; }));
 

modules/site/src/app/examples/card/card-basic-usage.component.spec.ts

@@ -1,11 +1,4 @@
-import {
-  beforeEach,
-  beforeEachProviders,
-  describe,
-  expect,
-  it,
-  inject,
-} from '@angular/core/testing';
+import {addProviders, inject} from '@angular/core/testing';
 import {ComponentFixture, TestComponentBuilder} from '@angular/compiler/testing';
 import {Component} from '@angular/core';
 import {By} from '@angular/platform-browser';
@@ -14,7 +7,12 @@ import {CardBasicUsageComponent} from './card-basic-usage.component';
 describe('Component: CardBasicUsage', () => {
   let builder: TestComponentBuilder;
 
-  beforeEachProviders(() => [CardBasicUsageComponent]);
+  beforeEach(() => {
+    addProviders([
+      CardBasicUsageComponent,
+    ]);
+  });
+
   beforeEach(
       inject([TestComponentBuilder], function(tcb: TestComponentBuilder) { builder = tcb; }));
 

modules/site/src/app/examples/card/card-inline-actions.component.spec.ts

@@ -1,11 +1,4 @@
-import {
-  beforeEach,
-  beforeEachProviders,
-  describe,
-  expect,
-  it,
-  inject,
-} from '@angular/core/testing';
+import {addProviders, inject} from '@angular/core/testing';
 import {ComponentFixture, TestComponentBuilder} from '@angular/compiler/testing';
 import {Component} from '@angular/core';
 import {By} from '@angular/platform-browser';
@@ -14,7 +7,12 @@ import {CardInlineActionsComponent} from './card-inline-actions.component';
 describe('Component: CardInlineActions', () => {
   let builder: TestComponentBuilder;
 
-  beforeEachProviders(() => [CardInlineActionsComponent]);
+  beforeEach(() => {
+    addProviders([
+      CardInlineActionsComponent,
+    ]);
+  });
+
   beforeEach(
       inject([TestComponentBuilder], function(tcb: TestComponentBuilder) { builder = tcb; }));