Merge remote-tracking branch 'remotes/angular.io/master'

# Conflicts:
#	public/docs/ts/latest/cookbook/dependency-injection.jade
#	public/docs/ts/latest/guide/component-styles.jade
#	public/docs/ts/latest/guide/dependency-injection.jade
#	public/docs/ts/latest/guide/upgrade.jade

gulpfile.js

@@ -1076,7 +1076,7 @@ function getChangedExamplesForCommit(commit, relativePath) {
   return commit.getDiff().then(function(diffList) {
     var filePaths = [];
     diffList.forEach(function (diff) {
-      diff.patches().forEach(function (patch) {
+      diff.patches().then(function (patch) {
         if (patch.isAdded() || patch.isModified) {
           var filePath = path.normalize(patch.newFile().path());
           var isExample = filePath.indexOf(relativePath) >= 0;

package.json

@@ -61,7 +61,7 @@
     "minimatch": "^2.0.10",
     "mkdirp": "^0.5.1",
     "node-html-encoder": "0.0.2",
-    "nodegit": "0.5.0",
+    "nodegit": "0.13.0",
     "path": "^0.11.14",
     "prompt": "^0.2.14",
     "protractor": "^3.0.0",

public/docs/_examples/cb-dependency-injection/e2e-spec.ts

@@ -35,16 +35,11 @@ describe('Dependency Injection Cookbook', function () {
       expect(sortedHero).toBeDefined();
     });
 
-    it('should render Hero of the Month when DI deps are defined using provide()', function () {
+    it('should render Hero of the Month', function () {
       let heroOfTheMonth = element.all(by.xpath('//h3[text()="Hero of the month"]')).get(0);
       expect(heroOfTheMonth).toBeDefined();
     });
 
-    it('should render Hero of the Month when DI deps are defined using provide object literal', function () {
-      let heroOfTheMonth = element.all(by.xpath('//h3[text()="Hero of the month 2"]')).get(0);
-      expect(heroOfTheMonth).toBeDefined();
-    });
-
     it('should render Hero Bios', function () {
       let heroBios = element.all(by.xpath('//h3[text()="Hero Bios"]')).get(0);
       expect(heroBios).toBeDefined();
@@ -60,16 +55,11 @@ describe('Dependency Injection Cookbook', function () {
       expect(magmaPhone).toBeDefined();
     });
 
-    it('should render Hero-of-the-Month runner-ups when DI deps are defined using provide()', function () {
+    it('should render Hero-of-the-Month runner-ups', function () {
       let runnersUp =  element(by.id('rups1')).getText();
       expect(runnersUp).toContain('RubberMan, Mr. Nice');
     });
 
-    it('should render Hero-of-the-Month runner-ups when DI deps are defined using provide object literal', function () {
-      let runnersUp =  element(by.id('rups2')).getText();
-      expect(runnersUp).toContain('RubberMan, Mr. Nice');
-    });
-
     it('should render DateLogger log entry in Hero-of-the-Month', function () {
       let logs =  element.all(by.id('logs')).get(0).getText();
       expect(logs).toContain('INFO: starting up at');

public/docs/_examples/cb-dependency-injection/ts/app/app.component.html

@@ -23,10 +23,6 @@
   <hero-of-the-month></hero-of-the-month>
 </div>
 
-<div class="di-component">
-  <hero-of-the-month-lit></hero-of-the-month-lit>
-</div>
-
 <div class="di-component">
   <h3>Unsorted Heroes</h3>
   <unsorted-heroes></unsorted-heroes>

public/docs/_examples/cb-dependency-injection/ts/app/app.component.ts

@@ -9,13 +9,10 @@ import { HeroesBaseComponent,
 import { HighlightDirective }          from './highlight.directive';
 import { ParentFinderComponent }       from './parent-finder.component';
 
-// Object Literal syntax
-import { HeroOfTheMonthLiteralsComponent } from './hero-of-the-month-literals.component';
-
 const DIRECTIVES = [
     HeroBiosComponent, HeroBiosAndContactsComponent,
     HeroesBaseComponent, SortedHeroesComponent,
-    HeroOfTheMonthComponent, HeroOfTheMonthLiteralsComponent,
+    HeroOfTheMonthComponent,
     HighlightDirective,
     ParentFinderComponent
 ];

public/docs/_examples/cb-dependency-injection/ts/app/hero-of-the-month-literals.component.ts

@@ -1,67 +0,0 @@
-/* tslint:disable:one-line:check-open-brace*/
-// #docplaster
-// #docregion opaque-token
-import { OpaqueToken } from '@angular/core';
-
-export const TITLE = new OpaqueToken('title');
-// #enddocregion opaque-token
-
-// #docregion hero-of-the-month
-import { Component, Inject } from '@angular/core';
-
-import { DateLoggerService,
-         MinimalLogger }     from './date-logger.service';
-import { Hero }              from './hero';
-import { HeroService }       from './hero.service';
-import { LoggerService }     from './logger.service';
-import { RUNNERS_UP,
-         runnersUpFactory }  from './runners-up';
-
-// #enddocregion hero-of-the-month
-// #docregion some-hero
-const someHero = new Hero(42, 'Magma', 'Had a great month!', '555-555-5555');
-// #enddocregion some-hero
-
-const template = `
-  <h3>{{title}}</h3>
-  <div>Winner: <strong>{{heroOfTheMonth.name}}</strong></div>
-  <div>Reason for award: <strong>{{heroOfTheMonth.description}}</strong></div>
-  <div>Runners-up: <strong id="rups2">{{runnersUp}}</strong></div>
-
-  <p>Logs:</p>
-  <div id="logs">
-    <div *ngFor="let log of logs">{{log}}</div>
-  </div>
-  `;
-
-// #docregion hero-of-the-month
-@Component({
-  selector: 'hero-of-the-month-lit',
-  template: template,
-  // #docregion providers-using-object-literals
-  providers: [
-    {provide: Hero,          useValue:    someHero},
-    {provide: TITLE,         useValue:    'Hero of the Month - Object Literals'},
-    {provide: HeroService,   useClass:    HeroService},
-    {provide: LoggerService, useClass:    DateLoggerService},
-    {provide: MinimalLogger, useExisting: LoggerService},
-    {provide: RUNNERS_UP,    useFactory:  runnersUpFactory(2), deps: [Hero, HeroService]}
-  ]
-  // #enddocregion providers-using-object-literals
-})
-export class HeroOfTheMonthLiteralsComponent {
-  logs: string[] = [];
-
-// #docregion ctor-signature
-  constructor(
-      logger: MinimalLogger,
-      public heroOfTheMonth: Hero,
-      @Inject(RUNNERS_UP) public runnersUp: string,
-      @Inject(TITLE) public title: string)
-// #enddocregion ctor-signature
-  {
-    this.logs = logger.logs;
-    logger.logInfo('starting up');
-  }
-}
-// #enddocregion hero-of-the-month

public/docs/_examples/cb-dependency-injection/ts/app/hero-of-the-month.component.ts

@@ -7,7 +7,7 @@ export const TITLE = new OpaqueToken('title');
 // #enddocregion opaque-token
 
 // #docregion hero-of-the-month
-import { Component, Inject, provide } from '@angular/core';
+import { Component, Inject } from '@angular/core';
 
 import { DateLoggerService,
          MinimalLogger }     from './date-logger.service';
@@ -40,20 +40,20 @@ const template = `
   template: template,
   providers: [
     // #docregion use-value
-    provide(Hero,          {useValue:    someHero}),
+    { provide: Hero,          useValue:    someHero },
     // #docregion provide-opaque-token
-    provide(TITLE,         {useValue:   'Hero of the Month'}),
+    { provide: TITLE,         useValue:   'Hero of the Month' },
     // #enddocregion provide-opaque-token
     // #enddocregion use-value
     // #docregion use-class
-    provide(HeroService,   {useClass:    HeroService}),
-    provide(LoggerService, {useClass:    DateLoggerService}),
+    { provide: HeroService,   useClass:    HeroService },
+    { provide: LoggerService, useClass:    DateLoggerService },
     // #enddocregion use-class
     // #docregion use-existing
-    provide(MinimalLogger, {useExisting: LoggerService}),
+    { provide: MinimalLogger, useExisting: LoggerService },
     // #enddocregion use-existing
     // #docregion provide-opaque-token, use-factory
-    provide(RUNNERS_UP,    {useFactory:  runnersUpFactory(2), deps: [Hero, HeroService]})
+    { provide: RUNNERS_UP,    useFactory:  runnersUpFactory(2), deps: [Hero, HeroService] }
     // #enddocregion provide-opaque-token, use-factory
   ]
 })

public/docs/_examples/cb-dependency-injection/ts/app/main.ts

@@ -1,6 +1,5 @@
 // #docregion
 import { bootstrap }        from '@angular/platform-browser-dynamic';
-import { provide }          from '@angular/core';
 import { XHRBackend }       from '@angular/http';
 import { ROUTER_PROVIDERS } from '@angular/router-deprecated';
 import { LocationStrategy,
@@ -15,10 +14,9 @@ import { AppComponent }     from './app.component';
 // #docregion bootstrap
 bootstrap(AppComponent, [
   ROUTER_PROVIDERS,
-  provide(LocationStrategy,
-         {useClass: HashLocationStrategy}),
+  { provide: LocationStrategy, useClass: HashLocationStrategy },
 
-  provide(XHRBackend, { useClass: InMemoryBackendService }), // in-mem server
-  provide(SEED_DATA,  { useClass: HeroData }) // in-mem server data
+  { provide: XHRBackend, useClass: InMemoryBackendService }, // in-mem server
+  { provide: SEED_DATA,  useClass: HeroData } // in-mem server data
 ]).catch((err: any) => console.error(err));
 // #enddocregion bootstrap

public/docs/_examples/cb-dependency-injection/ts/app/parent-finder.component.ts

@@ -22,14 +22,17 @@ const DifferentParent = Parent;
 const provideParent =
 // #enddocregion provide-parent, provide-the-parent
 // #docregion provide-parent
-  (component: any, parentType?: any) =>
-    provide(parentType || Parent, { useExisting: forwardRef(() => component) });
+  (component: any, parentType?: any) => {
+    return { provide: parentType || Parent, useExisting: forwardRef(() => component) }
+  };
 // #enddocregion provide-parent
 
 // Simpler syntax version that always provides the component in the name of `Parent`.
 const provideTheParent =
 // #docregion provide-the-parent
-  (component: any) => provide(Parent, { useExisting: forwardRef(() => component) });
+  (component: any) => {
+    return { provide: Parent, useExisting: forwardRef(() => component) }
+  };
 // #enddocregion provide-the-parent
 
 
@@ -105,7 +108,7 @@ const templateB = `
   selector:   'barry',
   template:   templateB,
   directives: C_DIRECTIVES,
-  providers:  [ provide(Parent, { useExisting: forwardRef(() => BarryComponent) }) ]
+  providers:  [{ provide: Parent, useExisting: forwardRef(() => BarryComponent) }]
 })
 export class BarryComponent implements Parent {
   name = 'Barry';
@@ -155,7 +158,7 @@ const B_DIRECTIVES = [ BarryComponent, BethComponent, BobComponent ];
     </div>`,
 // #enddocregion alex-1
 // #docregion alex-providers
-  providers: [ provide(Parent, { useExisting: forwardRef(() => AlexComponent) }) ],
+  providers: [{ provide: Parent, useExisting: forwardRef(() => AlexComponent) }],
 // #enddocregion alex-providers
 // #docregion alex-1
   directives: C_DIRECTIVES

public/docs/_examples/cb-ts-to-js/js/app/main.js

@@ -4,8 +4,6 @@
   // #enddocregion appimport
 
   // #docregion ng2import
-  var provide =
-    ng.core.provide;
   var bootstrap =
     ng.platformBrowserDynamic.bootstrap;
   var LocationStrategy =
@@ -25,10 +23,10 @@
     bootstrap(app.HeroDIComponent, [app.DataService]);
     bootstrap(app.HeroDIInlineComponent, [app.DataService]);
     bootstrap(app.HeroDIInjectComponent, [
-      ng.core.provide('heroName', {useValue: 'Windstorm'})
+      { provide: 'heroName', useValue: 'Windstorm' }
     ]);
     bootstrap(app.HeroDIInjectComponent2, [
-      ng.core.provide('heroName', {useValue: 'Bombasto'})
+      { provide: 'heroName', useValue: 'Bombasto' }
     ]);
     bootstrap(app.HeroDIInjectAdditionalComponent);
     bootstrap(app.HeroIOComponent);

public/docs/_examples/cb-ts-to-js/ts/app/main.ts

@@ -1,6 +1,4 @@
 // #docregion ng2import
-import { provide }
-  from '@angular/core';
 import { bootstrap }
   from '@angular/platform-browser-dynamic';
 import {
@@ -29,7 +27,7 @@ bootstrap(HeroComponent);
 bootstrap(HeroLifecycleComponent);
 bootstrap(HeroDIComponent, [DataService]);
 bootstrap(HeroDIInjectComponent, [
-  provide('heroName', {useValue: 'Windstorm'})
+  { provide: 'heroName', useValue: 'Windstorm' }
 ]);
 bootstrap(AppDIInjectAdditionalComponent);
 bootstrap(AppIOComponent);

public/docs/_examples/dependency-injection/dart/lib/providers_component.dart

@@ -27,38 +27,6 @@ class ProviderComponent1 {
   }
 }
 
-@Component(
-    selector: 'provider-2',
-    template: '{{log}}',
-    providers:
-      // #docregion providers-2
-      const [const Provider(Logger, useClass: Logger)]
-      // #enddocregion providers-2
-)
-class ProviderComponent2 {
-  String log;
-
-  ProviderComponent2(Logger logger) {
-    logger.log('Hello from logger provided with Provider class and useClass');
-    log = logger.logs[0];
-  }
-}
-
-/// Component just used to ensure that shared E2E tests pass.
-@Component(
-  selector: 'provider-3',
-  template: '{{log}}',
-  providers: const [const Provider(Logger, useClass: Logger)]
-)
-class ProviderComponent3 {
-  String log;
-
-  ProviderComponent3(Logger logger) {
-    logger.log('Hello from logger provided with useClass');
-    log = logger.logs[0];
-  }
-}
-
 /// Component just used to ensure that shared E2E tests pass.
 @Component(
   selector: 'provider-3a',
@@ -282,8 +250,6 @@ class ProviderComponent10 implements OnInit {
     template: '''
       <h2>Provider variations</h2>
       <div id="p1"><provider-1></provider-1></div>
-      <div id="p2"><provider-2></provider-2></div>
-      <div id="p3"><provider-3></provider-3></div>
       <div id="p3a"><provider-3a></provider-3a></div>
       <div id="p4"><provider-4></provider-4></div>
       <div id="p5"><provider-5></provider-5></div>
@@ -295,8 +261,6 @@ class ProviderComponent10 implements OnInit {
       <div id="p10"><provider-10></provider-10></div>''',
     directives: const [
       ProviderComponent1,
-      ProviderComponent2,
-      ProviderComponent3,
       ProviderComponent3a,
       ProviderComponent4,
       ProviderComponent5,

public/docs/_examples/dependency-injection/e2e-spec.ts

@@ -80,18 +80,8 @@ describe('Dependency Injection Tests', function () {
       expect(element(by.css('#p1')).getText()).toEqual(expectedMsg);
     });
 
-    it('P2 (Provider) displays as expected', function () {
-      expectedMsg = 'Hello from logger provided with Provider class and useClass';
-      expect(element(by.css('#p2')).getText()).toEqual(expectedMsg);
-    });
-
-    it('P3 (provide) displays as expected', function () {
-      expectedMsg = 'Hello from logger provided with useClass';
-      expect(element(by.css('#p3')).getText()).toEqual(expectedMsg);
-    });
-
     it('P3a (provide) displays as expected', function () {
-      expectedMsg = 'Hello from logger provided with {provide: Logger, useClass: Logger}';
+      expectedMsg = 'Hello from logger provided with { provide: Logger, useClass: Logger }';
       expect(element(by.css('#p3a')).getText()).toEqual(expectedMsg);
     });
 

public/docs/_examples/dependency-injection/ts/app/app.component.2.ts

@@ -4,7 +4,7 @@ import { Component }         from '@angular/core';
 import { CarComponent }      from './car/car.component';
 import { HeroesComponent }   from './heroes/heroes.component.1';
 
-import { provide, Inject }   from '@angular/core';
+import { Inject }   from '@angular/core';
 import { APP_CONFIG, AppConfig,
          HERO_DI_CONFIG }    from './app.config';
 import { Logger }            from './logger.service';
@@ -21,7 +21,7 @@ import { Logger }            from './logger.service';
   providers: [
     Logger,
    // #docregion providers
-    provide(APP_CONFIG, {useValue: HERO_DI_CONFIG})
+    { provide: APP_CONFIG, useValue: HERO_DI_CONFIG }
    // #enddocregion providers
   ]
 })

public/docs/_examples/dependency-injection/ts/app/app.component.ts

@@ -1,7 +1,7 @@
 // #docplaster
 // #docregion
 // #docregion imports
-import { Component, Inject, provide } from '@angular/core';
+import { Component, Inject } from '@angular/core';
 
 import { CarComponent }      from './car/car.component';
 import { HeroesComponent }   from './heroes/heroes.component';
@@ -37,7 +37,7 @@ import { ProvidersComponent } from './providers.component';
   providers: [
     Logger,
     UserService,
-    provide(APP_CONFIG, {useValue: HERO_DI_CONFIG})
+    { provide: APP_CONFIG, useValue: HERO_DI_CONFIG }
   ]
   // #enddocregion providers
 })

public/docs/_examples/dependency-injection/ts/app/heroes/hero.service.provider.ts

@@ -1,6 +1,4 @@
 // #docregion
-import { provide }     from '@angular/core';
-
 import { HeroService } from './hero.service';
 import { Logger }      from '../logger.service';
 import { UserService } from '../user.service';
@@ -13,8 +11,8 @@ let heroServiceFactory = (logger: Logger, userService: UserService) => {
 
 // #docregion provider
 export let heroServiceProvider =
-  provide(HeroService, {
+  { provide: HeroService,
     useFactory: heroServiceFactory,
     deps: [Logger, UserService]
-  });
+  };
 // #enddocregion provider

public/docs/_examples/dependency-injection/ts/app/providers.component.ts

@@ -1,8 +1,7 @@
 /* tslint:disable:one-line:check-open-brace*/
 // Examples of provider arrays
 // #docplaster
-import { Component, Inject, Injectable,
-         provide, Provider }    from '@angular/core';
+import { Component, Inject, Injectable } from '@angular/core';
 
 import { APP_CONFIG, AppConfig,
          HERO_DI_CONFIG }       from './app.config';
@@ -30,53 +29,19 @@ export class ProviderComponent1 {
   }
 }
 
-//////////////////////////////////////////
-@Component({
-  selector: 'provider-2',
-  template: template,
-  providers:
-    // #docregion providers-2
-    [new Provider(Logger, {useClass: Logger})]
-    // #enddocregion providers-2
-})
-export class ProviderComponent2 {
-  log: string;
-  constructor(logger: Logger) {
-    logger.log('Hello from logger provided with Provider class and useClass');
-    this.log = logger.logs[0];
-  }
-}
-
-//////////////////////////////////////////
-@Component({
-  selector: 'provider-3',
-  template: template,
-  providers:
-    // #docregion providers-3
-    [provide(Logger, {useClass: Logger})]
-    // #enddocregion providers-3
-})
-export class ProviderComponent3 {
-  log: string;
-  constructor(logger: Logger) {
-    logger.log('Hello from logger provided with useClass');
-    this.log = logger.logs[0];
-  }
-}
-
 //////////////////////////////////////////
 @Component({
   selector: 'provider-3a',
   template: template,
   providers:
     // #docregion providers-3a
-    [{provide: Logger, useClass: Logger}]
+    [{ provide: Logger, useClass: Logger }]
     // #enddocregion providers-3a
 })
 export class ProviderComponent3a {
   log: string;
   constructor(logger: Logger) {
-    logger.log('Hello from logger provided with {provide: Logger, useClass: Logger}');
+    logger.log('Hello from logger provided with { provide: Logger, useClass: Logger }');
     this.log = logger.logs[0];
   }
 }
@@ -89,7 +54,7 @@ class BetterLogger extends Logger {}
   template: template,
   providers:
     // #docregion providers-4
-    [provide(Logger, {useClass: BetterLogger})]
+    [{ provide: Logger, useClass: BetterLogger }]
     // #enddocregion providers-4
 })
 export class ProviderComponent4 {
@@ -119,7 +84,7 @@ class EvenBetterLogger extends Logger {
   providers:
     // #docregion providers-5
     [ UserService,
-      provide(Logger, {useClass: EvenBetterLogger}) ]
+      { provide: Logger, useClass: EvenBetterLogger }]
     // #enddocregion providers-5
 })
 export class ProviderComponent5 {
@@ -146,7 +111,7 @@ class OldLogger {
     // #docregion providers-6a
     [ NewLogger,
       // Not aliased! Creates two instances of `NewLogger`
-      provide(OldLogger, {useClass: NewLogger}) ]
+      { provide: OldLogger, useClass: NewLogger}]
     // #enddocregion providers-6a
 })
 export class ProviderComponent6a {
@@ -169,7 +134,7 @@ export class ProviderComponent6a {
     // #docregion providers-6b
     [ NewLogger,
       // Alias OldLogger w/ reference to NewLogger
-      provide(OldLogger, {useExisting: NewLogger}) ]
+      { provide: OldLogger, useExisting: NewLogger}]
     // #enddocregion providers-6b
 })
 export class ProviderComponent6b {
@@ -197,7 +162,7 @@ let silentLogger = {
   template: template,
   providers:
     // #docregion providers-7
-    [provide(Logger, {useValue: silentLogger})]
+    [{ provide: Logger, useValue: silentLogger }]
     // #enddocregion providers-7
 })
 export class ProviderComponent7 {
@@ -230,11 +195,11 @@ export class ProviderComponent8 {
   /*
    // #docregion providers-9-interface
    // FAIL!  Can't use interface as provider token
-   [provide(AppConfig, {useValue: HERO_DI_CONFIG})]
+   [{ provide: AppConfig, useValue: HERO_DI_CONFIG })]
    // #enddocregion providers-9-interface
    */
   // #docregion providers-9
-  providers: [provide(APP_CONFIG, {useValue: HERO_DI_CONFIG})]
+  providers: [{ provide: APP_CONFIG, useValue: HERO_DI_CONFIG }]
   // #enddocregion providers-9
 })
 export class ProviderComponent9 {
@@ -257,7 +222,7 @@ export class ProviderComponent9 {
 // Sample providers 1 to 7 illustrate a required logger dependency.
 // Optional logger, can be null
 // #docregion import-optional
-import {Optional} from '@angular/core';
+import { Optional } from '@angular/core';
 // #enddocregion import-optional
 
 let some_message: string = 'Hello from the injected logger';
@@ -286,8 +251,6 @@ export class ProviderComponent10 {
   template: `
   <h2>Provider variations</h2>
   <div id="p1"><provider-1></provider-1></div>
-  <div id="p2"><provider-2></provider-2></div>
-  <div id="p3"><provider-3></provider-3></div>
   <div id="p3a"><provider-3a></provider-3a></div>
   <div id="p4"><provider-4></provider-4></div>
   <div id="p5"><provider-5></provider-5></div>
@@ -300,8 +263,6 @@ export class ProviderComponent10 {
   `,
   directives: [
     ProviderComponent1,
-    ProviderComponent2,
-    ProviderComponent3,
     ProviderComponent3a,
     ProviderComponent4,
     ProviderComponent5,

public/docs/_examples/router-deprecated/ts/app/main.2.ts

@@ -8,7 +8,6 @@ import { bootstrap }         from '@angular/platform-browser-dynamic';
 import { ROUTER_PROVIDERS }  from '@angular/router-deprecated';
 
 // Add these symbols to override the `LocationStrategy`
-import { provide }           from '@angular/core';
 import { LocationStrategy,
         HashLocationStrategy } from '@angular/common';
 
@@ -27,7 +26,6 @@ import { AppComponent as ac } from './app.component.2';
 bootstrap(ac, [
 // #docregion
   ROUTER_PROVIDERS,
-  provide(LocationStrategy,
-         {useClass: HashLocationStrategy}) // .../#/crisis-center/
+  { provide: LocationStrategy, useClass: HashLocationStrategy } // .../#/crisis-center/
 ]);
 // #enddocregion

public/docs/_examples/router/ts/app/main.2.ts

@@ -8,7 +8,6 @@ import { bootstrap }            from '@angular/platform-browser-dynamic';
 import { ROUTER_PROVIDERS }     from '@angular/router';
 
 // Add these symbols to override the `LocationStrategy`
-import { provide }              from '@angular/core';
 import { LocationStrategy,
          HashLocationStrategy } from '@angular/common';
 
@@ -27,7 +26,6 @@ import {AppComponent as ac} from './app.component.2';
 bootstrap(ac, [
 // #docregion
   ROUTER_PROVIDERS,
-  provide(LocationStrategy,
-         {useClass: HashLocationStrategy}) // .../#/crisis-center/
+  { provide: LocationStrategy, useClass: HashLocationStrategy } // .../#/crisis-center/
 ]);
 // #enddocregion

public/docs/_examples/server-communication/ts/app/main.ts

@@ -1,7 +1,6 @@
 // #docplaster
 // #docregion final
 // Imports for loading & configuring the in-memory web api
-import { provide }    from '@angular/core';
 import { XHRBackend } from '@angular/http';
 
 import { InMemoryBackendService,
@@ -24,7 +23,7 @@ bootstrap(AppComponent, [ HTTP_PROVIDERS ]);
 // #docregion final
 bootstrap(AppComponent, [
     HTTP_PROVIDERS,
-    provide(XHRBackend, { useClass: InMemoryBackendService }), // in-mem server
-    provide(SEED_DATA,  { useClass: HeroData })                // in-mem server data
+    { provide: XHRBackend, useClass: InMemoryBackendService }, // in-mem server
+    { provide: SEED_DATA,  useClass: HeroData }                // in-mem server data
 ]);
 // #enddocregion final

public/docs/_examples/testing/ts/app/app.component.spec.ts

@@ -2,7 +2,7 @@
 import { AppComponent } from './app.component';
 
 import { By }                     from '@angular/platform-browser';
-import { DebugElement, provide  } from '@angular/core';
+import { DebugElement } from '@angular/core';
 
 import {
   beforeEach, beforeEachProviders,
@@ -28,8 +28,8 @@ describe('AppComponent', () => {
       .overrideDirective(AppComponent, RouterLink,   MockRouterLink)
       .overrideDirective(AppComponent, RouterOutlet, MockRouterOutlet)
       .overrideProviders(AppComponent, [
-        provide(HeroService, {useClass: MockHeroService}),
-        provide(Router,      {useClass: MockRouter}),
+        { provide: HeroService, useClass: MockHeroService},
+        { provide: Router,      useClass: MockRouter},
       ])
       .createAsync(AppComponent)
       .then(fix => {

public/docs/_examples/testing/ts/app/app.component.ts

@@ -13,6 +13,8 @@ import { HeroesComponent }     from './heroes.component';
 import { HeroDetailComponent } from './hero-detail.component';
 import { HeroService }         from './hero.service';
 
+import { BAG_DIRECTIVES, BAG_PROVIDERS } from './bag';
+
 @Component({
   selector: 'my-app',
   template: `
@@ -22,12 +24,23 @@ import { HeroService }         from './hero.service';
       <a [routerLink]="['Heroes']">Heroes</a>
     </nav>
     <router-outlet></router-outlet>
+    <hr>
+    <h1>Bag-a-specs</h1>
+    <my-if-parent-comp></my-if-parent-comp>
+    <h3>External Template Comp</h3>
+    <external-template-comp></external-template-comp>
+    <h3>Comp With External Template Comp</h3>
+    <comp-w-ext-comp></comp-w-ext-comp>
   `,
+  /*
+
+  */
   styleUrls: ['app/app.component.css'],
-  directives: [RouterLink, RouterOutlet],
+  directives: [RouterLink, RouterOutlet, BAG_DIRECTIVES],
   providers: [
     ROUTER_PROVIDERS,
-    HeroService
+    HeroService,
+    BAG_PROVIDERS
   ]
 })
 @RouteConfig([

public/docs/_examples/testing/ts/app/bad-tests.spec.ts

@@ -4,7 +4,7 @@
  * Tests that show what goes wrong when the tests are incorrectly written or have a problem
  */
 import {
-  BadTemplateUrl, ButtonComp,
+  BadTemplateUrlComp, ButtonComp,
   ChildChildComp, ChildComp, ChildWithChildComp,
   ExternalTemplateComp,
   FancyService, MockFancyService,
@@ -27,7 +27,6 @@ import {
 
 import { ComponentFixture, TestComponentBuilder } from '@angular/compiler/testing';
 
-import { provide }        from '@angular/core';
 import { ViewMetadata }   from '@angular/core';
 import { Observable }     from 'rxjs/Rx';
 
@@ -134,7 +133,7 @@ xdescribe('async & inject testing errors', () => {
 
     it('should fail with an error from a promise',
       async(inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
-        tcb.createAsync(BadTemplateUrl);
+        tcb.createAsync(BadTemplateUrlComp);
       })));
 
     itPromise.then(
@@ -145,7 +144,7 @@ xdescribe('async & inject testing errors', () => {
   }, 10000);
 
   describe('using beforeEachProviders', () => {
-    beforeEachProviders(() => [provide(FancyService, {useValue: new FancyService()})]);
+    beforeEachProviders(() => [{ provide: FancyService, useValue: new FancyService() }]);
 
     beforeEach(
         inject([FancyService], (service: FancyService) => { expect(service.value).toEqual('real value'); }));
@@ -155,7 +154,7 @@ xdescribe('async & inject testing errors', () => {
       it('should fail when the injector has already been used', () => {
         patchJasmineBeforeEach();
         expect(() => {
-          beforeEachProviders(() => [provide(FancyService, {useValue: new FancyService()})]);
+          beforeEachProviders(() => [{ provide: FancyService, useValue: new FancyService() }]);
         })
         .toThrowError('beforeEachProviders was called after the injector had been used ' +
                       'in a beforeEach or it block. This invalidates the test injector');

public/docs/_examples/testing/ts/app/bag.spec.ts

@@ -25,7 +25,6 @@ import {
 
 import { ComponentFixture, TestComponentBuilder } from '@angular/compiler/testing';
 
-import { provide }        from '@angular/core';
 import { ViewMetadata }   from '@angular/core';
 
 import { Observable }     from 'rxjs/Rx';
@@ -116,7 +115,7 @@ describe('using the test injector with the inject helper', () => {
 
   describe('setting up Providers with FancyService', () => {
     beforeEachProviders(() => [
-      provide(FancyService, {useValue: new FancyService()})
+      { provide: FancyService, useValue: new FancyService() }
     ]);
 
     it('should use FancyService',
@@ -183,7 +182,7 @@ describe('using the test injector with the inject helper', () => {
   describe('using `withProviders` for per-test provision', () => {
     it('should inject test-local FancyService for this test',
       // `withProviders`:  set up providers at individual test level
-      withProviders(() => [provide(FancyService, {useValue: {value: 'fake value'}})])
+      withProviders(() => [{ provide: FancyService, useValue: {value: 'fake value' }}])
 
       // now inject and test
         .inject([FancyService], (service: FancyService) => {
@@ -314,7 +313,7 @@ describe('test component builder', function() {
 
         tcb.overrideProviders(
               TestProvidersComp,
-              [provide(FancyService, {useClass: MockFancyService})]
+              [{ provide: FancyService, useClass: MockFancyService }]
             )
             .createAsync(TestProvidersComp)
             .then(fixture => {
@@ -329,7 +328,7 @@ describe('test component builder', function() {
 
         tcb.overrideViewProviders(
               TestViewProvidersComp,
-              [provide(FancyService, {useClass: MockFancyService})]
+              [{ provide: FancyService, useClass: MockFancyService }]
             )
             .createAsync(TestViewProvidersComp)
             .then(fixture => {
@@ -495,7 +494,7 @@ describe('tcb.overrideProviders', () => {
 
     tcb.overrideProviders(
           AnotherProvidersComp,
-          [provide(HeroService, {useValue: {}})]
+          [{ provide: HeroService, useValue: {}} ]
         )
         .createAsync(AnotherProvidersComp);
     })));

public/docs/_examples/testing/ts/app/bag.ts

@@ -1,6 +1,6 @@
 // Based on https://github.com/angular/angular/blob/master/modules/angular2/test/testing/testing_public_spec.ts
 /* tslint:disable:forin */
-import { Component, EventEmitter, Injectable, Input, Output,
+import { Component, EventEmitter, Injectable, Input, Output, Optional,
          OnInit, OnChanges, OnDestroy, SimpleChange } from '@angular/core';
 
 import { Observable }     from 'rxjs/Rx';
@@ -13,6 +13,8 @@ import { Observable }     from 'rxjs/Rx';
 export class FancyService {
   value: string = 'real value';
 
+  getValue() { return this.value; }
+
   getAsyncValue() { return Promise.resolve('async value'); }
 
   getObservableValue() { return Observable.of('observable value'); }
@@ -123,20 +125,36 @@ export class TestViewProvidersComp {
   constructor(private fancyService: FancyService) {}
 }
 
-
 @Component({
   moduleId: module.id,
   selector: 'external-template-comp',
   templateUrl: 'bag-external-template.html'
 })
-export class ExternalTemplateComp { }
+export class ExternalTemplateComp {
+  serviceValue: string;
 
+  constructor(@Optional() private service: FancyService) {  }
+
+  ngOnInit() {
+    if (this.service) { this.serviceValue = this.service.getValue(); }
+  }
+}
+
+@Component({
+  selector: 'comp-w-ext-comp',
+  template: `
+  <h3>comp-w-ext-comp</h3>
+  <external-template-comp></external-template-comp>
+  `,
+  directives: [ExternalTemplateComp]
+})
+export class CompWithCompWithExternalTemplate { }
 
 @Component({
   selector: 'bad-template-comp',
   templateUrl: 'non-existant.html'
 })
-export class BadTemplateUrl { }
+export class BadTemplateUrlComp { }
 
 
 ///////// MyIfChildComp ////////
@@ -222,3 +240,16 @@ export class MyIfParentComp implements OnInit {
     this.toggleLabel = this.showChild ? 'Close' : 'Show';
   }
 }
+
+export const BAG_PROVIDERS = [FancyService];
+
+export const BAG_DIRECTIVES = [
+  ButtonComp,
+  ChildChildComp, ChildComp, ChildWithChildComp,
+  ExternalTemplateComp, CompWithCompWithExternalTemplate,
+  InputComp,
+  MyIfComp, MyIfChildComp, MyIfParentComp,
+  MockChildComp, MockChildChildComp,
+  ParentComp,
+  TestProvidersComp, TestViewProvidersComp
+];

public/docs/_examples/testing/ts/app/dashboard.component.spec.ts

@@ -2,7 +2,6 @@
 import { DashboardComponent } from './dashboard.component';
 
 import { By }       from '@angular/platform-browser';
-import { provide  } from '@angular/core';
 
 import {
   beforeEach, beforeEachProviders,
@@ -74,9 +73,9 @@ describe('DashboardComponent', () => {
     beforeEachProviders(() => {
       mockHeroService = new MockHeroService();
       return [
-        provide(Router,      {useClass: MockRouter}),
-        provide(MockRouter,  {useExisting: Router}),
-        provide(HeroService, {useValue: mockHeroService})
+        { provide: Router,      useClass: MockRouter},
+        { provide: MockRouter,  useExisting: Router},
+        { provide: HeroService, useValue: mockHeroService }
       ];
     });
 

public/docs/_examples/testing/ts/app/expect-proper.ts

@@ -0,0 +1,9 @@
+// See https://github.com/angular/angular/issues/9017
+import { expect as expectCore} from '@angular/core/testing';
+import { NgMatchers } from '@angular/platform-browser/testing';
+
+export function expect(spy: Function): NgMatchers;
+export function expect(actual: any): NgMatchers;
+export function expect(actual: any): NgMatchers {
+  return expectCore(actual) as NgMatchers;
+}

public/docs/_examples/testing/ts/app/hero-detail.component.ts

@@ -5,7 +5,7 @@
 import { Component, OnInit } from '@angular/core';
 // #enddocregion import-oninit
 // #docregion import-route-params
-import {RouteParams} from '@angular/router-deprecated';
+import { RouteParams } from '@angular/router-deprecated';
 // #enddocregion import-route-params
 
 import { Hero } from './hero';

public/docs/_examples/testing/ts/app/http-hero.service.spec.ts

@@ -8,8 +8,6 @@ import {
 
 import { TestComponentBuilder } from '@angular/compiler/testing';
 
-import { provide } from '@angular/core';
-
 import {
   MockBackend,
   MockConnection } from '@angular/http/testing';
@@ -46,7 +44,7 @@ describe('Http-HeroService (mockBackend)', () => {
 
   beforeEachProviders(() => [
     HTTP_PROVIDERS,
-    provide(XHRBackend, {useClass: MockBackend})
+    { provide: XHRBackend, useClass: MockBackend }
   ]);
 
   it('can instantiate service when inject service',

public/docs/_examples/testing/ts/app/main.ts

@@ -1,6 +1,5 @@
 import { bootstrap }      from '@angular/platform-browser-dynamic';
 import { AppComponent }   from './app.component';
-import { MyIfParentComp } from './bag';
 
 bootstrap(AppComponent);
-bootstrap(MyIfParentComp);
+