diff --git a/public/docs/_examples/protractor-helpers.ts b/public/docs/_examples/protractor-helpers.ts index 0ddf0b0b27..166cd04366 100644 --- a/public/docs/_examples/protractor-helpers.ts +++ b/public/docs/_examples/protractor-helpers.ts @@ -32,17 +32,4 @@ export function setProtractorToNg1Mode(): void { export function setProtractorToHybridMode() { setProtractorToNg1Mode(); browser.ng12Hybrid = true; - // remove once waitForNg1AsyncBootstrap() is removed as well - browser.ignoreSynchronization = false; -} - -// TODO remove once all update adapter tests are moved to setProtractorToHybridMode -// Protractor doesn't support the UpgradeAdapter's asynchronous -// bootstrap with Angular 1 at the moment. Get around it by -// waiting for an element to get `ng-scope` class. -export function waitForNg1AsyncBootstrap() { - browser.ignoreSynchronization = true; - browser.driver.wait(function() { - return element(by.css('.ng-scope')).isPresent(); - }, 5000); } diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/e2e-spec.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/e2e-spec.ts index 3a5fb7307d..2ec8e37977 100644 --- a/public/docs/_examples/upgrade-phonecat-2-hybrid/e2e-spec.ts +++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/e2e-spec.ts @@ -1,17 +1,19 @@ 'use strict'; // necessary for es6 output in node import { browser, element, by } from 'protractor'; -import { setProtractorToNg1Mode, waitForNg1AsyncBootstrap } from '../protractor-helpers'; +import { setProtractorToHybridMode } from '../protractor-helpers'; // Angular E2E Testing Guide: // https://docs.angularjs.org/guide/e2e-testing describe('PhoneCat Application', function() { + beforeAll(function () { + setProtractorToHybridMode(); + }); + it('should redirect `index.html` to `index.html#!/phones', function() { browser.get('index.html'); - setProtractorToNg1Mode(); - waitForNg1AsyncBootstrap(); expect(browser.getLocationAbsUrl()).toBe('/phones'); }); @@ -19,8 +21,6 @@ describe('PhoneCat Application', function() { beforeEach(function() { browser.get('index.html#!/phones'); - setProtractorToNg1Mode(); - waitForNg1AsyncBootstrap(); }); it('should filter the phone list as a user types into the search box', function() { @@ -64,12 +64,12 @@ describe('PhoneCat Application', function() { ]); }); - fit('should render phone specific links', function() { + it('should render phone specific links', function() { let query = element(by.css('input')); query.sendKeys('nexus'); element.all(by.css('.phones li a')).first().click(); - waitForNg1AsyncBootstrap(); // Not sure why this is needed but it is. The route change works fine. + browser.sleep(200); // Not sure why this is needed but it is. The route change works fine. expect(browser.getLocationAbsUrl()).toBe('/phones/nexus-s'); }); @@ -79,8 +79,6 @@ describe('PhoneCat Application', function() { beforeEach(function() { browser.get('index.html#!/phones/nexus-s'); - setProtractorToNg1Mode(); - waitForNg1AsyncBootstrap(); }); it('should display the `nexus-s` page', function() { diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.module.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.module.ts index 7b47c03950..d288302597 100644 --- a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.module.ts +++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/app.module.ts @@ -1,6 +1,7 @@ // #docplaster // #docregion bare import { NgModule } from '@angular/core'; +import { UpgradeModule } from '@angular/upgrade/static'; import { BrowserModule } from '@angular/platform-browser'; // #enddocregion bare // #docregion httpmodule @@ -27,6 +28,7 @@ import { PhoneDetailComponent } from './phone-detail/phone-detail.component'; @NgModule({ imports: [ BrowserModule, + UpgradeModule, // #enddocregion bare HttpModule, // #enddocregion httpmodule, phone @@ -42,10 +44,27 @@ import { PhoneDetailComponent } from './phone-detail/phone-detail.component'; CheckmarkPipe // #docregion phonelist, phonedetail ], + entryComponents: [ + PhoneListComponent, + // #enddocregion phonelist + PhoneDetailComponent + // #enddocregion phonedetail + ], // #docregion phone - providers: [ Phone ] + providers: [ + Phone, + // #docregion routeparams + { + provide: '$routeParams', + useFactory: (i: any) => i.get('$routeParams'), + deps: ['$injector'] + } + // #enddocregion routeparams + ] // #docregion bare, httpmodule, phonelist }) -export class AppModule {} +export class AppModule { + ngDoBootstrap() {} +} // #enddocregion httpmodule, phone, phonelist, phonedetail, checkmarkpipe // #enddocregion bare diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/main.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/main.ts index 06c61fd0d4..cb2de7865b 100644 --- a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/main.ts +++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/main.ts @@ -1,6 +1,7 @@ // #docregion import-adapter -import { UpgradeAdapter } from '@angular/upgrade'; declare var angular: any; +import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; +import { UpgradeModule, downgradeComponent, downgradeInjectable } from '@angular/upgrade/static'; import { AppModule } from './app.module'; // #enddocregion import-adapter @@ -17,24 +18,24 @@ import { PhoneDetailComponent } from './phone-detail/phone-detail.component'; // #enddocregion phone-detail // #docregion init-adapter -let upgradeAdapter = new UpgradeAdapter(AppModule); +// let upgradeAdapter = new UpgradeAdapter(AppModule); // #enddocregion init-adapter // #docregion routeparams -upgradeAdapter.upgradeNg1Provider('$routeParams'); +// upgradeAdapter.upgradeNg1Provider('$routeParams'); // #enddocregion routeparams // #docregion phone-service angular.module('core.phone') - .factory('phone', upgradeAdapter.downgradeNg2Provider(Phone)); + .factory('phone', downgradeInjectable(Phone)); // #enddocregion phone-service // #docregion phone-list angular.module('phoneList') .directive( 'phoneList', - upgradeAdapter.downgradeNg2Component(PhoneListComponent) as angular.IDirectiveFactory + downgradeComponent({component: PhoneListComponent}) as angular.IDirectiveFactory ); // #enddocregion phone-list // #docregion phone-detail @@ -42,10 +43,14 @@ angular.module('phoneList') angular.module('phoneDetail') .directive( 'phoneDetail', - upgradeAdapter.downgradeNg2Component(PhoneDetailComponent) as angular.IDirectiveFactory + downgradeComponent({component: PhoneDetailComponent}) as angular.IDirectiveFactory ); // #enddocregion phone-detail // #docregion bootstrap -upgradeAdapter.bootstrap(document.documentElement, ['phonecatApp']); +// upgradeAdapter.bootstrap(document.documentElement, ['phonecatApp']); +platformBrowserDynamic().bootstrapModule(AppModule).then(platformRef => { + let upgrade = platformRef.injector.get(UpgradeModule) as UpgradeModule; + upgrade.bootstrap(document.body, ['phonecatApp'], {strictDi: true}); +}); // #enddocregion bootstrap diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/index.html b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/index.html index 29964a6b15..d4503ccc1d 100644 --- a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/index.html +++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/index.html @@ -32,6 +32,7 @@ +