From 23c36a24ede7483a032f19a186ec29f7301768eb Mon Sep 17 00:00:00 2001 From: George Kalpakas Date: Mon, 23 Nov 2020 20:17:10 +0200 Subject: [PATCH] test(docs-infra): disable the Selenium Promise Manager in docs examples e2e tests (#39818) This commit disables the Selenium Promise Manager when running e2e tests for docs examples in order to more closely align them with new apps created with CLI v11. This change requires that any async operations in tests are handled explicitly (e.g. using `async/await` or `Promise#then()`). PR Close #39818 --- .../accessibility/e2e/src/app.e2e-spec.ts | 16 +- .../e2e/src/app.e2e-spec.ts | 71 ++++--- .../animations/e2e/src/app.e2e-spec.ts | 22 +- .../architecture/e2e/src/app.e2e-spec.ts | 26 +-- .../attribute-binding/e2e/src/app.e2e-spec.ts | 33 +-- .../e2e/src/app.e2e-spec.ts | 18 +- .../binding-syntax/e2e/src/app.e2e-spec.ts | 34 ++-- .../bootstrapping/e2e/src/app.e2e-spec.ts | 6 +- .../e2e/src/app.e2e-spec.ts | 53 +++-- .../e2e/src/app.e2e-spec.ts | 12 +- .../e2e/src/app.e2e-spec.ts | 50 ++--- .../e2e/src/app.e2e-spec.ts | 8 +- .../component-styles/e2e/src/app.e2e-spec.ts | 46 ++--- .../e2e/src/app.e2e-spec.ts | 36 ++-- .../e2e/src/app.e2e-spec.ts | 146 +++++++------- .../displaying-data/e2e/src/app.e2e-spec.ts | 20 +- .../docs-style-guide/e2e/src/app.e2e-spec.ts | 8 +- .../dynamic-form/e2e/src/app.e2e-spec.ts | 21 +- .../examples/elements/e2e/src/app.e2e-spec.ts | 70 +++---- .../event-binding/e2e/src/app.e2e-spec.ts | 54 +++-- .../feature-modules/e2e/src/app.e2e-spec.ts | 9 +- .../form-validation/e2e/src/app.e2e-spec.ts | 190 +++++++++--------- .../forms-overview/e2e/src/app.e2e-spec.ts | 12 +- .../examples/forms/e2e/src/app.e2e-spec.ts | 71 +++---- .../getting-started/e2e/src/app.e2e-spec.ts | 2 +- .../e2e/src/app.e2e-spec.ts | 87 ++++---- .../examples/http/e2e/src/app.e2e-spec.ts | 130 ++++++------ .../examples/i18n/e2e/src/app.e2e-spec.ts | 44 ++-- .../inputs-outputs/e2e/src/app.e2e-spec.ts | 22 +- .../interpolation/e2e/src/app.e2e-spec.ts | 42 ++-- .../e2e/src/app.e2e-spec.ts | 33 ++- .../lifecycle-hooks/e2e/src/app.e2e-spec.ts | 107 +++++----- .../ngmodules/e2e/src/app.e2e-spec.ts | 115 +++++------ .../examples/pipes/e2e/src/app.e2e-spec.ts | 122 ++++++----- .../property-binding/e2e/src/app.e2e-spec.ts | 52 +++-- .../e2e/src/app.e2e-spec.ts | 19 +- .../providers/e2e/src/app.e2e-spec.ts | 34 +--- .../reactive-forms/e2e/src/app.e2e-spec.ts | 7 +- .../e2e/src/app.e2e-spec.ts | 16 +- .../router-tutorial/e2e/src/app.e2e-spec.ts | 30 ++- .../examples/router/e2e/src/app.e2e-spec.ts | 63 +++--- .../examples/security/e2e/src/app.e2e-spec.ts | 24 +-- .../e2e/src/app.e2e-spec.ts | 41 ++-- .../e2e/src/app.e2e-spec.ts | 23 +-- .../src/app/app.component.ts | 28 +-- .../examples/setup/e2e/src/app.e2e-spec.ts | 8 +- .../e2e/src/app.e2e-spec.ts | 45 ++--- .../styleguide/e2e/src/app.e2e-spec.ts | 130 ++++++------ .../e2e/src/app.e2e-spec.ts | 22 +- .../e2e/src/app.e2e-spec.ts | 20 +- .../template-syntax/e2e/src/app.e2e-spec.ts | 32 ++- .../examples/testing/e2e/src/app.e2e-spec.ts | 13 +- .../examples/toh-pt0/e2e/src/app.e2e-spec.ts | 4 +- .../examples/toh-pt1/e2e/src/app.e2e-spec.ts | 15 +- .../examples/toh-pt2/e2e/src/app.e2e-spec.ts | 95 +++++---- .../examples/toh-pt3/e2e/src/app.e2e-spec.ts | 95 +++++---- .../examples/toh-pt4/e2e/src/app.e2e-spec.ts | 104 +++++----- .../examples/toh-pt5/e2e/src/app.e2e-spec.ts | 113 ++++++----- .../examples/toh-pt6/e2e/src/app.e2e-spec.ts | 161 ++++++++------- .../two-way-binding/e2e/src/app.e2e-spec.ts | 32 ++- .../universal/e2e/src/app.e2e-spec.ts | 144 ++++++------- .../examples/upgrade-module/e2e-spec.ts | 106 ++++------ .../upgrade-phonecat-1-typescript/e2e-spec.ts | 78 ++++--- .../upgrade-phonecat-2-hybrid/e2e-spec.ts | 68 +++---- .../upgrade-phonecat-3-final/e2e-spec.ts | 72 +++---- .../user-input/e2e/src/app.e2e-spec.ts | 90 ++++----- .../shared/boilerplate/cli-ajs/package.json | 1 - .../boilerplate/cli/e2e/protractor.conf.js | 1 + .../shared/boilerplate/cli/e2e/tsconfig.json | 1 - .../shared/boilerplate/cli/package.json | 1 - .../shared/boilerplate/elements/package.json | 1 - .../shared/boilerplate/i18n/package.json | 1 - .../boilerplate/service-worker/package.json | 1 - .../shared/boilerplate/systemjs/package.json | 1 - .../shared/boilerplate/universal/package.json | 1 - aio/tools/examples/shared/package.json | 1 - aio/tools/examples/shared/yarn.lock | 11 - 77 files changed, 1663 insertions(+), 1878 deletions(-) diff --git a/aio/content/examples/accessibility/e2e/src/app.e2e-spec.ts b/aio/content/examples/accessibility/e2e/src/app.e2e-spec.ts index 7da554198d197..9f95e2f9f25eb 100644 --- a/aio/content/examples/accessibility/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/accessibility/e2e/src/app.e2e-spec.ts @@ -2,18 +2,16 @@ import { browser, element, by } from 'protractor'; describe('Accessibility example e2e tests', () => { - beforeEach(() => { - browser.get(''); - }); + beforeEach(() => browser.get('')); - it('should display Accessibility Example', () => { - expect(element(by.css('h1')).getText()).toEqual('Accessibility Example'); + it('should display Accessibility Example', async () => { + expect(await element(by.css('h1')).getText()).toEqual('Accessibility Example'); }); - it('should take a number and change progressbar width', () => { - element(by.css('input')).sendKeys('16'); - expect(element(by.css('input')).getAttribute('value')).toEqual('16'); - expect(element(by.css('app-example-progressbar div')).getCssValue('width')).toBe('48px'); + it('should take a number and change progressbar width', async () => { + await element(by.css('input')).sendKeys('16'); + expect(await element(by.css('input')).getAttribute('value')).toEqual('16'); + expect(await element(by.css('app-example-progressbar div')).getCssValue('width')).toBe('48px'); }); }); diff --git a/aio/content/examples/ajs-quick-reference/e2e/src/app.e2e-spec.ts b/aio/content/examples/ajs-quick-reference/e2e/src/app.e2e-spec.ts index cc4c47c127b17..7a8e7e62181ff 100644 --- a/aio/content/examples/ajs-quick-reference/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/ajs-quick-reference/e2e/src/app.e2e-spec.ts @@ -2,15 +2,13 @@ import { browser, element, by } from 'protractor'; describe('AngularJS to Angular Quick Reference Tests', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('should display no poster images after bootstrap', () => { - testImagesAreDisplayed(false); + it('should display no poster images after bootstrap', async () => { + await testImagesAreDisplayed(false); }); - it('should display proper movie data', () => { + it('should display proper movie data', async () => { // We check only a few samples const expectedSamples: any[] = [ {row: 0, column: 0, element: 'img', attr: 'src', value: 'images/hero.png', contains: true}, @@ -34,8 +32,8 @@ describe('AngularJS to Angular Quick Reference Tests', () => { // Check element attribute or text const valueToCheck = sample.attr - ? elementToCheck.getAttribute(sample.attr) - : elementToCheck.getText(); + ? await elementToCheck.getAttribute(sample.attr) + : await elementToCheck.getText(); // Test for equals/contains/match if (sample.contains) { @@ -48,65 +46,64 @@ describe('AngularJS to Angular Quick Reference Tests', () => { } }); - it('should display images after Show Poster', () => { - testPosterButtonClick('Show Poster', true); + it('should display images after Show Poster', async () => { + await testPosterButtonClick('Show Poster', true); }); - it('should hide images after Hide Poster', () => { - testPosterButtonClick('Hide Poster', false); + it('should hide images after Hide Poster', async () => { + await testPosterButtonClick('Hide Poster', false); }); - it('should display no movie when no favorite hero is specified', () => { - testFavoriteHero(null, 'Please enter your favorite hero.'); + it('should display no movie when no favorite hero is specified', async () => { + await testFavoriteHero(null, 'Please enter your favorite hero.'); }); - it('should display no movie for Magneta', () => { - testFavoriteHero('Magneta', 'No movie, sorry!'); + it('should display no movie for Magneta', async () => { + await testFavoriteHero('Magneta', 'No movie, sorry!'); }); - it('should display a movie for Dr Nice', () => { - testFavoriteHero('Dr Nice', 'Excellent choice!'); + it('should display a movie for Dr Nice', async () => { + await testFavoriteHero('Dr Nice', 'Excellent choice!'); }); - function testImagesAreDisplayed(isDisplayed: boolean) { + async function testImagesAreDisplayed(isDisplayed: boolean) { const expectedMovieCount = 3; const movieRows = getMovieRows(); - expect(movieRows.count()).toBe(expectedMovieCount); + expect(await movieRows.count()).toBe(expectedMovieCount); for (let i = 0; i < expectedMovieCount; i++) { const movieImage = movieRows.get(i).element(by.css('td > img')); - expect(movieImage.isDisplayed()).toBe(isDisplayed); + expect(await movieImage.isDisplayed()).toBe(isDisplayed); } } - function testPosterButtonClick(expectedButtonText: string, isDisplayed: boolean) { + async function testPosterButtonClick(expectedButtonText: string, isDisplayed: boolean) { const posterButton = element(by.css('app-movie-list tr > th > button')); - expect(posterButton.getText()).toBe(expectedButtonText); + expect(await posterButton.getText()).toBe(expectedButtonText); - posterButton.click().then(() => { - testImagesAreDisplayed(isDisplayed); - }); + await posterButton.click(); + await testImagesAreDisplayed(isDisplayed); } function getMovieRows() { return element.all(by.css('app-movie-list tbody > tr')); } - function testFavoriteHero(heroName: string, expectedLabel: string) { + async function testFavoriteHero(heroName: string, expectedLabel: string) { const movieListComp = element(by.tagName('app-movie-list')); const heroInput = movieListComp.element(by.tagName('input')); const favoriteHeroLabel = movieListComp.element(by.tagName('h3')); const resultLabel = movieListComp.element(by.css('span > p')); - heroInput.clear().then(() => { - heroInput.sendKeys(heroName || ''); - expect(resultLabel.getText()).toBe(expectedLabel); - if (heroName) { - expect(favoriteHeroLabel.isDisplayed()).toBe(true); - expect(favoriteHeroLabel.getText()).toContain(heroName); - } else { - expect(favoriteHeroLabel.isDisplayed()).toBe(false); - } - }); + await heroInput.clear(); + await heroInput.sendKeys(heroName || ''); + + expect(await resultLabel.getText()).toBe(expectedLabel); + if (heroName) { + expect(await favoriteHeroLabel.isDisplayed()).toBe(true); + expect(await favoriteHeroLabel.getText()).toContain(heroName); + } else { + expect(await favoriteHeroLabel.isDisplayed()).toBe(false); + } } }); diff --git a/aio/content/examples/animations/e2e/src/app.e2e-spec.ts b/aio/content/examples/animations/e2e/src/app.e2e-spec.ts index 504b7ad6341df..f19b62f7ee2cb 100644 --- a/aio/content/examples/animations/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/animations/e2e/src/app.e2e-spec.ts @@ -1,4 +1,4 @@ -import { browser, ExpectedConditions as EC } from 'protractor'; +import { browser } from 'protractor'; import { logging } from 'selenium-webdriver'; import * as openClose from './open-close.po'; import * as statusSlider from './status-slider.po'; @@ -18,9 +18,7 @@ describe('Animation Tests', () => { const filterHref = getLinkById('heroes'); const heroGroupsHref = getLinkById('hero-groups'); - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); describe('Open/Close Component', () => { const closedHeight = '100px'; @@ -28,7 +26,7 @@ describe('Animation Tests', () => { beforeAll(async () => { await openCloseHref.click(); - sleepFor(); + await sleepFor(); }); it('should be open', async () => { @@ -84,7 +82,7 @@ describe('Animation Tests', () => { beforeAll(async () => { await statusSliderHref.click(); - sleepFor(2000); + await sleepFor(2000); }); it('should be inactive with a blue background', async () => { @@ -125,7 +123,7 @@ describe('Animation Tests', () => { describe('Toggle Animations Component', () => { beforeAll(async () => { await toggleHref.click(); - sleepFor(); + await sleepFor(); }); it('should disabled animations on the child element', async () => { @@ -143,7 +141,7 @@ describe('Animation Tests', () => { describe('Enter/Leave Component', () => { beforeAll(async () => { await enterLeaveHref.click(); - sleepFor(100); + await sleepFor(100); }); it('should attach a flyInOut trigger to the list of items', async () => { @@ -169,7 +167,7 @@ describe('Animation Tests', () => { describe('Auto Calculation Component', () => { beforeAll(async () => { await autoHref.click(); - sleepFor(0); + await sleepFor(0); }); it('should attach a shrinkOut trigger to the list of items', async () => { @@ -193,7 +191,7 @@ describe('Animation Tests', () => { describe('Filter/Stagger Component', () => { beforeAll(async () => { await filterHref.click(); - sleepFor(); + await sleepFor(); }); it('should attach a filterAnimations trigger to the list container', async () => { @@ -220,7 +218,7 @@ describe('Animation Tests', () => { describe('Hero Groups Component', () => { beforeAll(async () => { await heroGroupsHref.click(); - sleepFor(300); + await sleepFor(300); }); it('should attach a flyInOut trigger to the list of items', async () => { @@ -245,5 +243,3 @@ describe('Animation Tests', () => { }); }); }); - - diff --git a/aio/content/examples/architecture/e2e/src/app.e2e-spec.ts b/aio/content/examples/architecture/e2e/src/app.e2e-spec.ts index df32e14effcb1..4be469461f927 100644 --- a/aio/content/examples/architecture/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/architecture/e2e/src/app.e2e-spec.ts @@ -14,12 +14,12 @@ describe('Architecture', () => { beforeAll(() => browser.get('')); - it(`has title '${expectedTitle}'`, () => { - expect(browser.getTitle()).toEqual(expectedTitle); + it(`has title '${expectedTitle}'`, async () => { + expect(await browser.getTitle()).toEqual(expectedTitle); }); - it(`has h2 '${expectedH2}'`, () => { - const h2 = element.all(by.css('h2')).map((elt: any) => elt.getText()); + it(`has h2 '${expectedH2}'`, async () => { + const h2 = await element.all(by.css('h2')).map((elt: any) => elt.getText()); expect(h2).toEqual(expectedH2); }); @@ -31,14 +31,14 @@ function heroTests() { const targetHero: Hero = { id: 2, name: 'Dr Nice' }; - it('has the right number of heroes', () => { + it('has the right number of heroes', async () => { const page = getPageElts(); - expect(page.heroes.count()).toEqual(3); + expect(await page.heroes.count()).toEqual(3); }); - it('has no hero details initially', () => { + it('has no hero details initially', async () => { const page = getPageElts(); - expect(page.heroDetail.isPresent()).toBeFalsy('no hero detail'); + expect(await page.heroDetail.isPresent()).toBeFalsy('no hero detail'); }); it('shows selected hero details', async () => { @@ -51,7 +51,7 @@ function heroTests() { it(`shows updated hero name in details`, async () => { const input = element.all(by.css('input')).first(); - input.sendKeys(nameSuffix); + await input.sendKeys(nameSuffix); const page = getPageElts(); const hero = await heroFromDetail(page.heroDetail); const newName = targetHero.name + nameSuffix; @@ -61,15 +61,15 @@ function heroTests() { } function salesTaxTests() { - it('has no sales tax initially', () => { + it('has no sales tax initially', async () => { const page = getPageElts(); - expect(page.salesTaxDetail.isPresent()).toBeFalsy('no sales tax info'); + expect(await page.salesTaxDetail.isPresent()).toBeFalsy('no sales tax info'); }); it('shows sales tax', async () => { const page = getPageElts(); - page.salesTaxAmountInput.sendKeys('10', protractor.Key.ENTER); - expect(page.salesTaxDetail.getText()).toEqual('The sales tax is $1.00'); + await page.salesTaxAmountInput.sendKeys('10', protractor.Key.ENTER); + expect(await page.salesTaxDetail.getText()).toEqual('The sales tax is $1.00'); }); } diff --git a/aio/content/examples/attribute-binding/e2e/src/app.e2e-spec.ts b/aio/content/examples/attribute-binding/e2e/src/app.e2e-spec.ts index 5248ab5f5d03f..cf08ae5bbabbe 100644 --- a/aio/content/examples/attribute-binding/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/attribute-binding/e2e/src/app.e2e-spec.ts @@ -2,33 +2,34 @@ import { browser, element, by } from 'protractor'; describe('Attribute binding example', () => { - beforeEach(() => { - browser.get(''); - }); + beforeEach(() => browser.get('')); - it('should display Property Binding with Angular', () => { - expect(element(by.css('h1')).getText()).toEqual('Attribute, class, and style bindings'); + it('should display Property Binding with Angular', async () => { + expect(await element(by.css('h1')).getText()).toEqual('Attribute, class, and style bindings'); }); - it('should display a table', () => { - expect(element.all(by.css('table')).isPresent()).toBe(true); + it('should display a table', async () => { + expect(await element.all(by.css('table')).isPresent()).toBe(true); }); - it('should display an Aria button', () => { - expect(element.all(by.css('button')).get(0).getText()).toBe('Go for it with Aria'); + it('should display an Aria button', async () => { + expect(await element.all(by.css('button')).get(0).getText()).toBe('Go for it with Aria'); }); - it('should display a blue background on div', () => { - expect(element.all(by.css('div')).get(1).getCssValue('background-color')).toEqual('rgba(25, 118, 210, 1)'); + it('should display a blue background on div', async () => { + const div = element.all(by.css('div')).get(1); + expect(await div.getCssValue('background-color')).toEqual('rgba(25, 118, 210, 1)'); }); - it('should display a blue div with a red border', () => { - expect(element.all(by.css('div')).get(1).getCssValue('border')).toEqual('2px solid rgb(212, 30, 46)'); + it('should display a blue div with a red border', async () => { + const div = element.all(by.css('div')).get(1); + expect(await div.getCssValue('border')).toEqual('2px solid rgb(212, 30, 46)'); }); - it('should display a div with many classes', () => { - expect(element.all(by.css('div')).get(1).getAttribute('class')).toContain('special'); - expect(element.all(by.css('div')).get(1).getAttribute('class')).toContain('clearance'); + it('should display a div with many classes', async () => { + const div = element.all(by.css('div')).get(1); + expect(await div.getAttribute('class')).toContain('special'); + expect(await div.getAttribute('class')).toContain('clearance'); }); }); diff --git a/aio/content/examples/attribute-directives/e2e/src/app.e2e-spec.ts b/aio/content/examples/attribute-directives/e2e/src/app.e2e-spec.ts index bb03f8c912021..771543102c929 100644 --- a/aio/content/examples/attribute-directives/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/attribute-directives/e2e/src/app.e2e-spec.ts @@ -4,27 +4,25 @@ describe('Attribute directives', () => { const title = 'My First Attribute Directive'; - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it(`should display correct title: ${title}`, () => { - expect(element(by.css('h1')).getText()).toEqual(title); + it(`should display correct title: ${title}`, async () => { + expect(await element(by.css('h1')).getText()).toEqual(title); }); - it('should be able to select green highlight', () => { + it('should be able to select green highlight', async () => { const highlightedEle = element(by.cssContainingText('p', 'Highlight me!')); const lightGreen = 'rgba(144, 238, 144, 1)'; const getBgColor = () => highlightedEle.getCssValue('background-color'); - expect(highlightedEle.getCssValue('background-color')).not.toEqual(lightGreen); + expect(await highlightedEle.getCssValue('background-color')).not.toEqual(lightGreen); const greenRb = element.all(by.css('input')).get(0); - greenRb.click(); - browser.actions().mouseMove(highlightedEle).perform(); + await greenRb.click(); + await browser.actions().mouseMove(highlightedEle).perform(); // Wait for up to 4s for the background color to be updated, // to account for slow environments (e.g. CI). - browser.wait(() => highlightedEle.getCssValue('background-color').then(c => c === lightGreen), 4000); + await browser.wait(async () => await getBgColor() === lightGreen, 4000); }); }); diff --git a/aio/content/examples/binding-syntax/e2e/src/app.e2e-spec.ts b/aio/content/examples/binding-syntax/e2e/src/app.e2e-spec.ts index 81d4cbf075ae1..ca8c6bc1f58eb 100644 --- a/aio/content/examples/binding-syntax/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/binding-syntax/e2e/src/app.e2e-spec.ts @@ -7,31 +7,31 @@ describe('Binding syntax e2e tests', () => { // helper function used to test what's logged to the console - async function logChecker(button, contents) { + async function logChecker(contents) { const logs = await browser.manage().logs().get(logging.Type.BROWSER); const messages = logs.filter(({ message }) => message.indexOf(contents) !== -1 ? true : false); expect(messages.length).toBeGreaterThan(0); } - it('should display Binding syntax', () => { - expect(element(by.css('h1')).getText()).toEqual('Binding syntax'); + it('should display Binding syntax', async () => { + expect(await element(by.css('h1')).getText()).toEqual('Binding syntax'); }); - it('should display Save button', () => { - expect(element.all(by.css('button')).get(0).getText()).toBe('Save'); + it('should display Save button', async () => { + expect(await element.all(by.css('button')).get(0).getText()).toBe('Save'); }); - it('should display HTML attributes and DOM properties', () => { - expect(element.all(by.css('h2')).get(1).getText()).toBe('HTML attributes and DOM properties'); + it('should display HTML attributes and DOM properties', async () => { + expect(await element.all(by.css('h2')).get(1).getText()).toBe('HTML attributes and DOM properties'); }); - it('should display 1. Use the inspector...', () => { - expect(element.all(by.css('p')).get(0).getText()).toContain('1. Use the inspector'); + it('should display 1. Use the inspector...', async () => { + expect(await element.all(by.css('p')).get(0).getText()).toContain('1. Use the inspector'); }); - it('should display Disabled property vs. attribute', () => { - expect(element.all(by.css('h3')).get(0).getText()).toBe('Disabled property vs. attribute'); + it('should display Disabled property vs. attribute', async () => { + expect(await element.all(by.css('h3')).get(0).getText()).toBe('Disabled property vs. attribute'); }); @@ -39,36 +39,36 @@ describe('Binding syntax e2e tests', () => { const attributeButton = element.all(by.css('button')).get(1); await attributeButton.click(); const contents = 'Sarah'; - logChecker(attributeButton, contents); + await logChecker(contents); }); it('should log a message including Sarah for DOM property', async () => { const DOMPropertyButton = element.all(by.css('button')).get(2); await DOMPropertyButton.click(); const contents = 'Sarah'; - logChecker(DOMPropertyButton, contents); + await logChecker(contents); }); it('should log a message including Sally for DOM property', async () => { const DOMPropertyButton = element.all(by.css('button')).get(2); const input = element(by.css('input')); - input.sendKeys('Sally'); + await input.sendKeys('Sally'); await DOMPropertyButton.click(); const contents = 'Sally'; - logChecker(DOMPropertyButton, contents); + await logChecker(contents); }); it('should log a message that Test Button works', async () => { const testButton = element.all(by.css('button')).get(3); await testButton.click(); const contents = 'Test'; - logChecker(testButton, contents); + await logChecker(contents); }); it('should toggle Test Button disabled', async () => { const toggleButton = element.all(by.css('button')).get(4); await toggleButton.click(); const contents = 'true'; - logChecker(toggleButton, contents); + await logChecker(contents); }); }); diff --git a/aio/content/examples/bootstrapping/e2e/src/app.e2e-spec.ts b/aio/content/examples/bootstrapping/e2e/src/app.e2e-spec.ts index 676d41469ca04..78e8b1ee46b6f 100644 --- a/aio/content/examples/bootstrapping/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/bootstrapping/e2e/src/app.e2e-spec.ts @@ -7,8 +7,8 @@ describe('feature-modules App', () => { page = new AppPage(); }); - it('should display message saying app works', () => { - page.navigateTo(); - expect(page.getTitleText()).toEqual('app works!'); + it('should display message saying app works', async () => { + await page.navigateTo(); + expect(await page.getTitleText()).toEqual('app works!'); }); }); diff --git a/aio/content/examples/built-in-directives/e2e/src/app.e2e-spec.ts b/aio/content/examples/built-in-directives/e2e/src/app.e2e-spec.ts index 92c4640222e89..d25537cfdfe91 100644 --- a/aio/content/examples/built-in-directives/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/built-in-directives/e2e/src/app.e2e-spec.ts @@ -2,75 +2,72 @@ import { browser, element, by } from 'protractor'; describe('Built-in Directives', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('should have title Built-in Directives', () => { + it('should have title Built-in Directives', async () => { const title = element.all(by.css('h1')).get(0); - expect(title.getText()).toEqual('Built-in Directives'); + expect(await title.getText()).toEqual('Built-in Directives'); }); it('should change first Teapot header', async () => { const firstLabel = element.all(by.css('p')).get(0); const firstInput = element.all(by.css('input')).get(0); - expect(firstLabel.getText()).toEqual('Current item name: Teapot'); - firstInput.sendKeys('abc'); - expect(firstLabel.getText()).toEqual('Current item name: Teapotabc'); + expect(await firstLabel.getText()).toEqual('Current item name: Teapot'); + await firstInput.sendKeys('abc'); + expect(await firstLabel.getText()).toEqual('Current item name: Teapotabc'); }); - it('should modify sentence when modified checkbox checked', () => { + it('should modify sentence when modified checkbox checked', async () => { const modifiedChkbxLabel = element.all(by.css('input[type="checkbox"]')).get(1); const modifiedSentence = element.all(by.css('div')).get(1); - modifiedChkbxLabel.click(); - expect(modifiedSentence.getText()).toContain('modified'); + await modifiedChkbxLabel.click(); + expect(await modifiedSentence.getText()).toContain('modified'); }); - it('should modify sentence when normal checkbox checked', () => { + it('should modify sentence when normal checkbox checked', async () => { const normalChkbxLabel = element.all(by.css('input[type="checkbox"]')).get(4); const normalSentence = element.all(by.css('div')).get(7); - normalChkbxLabel.click(); - expect(normalSentence.getText()).toContain('normal weight and, extra large'); + await normalChkbxLabel.click(); + expect(await normalSentence.getText()).toContain('normal weight and, extra large'); }); - it('should toggle app-item-detail', () => { + it('should toggle app-item-detail', async () => { const toggleButton = element.all(by.css('button')).get(3); const toggledDiv = element.all(by.css('app-item-detail')).get(0); - toggleButton.click(); - expect(toggledDiv.isDisplayed()).toBe(true); + await toggleButton.click(); + expect(await toggledDiv.isDisplayed()).toBe(true); }); - it('should hide app-item-detail', () => { + it('should hide app-item-detail', async () => { const hiddenMessage = element.all(by.css('p')).get(11); const hiddenDiv = element.all(by.css('app-item-detail')).get(2); - expect(hiddenMessage.getText()).toContain('in the DOM'); - expect(hiddenDiv.isDisplayed()).toBe(true); + expect(await hiddenMessage.getText()).toContain('in the DOM'); + expect(await hiddenDiv.isDisplayed()).toBe(true); }); - it('should have 10 lists each containing the string Teapot', () => { + it('should have 10 lists each containing the string Teapot', async () => { const listDiv = element.all(by.cssContainingText('.box', 'Teapot')); - expect(listDiv.count()).toBe(10); + expect(await listDiv.count()).toBe(10); }); - it('should switch case', () => { + it('should switch case', async () => { const tvRadioButton = element.all(by.css('input[type="radio"]')).get(3); const tvDiv = element(by.css('app-lost-item')); const fishbowlRadioButton = element.all(by.css('input[type="radio"]')).get(4); const fishbowlDiv = element(by.css('app-unknown-item')); - tvRadioButton.click(); - expect(tvDiv.getText()).toContain('Television'); - fishbowlRadioButton.click(); - expect(fishbowlDiv.getText()).toContain('mysterious'); + await tvRadioButton.click(); + expect(await tvDiv.getText()).toContain('Television'); + await fishbowlRadioButton.click(); + expect(await fishbowlDiv.getText()).toContain('mysterious'); }); - }); diff --git a/aio/content/examples/built-in-template-functions/e2e/src/app.e2e-spec.ts b/aio/content/examples/built-in-template-functions/e2e/src/app.e2e-spec.ts index a8bc7f0adf2aa..03e4a2e5e374a 100644 --- a/aio/content/examples/built-in-template-functions/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/built-in-template-functions/e2e/src/app.e2e-spec.ts @@ -1,18 +1,16 @@ import { browser, element, by } from 'protractor'; describe('Built Template Functions Example', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('should have title Built-in Template Functions', () => { + it('should have title Built-in Template Functions', async () => { const title = element.all(by.css('h1')).get(0); - expect(title.getText()).toEqual('Built-in Template Functions'); + expect(await title.getText()).toEqual('Built-in Template Functions'); }); - it('should display $any( ) in h2', () => { + it('should display $any( ) in h2', async () => { const header = element(by.css('h2')); - expect(header.getText()).toContain('$any( )'); + expect(await header.getText()).toContain('$any( )'); }); }); diff --git a/aio/content/examples/component-interaction/e2e/src/app.e2e-spec.ts b/aio/content/examples/component-interaction/e2e/src/app.e2e-spec.ts index d5727cc70c64a..6f2c27990a995 100644 --- a/aio/content/examples/component-interaction/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/component-interaction/e2e/src/app.e2e-spec.ts @@ -10,13 +10,13 @@ describe('Component Communication Cookbook Tests', () => { const heroNames = ['Dr IQ', 'Magneta', 'Bombasto']; const masterName = 'Master'; - it('should pass properties to children properly', () => { + it('should pass properties to children properly', async () => { const parent = element(by.tagName('app-hero-parent')); const heroes = parent.all(by.tagName('app-hero-child')); for (let i = 0; i < heroNames.length; i++) { - const childTitle = heroes.get(i).element(by.tagName('h3')).getText(); - const childDetail = heroes.get(i).element(by.tagName('p')).getText(); + const childTitle = await heroes.get(i).element(by.tagName('h3')).getText(); + const childDetail = await heroes.get(i).element(by.tagName('p')).getText(); expect(childTitle).toEqual(heroNames[i] + ' says:'); expect(childDetail).toContain(masterName); } @@ -28,23 +28,23 @@ describe('Component Communication Cookbook Tests', () => { describe('Parent-to-child communication with setter', () => { // #docregion parent-to-child-setter // ... - it('should display trimmed, non-empty names', () => { + it('should display trimmed, non-empty names', async () => { const nonEmptyNameIndex = 0; const nonEmptyName = '"Dr IQ"'; const parent = element(by.tagName('app-name-parent')); const hero = parent.all(by.tagName('app-name-child')).get(nonEmptyNameIndex); - const displayName = hero.element(by.tagName('h3')).getText(); + const displayName = await hero.element(by.tagName('h3')).getText(); expect(displayName).toEqual(nonEmptyName); }); - it('should replace empty name with default name', () => { + it('should replace empty name with default name', async () => { const emptyNameIndex = 1; const defaultName = '""'; const parent = element(by.tagName('app-name-parent')); const hero = parent.all(by.tagName('app-name-child')).get(emptyNameIndex); - const displayName = hero.element(by.tagName('h3')).getText(); + const displayName = await hero.element(by.tagName('h3')).getText(); expect(displayName).toEqual(defaultName); }); // ... @@ -55,15 +55,15 @@ describe('Component Communication Cookbook Tests', () => { // #docregion parent-to-child-onchanges // ... // Test must all execute in this exact order - it('should set expected initial values', () => { - const actual = getActual(); + it('should set expected initial values', async () => { + const actual = await getActual(); const initialLabel = 'Version 1.23'; const initialLog = 'Initial value of major set to 1, Initial value of minor set to 23'; expect(actual.label).toBe(initialLabel); expect(actual.count).toBe(1); - expect(actual.logs.get(0).getText()).toBe(initialLog); + expect(await actual.logs.get(0).getText()).toBe(initialLog); }); it('should set expected values after clicking \'Minor\' twice', async () => { @@ -73,14 +73,14 @@ describe('Component Communication Cookbook Tests', () => { await newMinorButton.click(); await newMinorButton.click(); - const actual = getActual(); + const actual = await getActual(); const labelAfter2Minor = 'Version 1.25'; const logAfter2Minor = 'minor changed from 24 to 25'; expect(actual.label).toBe(labelAfter2Minor); expect(actual.count).toBe(3); - expect(actual.logs.get(2).getText()).toBe(logAfter2Minor); + expect(await actual.logs.get(2).getText()).toBe(logAfter2Minor); }); it('should set expected values after clicking \'Major\' once', async () => { @@ -88,26 +88,26 @@ describe('Component Communication Cookbook Tests', () => { const newMajorButton = repoTag.all(by.tagName('button')).get(1); await newMajorButton.click(); - const actual = getActual(); + const actual = await getActual(); const labelAfterMajor = 'Version 2.0'; const logAfterMajor = 'major changed from 1 to 2, minor changed from 23 to 0'; expect(actual.label).toBe(labelAfterMajor); expect(actual.count).toBe(2); - expect(actual.logs.get(1).getText()).toBe(logAfterMajor); + expect(await actual.logs.get(1).getText()).toBe(logAfterMajor); }); - function getActual() { + async function getActual() { const versionTag = element(by.tagName('app-version-child')); - const label = versionTag.element(by.tagName('h3')).getText(); + const label = await versionTag.element(by.tagName('h3')).getText(); const ul = versionTag.element((by.tagName('ul'))); const logs = ul.all(by.tagName('li')); return { label, logs, - count: logs.count() + count: await logs.count(), }; } // ... @@ -117,9 +117,9 @@ describe('Component Communication Cookbook Tests', () => { describe('Child-to-parent communication', () => { // #docregion child-to-parent // ... - it('should not emit the event initially', () => { + it('should not emit the event initially', async () => { const voteLabel = element(by.tagName('app-vote-taker')).element(by.tagName('h3')); - expect(voteLabel.getText()).toBe('Agree: 0, Disagree: 0'); + expect(await voteLabel.getText()).toBe('Agree: 0, Disagree: 0'); }); it('should process Agree vote', async () => { @@ -129,7 +129,7 @@ describe('Component Communication Cookbook Tests', () => { await agreeButton1.click(); - expect(voteLabel.getText()).toBe('Agree: 1, Disagree: 0'); + expect(await voteLabel.getText()).toBe('Agree: 1, Disagree: 0'); }); it('should process Disagree vote', async () => { @@ -139,7 +139,7 @@ describe('Component Communication Cookbook Tests', () => { await agreeButton1.click(); - expect(voteLabel.getText()).toBe('Agree: 0, Disagree: 1'); + expect(await voteLabel.getText()).toBe('Agree: 0, Disagree: 1'); }); // ... // #enddocregion child-to-parent @@ -204,8 +204,8 @@ describe('Component Communication Cookbook Tests', () => { await announceButton.click(); - expect(history.count()).toBe(1); - expect(history.get(0).getText()).toMatch(/Mission.* announced/); + expect(await history.count()).toBe(1); + expect(await history.get(0).getText()).toMatch(/Mission.* announced/); }); it('should confirm the mission by Lovell', async () => { @@ -229,8 +229,8 @@ describe('Component Communication Cookbook Tests', () => { await announceButton.click(); await confirmButton.click(); - expect(history.count()).toBe(2); - expect(history.get(1).getText()).toBe(`${astronaut} confirmed the mission`); + expect(await history.count()).toBe(2); + expect(await history.get(1).getText()).toBe(`${astronaut} confirmed the mission`); } // ... // #enddocregion bidirectional-service diff --git a/aio/content/examples/component-overview/e2e/src/app.e2e-spec.ts b/aio/content/examples/component-overview/e2e/src/app.e2e-spec.ts index c6047b3a6907d..4ddd1bcef1089 100644 --- a/aio/content/examples/component-overview/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/component-overview/e2e/src/app.e2e-spec.ts @@ -2,12 +2,10 @@ import { browser, element, by } from 'protractor'; describe('Component Overview', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('should display component overview works ', () => { - expect(element(by.css('p')).getText()).toEqual('component-overview works!'); + it('should display component overview works ', async () => { + expect(await element(by.css('p')).getText()).toEqual('component-overview works!'); }); }); diff --git a/aio/content/examples/component-styles/e2e/src/app.e2e-spec.ts b/aio/content/examples/component-styles/e2e/src/app.e2e-spec.ts index 2265e95f6e9a9..34f854693c0b3 100644 --- a/aio/content/examples/component-styles/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/component-styles/e2e/src/app.e2e-spec.ts @@ -2,67 +2,65 @@ import { browser, element, by } from 'protractor'; describe('Component Style Tests', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('scopes component styles to component view', () => { + it('scopes component styles to component view', async () => { const componentH1 = element(by.css('app-root > h1')); const externalH1 = element(by.css('body > h1')); // Note: sometimes webdriver returns the fontWeight as "normal", // other times as "400", both of which are equal in CSS terms. - expect(componentH1.getCssValue('fontWeight')).toMatch(/normal|400/); - expect(externalH1.getCssValue('fontWeight')).not.toMatch(/normal|400/); + expect(await componentH1.getCssValue('fontWeight')).toMatch(/normal|400/); + expect(await externalH1.getCssValue('fontWeight')).not.toMatch(/normal|400/); }); - it('allows styling :host element', () => { + it('allows styling :host element', async () => { const host = element(by.css('app-hero-details')); - expect(host.getCssValue('borderWidth')).toEqual('1px'); + expect(await host.getCssValue('borderWidth')).toEqual('1px'); }); - it('supports :host() in function form', () => { + it('supports :host() in function form', async () => { const host = element(by.css('app-hero-details')); - host.element(by.buttonText('Activate')).click(); - expect(host.getCssValue('borderWidth')).toEqual('3px'); + await host.element(by.buttonText('Activate')).click(); + expect(await host.getCssValue('borderWidth')).toEqual('3px'); }); - it('allows conditional :host-context() styling', () => { + it('allows conditional :host-context() styling', async () => { const h2 = element(by.css('app-hero-details h2')); - expect(h2.getCssValue('backgroundColor')).toEqual('rgba(238, 238, 255, 1)'); // #eeeeff + expect(await h2.getCssValue('backgroundColor')).toEqual('rgba(238, 238, 255, 1)'); // #eeeeff }); - it('styles both view and content children with /deep/', () => { + it('styles both view and content children with /deep/', async () => { const viewH3 = element(by.css('app-hero-team h3')); const contentH3 = element(by.css('app-hero-controls h3')); - expect(viewH3.getCssValue('fontStyle')).toEqual('italic'); - expect(contentH3.getCssValue('fontStyle')).toEqual('italic'); + expect(await viewH3.getCssValue('fontStyle')).toEqual('italic'); + expect(await contentH3.getCssValue('fontStyle')).toEqual('italic'); }); - it('includes styles loaded with CSS @import', () => { + it('includes styles loaded with CSS @import', async () => { const host = element(by.css('app-hero-details')); - expect(host.getCssValue('padding')).toEqual('10px'); + expect(await host.getCssValue('padding')).toEqual('10px'); }); - it('processes template inline styles', () => { + it('processes template inline styles', async () => { const button = element(by.css('app-hero-controls button')); const externalButton = element(by.css('body > button')); - expect(button.getCssValue('backgroundColor')).toEqual('rgba(255, 255, 255, 1)'); // #ffffff - expect(externalButton.getCssValue('backgroundColor')).not.toEqual('rgba(255, 255, 255, 1)'); + expect(await button.getCssValue('backgroundColor')).toEqual('rgba(255, 255, 255, 1)'); // #ffffff + expect(await externalButton.getCssValue('backgroundColor')).not.toEqual('rgba(255, 255, 255, 1)'); }); - it('processes template s', () => { + it('processes template s', async () => { const li = element(by.css('app-hero-team li:first-child')); const externalLi = element(by.css('body > ul li')); - expect(li.getCssValue('listStyleType')).toEqual('square'); - expect(externalLi.getCssValue('listStyleType')).not.toEqual('square'); + expect(await li.getCssValue('listStyleType')).toEqual('square'); + expect(await externalLi.getCssValue('listStyleType')).not.toEqual('square'); }); }); diff --git a/aio/content/examples/dependency-injection-in-action/e2e/src/app.e2e-spec.ts b/aio/content/examples/dependency-injection-in-action/e2e/src/app.e2e-spec.ts index 857468f5b6f58..f13d6ad0423ac 100644 --- a/aio/content/examples/dependency-injection-in-action/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/dependency-injection-in-action/e2e/src/app.e2e-spec.ts @@ -2,9 +2,7 @@ import { browser, element, by } from 'protractor'; describe('Dependency Injection Cookbook', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); it('should render Logged in User example', async () => { const loggedInUser = element(by.cssContainingText('h3', 'Logged in user')); @@ -49,27 +47,27 @@ describe('Dependency Injection Cookbook', () => { expect(await magmaPhone.isPresent()).toBe(true); }); - it('should render Hero-of-the-Month runner-ups', () => { - const runnersUp = element(by.id('rups1')).getText(); + it('should render Hero-of-the-Month runner-ups', async () => { + const runnersUp = await element(by.id('rups1')).getText(); expect(runnersUp).toContain('RubberMan, Dr Nice'); }); - it('should render DateLogger log entry in Hero-of-the-Month', () => { - const logs = element.all(by.id('logs')).get(0).getText(); + it('should render DateLogger log entry in Hero-of-the-Month', async () => { + const logs = await element.all(by.id('logs')).get(0).getText(); expect(logs).toContain('INFO: starting up at'); }); - it('should highlight Hero Bios and Contacts container when mouseover', () => { + it('should highlight Hero Bios and Contacts container when mouseover', async () => { const target = element(by.css('div[appHighlight="yellow"]')); const yellow = 'rgba(255, 255, 0, 1)'; - expect(target.getCssValue('background-color')).not.toEqual(yellow); + expect(await target.getCssValue('background-color')).not.toEqual(yellow); - browser.actions().mouseMove(target).perform(); + await browser.actions().mouseMove(target).perform(); // Wait for up to 2s for the background color to be updated, // to account for slow environments (e.g. CI). - browser.wait(() => target.getCssValue('background-color').then(c => c === yellow), 2000); + await browser.wait(async () => await target.getCssValue('background-color') === yellow, 2000); }); describe('in Parent Finder', () => { @@ -78,20 +76,20 @@ describe('Dependency Injection Cookbook', () => { const carol1 = element(by.css('alex carol p')); const carol2 = element(by.css('barry carol p')); - it('"Cathy" should find "Alex" via the component class', () => { - expect(cathy1.getText()).toContain('Found Alex via the component'); + it('"Cathy" should find "Alex" via the component class', async () => { + expect(await cathy1.getText()).toContain('Found Alex via the component'); }); - it('"Craig" should not find "Alex" via the base class', () => { - expect(craig1.getText()).toContain('Did not find Alex via the base'); + it('"Craig" should not find "Alex" via the base class', async () => { + expect(await craig1.getText()).toContain('Did not find Alex via the base'); }); - it('"Carol" within "Alex" should have "Alex" parent', () => { - expect(carol1.getText()).toContain('Alex'); + it('"Carol" within "Alex" should have "Alex" parent', async () => { + expect(await carol1.getText()).toContain('Alex'); }); - it('"Carol" within "Barry" should have "Barry" parent', () => { - expect(carol2.getText()).toContain('Barry'); + it('"Carol" within "Barry" should have "Barry" parent', async () => { + expect(await carol2.getText()).toContain('Barry'); }); }); }); diff --git a/aio/content/examples/dependency-injection/e2e/src/app.e2e-spec.ts b/aio/content/examples/dependency-injection/e2e/src/app.e2e-spec.ts index 81b065f6257fa..622c4d9142ee4 100644 --- a/aio/content/examples/dependency-injection/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/dependency-injection/e2e/src/app.e2e-spec.ts @@ -5,193 +5,185 @@ describe('Dependency Injection Tests', () => { let expectedMsg: string; let expectedMsgRx: RegExp; - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); describe('Cars:', () => { - it('DI car displays as expected', () => { + it('DI car displays as expected', async () => { expectedMsg = 'DI car with 4 cylinders and Flintstone tires.'; - expect(element(by.css('#di')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#di')).getText()).toEqual(expectedMsg); }); - it('No DI car displays as expected', () => { + it('No DI car displays as expected', async () => { expectedMsg = 'No DI car with 4 cylinders and Flintstone tires.'; - expect(element(by.css('#nodi')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#nodi')).getText()).toEqual(expectedMsg); }); - it('Injector car displays as expected', () => { + it('Injector car displays as expected', async () => { expectedMsg = 'Injector car with 4 cylinders and Flintstone tires.'; - expect(element(by.css('#injector')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#injector')).getText()).toEqual(expectedMsg); }); - it('Factory car displays as expected', () => { + it('Factory car displays as expected', async () => { expectedMsg = 'Factory car with 4 cylinders and Flintstone tires.'; - expect(element(by.css('#factory')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#factory')).getText()).toEqual(expectedMsg); }); - it('Simple car displays as expected', () => { + it('Simple car displays as expected', async () => { expectedMsg = 'Simple car with 4 cylinders and Flintstone tires.'; - expect(element(by.css('#simple')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#simple')).getText()).toEqual(expectedMsg); }); - it('Super car displays as expected', () => { + it('Super car displays as expected', async () => { expectedMsg = 'Super car with 12 cylinders and Flintstone tires.'; - expect(element(by.css('#super')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#super')).getText()).toEqual(expectedMsg); }); - it('Test car displays as expected', () => { + it('Test car displays as expected', async () => { expectedMsg = 'Test car with 8 cylinders and YokoGoodStone tires.'; - expect(element(by.css('#test')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#test')).getText()).toEqual(expectedMsg); }); }); describe('Other Injections:', () => { - it('DI car displays as expected', () => { + it('DI car displays as expected', async () => { expectedMsg = 'DI car with 4 cylinders and Flintstone tires.'; - expect(element(by.css('#car')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#car')).getText()).toEqual(expectedMsg); }); - it('Hero displays as expected', () => { + it('Hero displays as expected', async () => { expectedMsg = 'Dr Nice'; - expect(element(by.css('#hero')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#hero')).getText()).toEqual(expectedMsg); }); - it('Optional injection displays as expected', () => { + it('Optional injection displays as expected', async () => { expectedMsg = 'R.O.U.S.\'s? I don\'t think they exist!'; - expect(element(by.css('#rodent')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#rodent')).getText()).toEqual(expectedMsg); }); }); describe('Tests:', () => { - it('Tests display as expected', () => { + it('Tests display as expected', async () => { expectedMsgRx = /Tests passed/; - expect(element(by.css('#tests')).getText()).toMatch(expectedMsgRx); + expect(await element(by.css('#tests')).getText()).toMatch(expectedMsgRx); }); }); describe('Provider variations:', () => { - it('P1 (class) displays as expected', () => { + it('P1 (class) displays as expected', async () => { expectedMsg = 'Hello from logger provided with Logger class'; - expect(element(by.css('#p1')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#p1')).getText()).toEqual(expectedMsg); }); - it('P3 (provide) displays as expected', () => { + it('P3 (provide) displays as expected', async () => { expectedMsg = 'Hello from logger provided with useClass:Logger'; - expect(element(by.css('#p3')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#p3')).getText()).toEqual(expectedMsg); }); - it('P4 (useClass:BetterLogger) displays as expected', () => { + it('P4 (useClass:BetterLogger) displays as expected', async () => { expectedMsg = 'Hello from logger provided with useClass:BetterLogger'; - expect(element(by.css('#p4')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#p4')).getText()).toEqual(expectedMsg); }); - it('P5 (useClass:EvenBetterLogger - dependency) displays as expected', () => { + it('P5 (useClass:EvenBetterLogger - dependency) displays as expected', async () => { expectedMsg = 'Message to Bob: Hello from EvenBetterlogger'; - expect(element(by.css('#p5')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#p5')).getText()).toEqual(expectedMsg); }); - it('P6a (no alias) displays as expected', () => { + it('P6a (no alias) displays as expected', async () => { expectedMsg = 'Hello OldLogger (but we want NewLogger)'; - expect(element(by.css('#p6a')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#p6a')).getText()).toEqual(expectedMsg); }); - it('P6b (alias) displays as expected', () => { + it('P6b (alias) displays as expected', async () => { expectedMsg = 'Hello from NewLogger (via aliased OldLogger)'; - expect(element(by.css('#p6b')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#p6b')).getText()).toEqual(expectedMsg); }); - it('P7 (useValue) displays as expected', () => { + it('P7 (useValue) displays as expected', async () => { expectedMsg = 'Silent logger says "Shhhhh!". Provided via "useValue"'; - expect(element(by.css('#p7')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#p7')).getText()).toEqual(expectedMsg); }); - it('P8 (useFactory) displays as expected', () => { + it('P8 (useFactory) displays as expected', async () => { expectedMsg = 'Hero service injected successfully via heroServiceProvider'; - expect(element(by.css('#p8')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#p8')).getText()).toEqual(expectedMsg); }); - it('P9 (InjectionToken) displays as expected', () => { + it('P9 (InjectionToken) displays as expected', async () => { expectedMsg = 'APP_CONFIG Application title is Dependency Injection'; - expect(element(by.css('#p9')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#p9')).getText()).toEqual(expectedMsg); }); - it('P10 (optional dependency) displays as expected', () => { + it('P10 (optional dependency) displays as expected', async () => { expectedMsg = 'Optional logger was not available'; - expect(element(by.css('#p10')).getText()).toEqual(expectedMsg); + expect(await element(by.css('#p10')).getText()).toEqual(expectedMsg); }); }); describe('User/Heroes:', () => { - it('User is Bob - unauthorized', () => { + it('User is Bob - unauthorized', async () => { expectedMsgRx = /Bob, is not authorized/; - expect(element(by.css('#user')).getText()).toMatch(expectedMsgRx); + expect(await element(by.css('#user')).getText()).toMatch(expectedMsgRx); }); - it('should have button', () => { - expect(element.all(by.cssContainingText('button', 'Next User')) + it('should have button', async () => { + expect(await element.all(by.cssContainingText('button', 'Next User')) .get(0).isDisplayed()).toBe(true, '\'Next User\' button should be displayed'); }); - it('unauthorized user should have multiple unauthorized heroes', () => { + it('unauthorized user should have multiple unauthorized heroes', async () => { const heroes = element.all(by.css('#unauthorized app-hero-list div')); - expect(heroes.count()).toBeGreaterThan(0); + expect(await heroes.count()).toBeGreaterThan(0); }); - it('unauthorized user should have no secret heroes', () => { + it('unauthorized user should have no secret heroes', async () => { const heroes = element.all(by.css('#unauthorized app-hero-list div')); - expect(heroes.count()).toBeGreaterThan(0); - - const filteredHeroes = heroes.filter((elem: ElementFinder, index: number) => { - return elem.getText().then((text: string) => /secret/.test(text)); - }); + expect(await heroes.count()).toBeGreaterThan(0); - expect(filteredHeroes.count()).toEqual(0); + const filteredHeroes = heroes.filter(async elem => /secret/.test(await elem.getText())); + expect(await filteredHeroes.count()).toEqual(0); }); - it('unauthorized user should have no authorized heroes listed', () => { - expect(element.all(by.css('#authorized app-hero-list div')).count()).toEqual(0); + it('unauthorized user should have no authorized heroes listed', async () => { + expect(await element.all(by.css('#authorized app-hero-list div')).count()).toEqual(0); }); describe('after button click', () => { - beforeAll((done: any) => { + beforeAll(async () => { const buttonEle = element.all(by.cssContainingText('button', 'Next User')).get(0); - buttonEle.click().then(done, done); + await buttonEle.click(); }); - it('User is Alice - authorized', () => { + it('User is Alice - authorized', async () => { expectedMsgRx = /Alice, is authorized/; - expect(element(by.css('#user')).getText()).toMatch(expectedMsgRx); + expect(await element(by.css('#user')).getText()).toMatch(expectedMsgRx); }); - it('authorized user should have multiple authorized heroes ', () => { + it('authorized user should have multiple authorized heroes ', async () => { const heroes = element.all(by.css('#authorized app-hero-list div')); - expect(heroes.count()).toBeGreaterThan(0); + expect(await heroes.count()).toBeGreaterThan(0); }); - it('authorized user should have multiple authorized heroes with tree-shakeable HeroesService', () => { + it('authorized user should have multiple authorized heroes with tree-shakeable HeroesService', async () => { const heroes = element.all(by.css('#tspAuthorized app-hero-list div')); - expect(heroes.count()).toBeGreaterThan(0); + expect(await heroes.count()).toBeGreaterThan(0); }); - it('authorized user should have secret heroes', () => { + it('authorized user should have secret heroes', async () => { const heroes = element.all(by.css('#authorized app-hero-list div')); - expect(heroes.count()).toBeGreaterThan(0); - - const filteredHeroes = heroes.filter((elem: ElementFinder, index: number) => { - return elem.getText().then((text: string) => /secret/.test(text)); - }); + expect(await heroes.count()).toBeGreaterThan(0); - expect(filteredHeroes.count()).toBeGreaterThan(0); + const filteredHeroes = heroes.filter(async elem => /secret/.test(await elem.getText())); + expect(await filteredHeroes.count()).toBeGreaterThan(0); }); - it('authorized user should have no unauthorized heroes listed', () => { - expect(element.all(by.css('#unauthorized app-hero-list div')).count()).toEqual(0); + it('authorized user should have no unauthorized heroes listed', async () => { + expect(await element.all(by.css('#unauthorized app-hero-list div')).count()).toEqual(0); }); }); }); diff --git a/aio/content/examples/displaying-data/e2e/src/app.e2e-spec.ts b/aio/content/examples/displaying-data/e2e/src/app.e2e-spec.ts index 001708d383411..6ede202dae8c7 100644 --- a/aio/content/examples/displaying-data/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/displaying-data/e2e/src/app.e2e-spec.ts @@ -4,24 +4,22 @@ describe('Displaying Data Tests', () => { const title = 'Tour of Heroes'; const defaultHero = 'Windstorm'; - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('should display correct title: ' + title, () => { - expect(element(by.css('h1')).getText()).toEqual(title); + it(`should display correct title: ${title}`, async () => { + expect(await element(by.css('h1')).getText()).toEqual(title); }); - it('should have correct default hero: ' + defaultHero, () => { - expect(element(by.css('h2')).getText()).toContain(defaultHero); + it(`should have correct default hero: ${defaultHero}`, async () => { + expect(await element(by.css('h2')).getText()).toContain(defaultHero); }); - it('should have heroes', () => { + it('should have heroes', async () => { const heroEls = element.all(by.css('li')); - expect(heroEls.count()).not.toBe(0, 'should have heroes'); + expect(await heroEls.count()).not.toBe(0, 'should have heroes'); }); - it('should display "there are many heroes!"', () => { - expect(element(by.css('ul ~ p')).getText()).toContain('There are many heroes!'); + it('should display "there are many heroes!"', async () => { + expect(await element(by.css('ul ~ p')).getText()).toContain('There are many heroes!'); }); }); diff --git a/aio/content/examples/docs-style-guide/e2e/src/app.e2e-spec.ts b/aio/content/examples/docs-style-guide/e2e/src/app.e2e-spec.ts index c877f9cce94e4..05f5e145a0935 100644 --- a/aio/content/examples/docs-style-guide/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/docs-style-guide/e2e/src/app.e2e-spec.ts @@ -3,11 +3,9 @@ import { browser, element, by } from 'protractor'; describe('Docs Style Guide', () => { const title = 'Authors Style Guide Sample'; - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('should display correct title: ' + title, () => { - expect(element(by.css('h1')).getText()).toEqual(title); + it(`should display correct title: ${title}`, async () => { + expect(await element(by.css('h1')).getText()).toEqual(title); }); }); diff --git a/aio/content/examples/dynamic-form/e2e/src/app.e2e-spec.ts b/aio/content/examples/dynamic-form/e2e/src/app.e2e-spec.ts index 7f01f3100eb4d..4dc15e1b77bd3 100644 --- a/aio/content/examples/dynamic-form/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/dynamic-form/e2e/src/app.e2e-spec.ts @@ -3,25 +3,20 @@ import { browser, element, by } from 'protractor'; /* tslint:disable:quotemark */ describe('Dynamic Form', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('should submit form', () => { + it('should submit form', async () => { const firstNameElement = element.all(by.css('input[id=firstName]')).get(0); - expect(firstNameElement.getAttribute('value')).toEqual('Bombasto'); + expect(await firstNameElement.getAttribute('value')).toEqual('Bombasto'); const emailElement = element.all(by.css('input[id=emailAddress]')).get(0); const email = 'test@test.com'; - emailElement.sendKeys(email); - expect(emailElement.getAttribute('value')).toEqual(email); + await emailElement.sendKeys(email); + expect(await emailElement.getAttribute('value')).toEqual(email); - element(by.css('select option[value="solid"]')).click(); - - const saveButton = element.all(by.css('button')).get(0); - saveButton.click().then(() => { - expect(element(by.xpath("//strong[contains(text(),'Saved the following values')]")).isPresent()).toBe(true); - }); + await element(by.css('select option[value="solid"]')).click(); + await element.all(by.css('button')).get(0).click(); + expect(await element(by.cssContainingText('strong', 'Saved the following values')).isPresent()).toBe(true); }); }); diff --git a/aio/content/examples/elements/e2e/src/app.e2e-spec.ts b/aio/content/examples/elements/e2e/src/app.e2e-spec.ts index ad5de6efcdadc..99abc4309a125 100644 --- a/aio/content/examples/elements/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/elements/e2e/src/app.e2e-spec.ts @@ -6,14 +6,14 @@ describe('Elements', () => { const popupButtons = element.all(by.css('button')); // Helpers - const click = (elem: ElementFinder) => { + const click = async (elem: ElementFinder) => { // Waiting for the element to be clickable, makes the tests less flaky. - browser.wait(EC.elementToBeClickable(elem), 5000); - elem.click(); + await browser.wait(EC.elementToBeClickable(elem), 5000); + await elem.click(); }; - const waitForText = (elem: ElementFinder) => { + const waitForText = async (elem: ElementFinder) => { // Waiting for the element to have some text, makes the tests less flaky. - browser.wait(async () => /\S/.test(await elem.getText()), 5000); + await browser.wait(async () => /\S/.test(await elem.getText()), 5000); }; beforeEach(() => browser.get('')); @@ -23,29 +23,29 @@ describe('Elements', () => { const popupComponent = element(by.css('popup-component')); const closeButton = popupComponent.element(by.css('button')); - it('should be displayed on button click', () => { - expect(popupComponent.isPresent()).toBe(false); + it('should be displayed on button click', async () => { + expect(await popupComponent.isPresent()).toBe(false); - click(popupComponentButton); - expect(popupComponent.isPresent()).toBe(true); + await click(popupComponentButton); + expect(await popupComponent.isPresent()).toBe(true); }); - it('should display the specified message', () => { - messageInput.clear(); - messageInput.sendKeys('Angular rocks!'); + it('should display the specified message', async () => { + await messageInput.clear(); + await messageInput.sendKeys('Angular rocks!'); - click(popupComponentButton); - waitForText(popupComponent); + await click(popupComponentButton); + await waitForText(popupComponent); - expect(popupComponent.getText()).toContain('Popup: Angular rocks!'); + expect(await popupComponent.getText()).toContain('Popup: Angular rocks!'); }); - it('should be closed on "close" button click', () => { - popupComponentButton.click(); - expect(popupComponent.isPresent()).toBe(true); + it('should be closed on "close" button click', async () => { + await click(popupComponentButton); + expect(await popupComponent.isPresent()).toBe(true); - click(closeButton); - expect(popupComponent.isPresent()).toBe(false); + await click(closeButton); + expect(await popupComponent.isPresent()).toBe(false); }); }); @@ -54,29 +54,29 @@ describe('Elements', () => { const popupElement = element(by.css('popup-element')); const closeButton = popupElement.element(by.css('button')); - it('should be displayed on button click', () => { - expect(popupElement.isPresent()).toBe(false); + it('should be displayed on button click', async () => { + expect(await popupElement.isPresent()).toBe(false); - click(popupElementButton); - expect(popupElement.isPresent()).toBe(true); + await click(popupElementButton); + expect(await popupElement.isPresent()).toBe(true); }); - it('should display the specified message', () => { - messageInput.clear(); - messageInput.sendKeys('Angular rocks!'); + it('should display the specified message', async () => { + await messageInput.clear(); + await messageInput.sendKeys('Angular rocks!'); - click(popupElementButton); - waitForText(popupElement); + await click(popupElementButton); + await waitForText(popupElement); - expect(popupElement.getText()).toContain('Popup: Angular rocks!'); + expect(await popupElement.getText()).toContain('Popup: Angular rocks!'); }); - it('should be closed on "close" button click', () => { - popupElementButton.click(); - expect(popupElement.isPresent()).toBe(true); + it('should be closed on "close" button click', async () => { + await click(popupElementButton); + expect(await popupElement.isPresent()).toBe(true); - click(closeButton); - expect(popupElement.isPresent()).toBe(false); + await click(closeButton); + expect(await popupElement.isPresent()).toBe(false); }); }); }); diff --git a/aio/content/examples/event-binding/e2e/src/app.e2e-spec.ts b/aio/content/examples/event-binding/e2e/src/app.e2e-spec.ts index 67b3792ef638c..a5a1dbf5588a1 100644 --- a/aio/content/examples/event-binding/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/event-binding/e2e/src/app.e2e-spec.ts @@ -2,9 +2,7 @@ import { browser, element, by } from 'protractor'; describe('Event binding example', () => { - beforeEach(() => { - browser.get(''); - }); + beforeEach(() => browser.get('')); const saveButton = element.all(by.css('button')).get(0); const onSaveButton = element.all(by.css('button')).get(1); @@ -14,55 +12,55 @@ describe('Event binding example', () => { const saveProp = element.all(by.css('button')).get(5); - it('should display Event Binding with Angular', () => { - expect(element(by.css('h1')).getText()).toEqual('Event Binding'); + it('should display Event Binding with Angular', async () => { + expect(await element(by.css('h1')).getText()).toEqual('Event Binding'); }); - it('should display 6 buttons', () => { - expect(saveButton.getText()).toBe('Save'); - expect(onSaveButton.getText()).toBe('on-click Save'); - expect(myClick.getText()).toBe('click with myClick'); - expect(deleteButton.getText()).toBe('Delete'); - expect(saveNoProp.getText()).toBe('Save, no propagation'); - expect(saveProp.getText()).toBe('Save with propagation'); + it('should display 6 buttons', async () => { + expect(await saveButton.getText()).toBe('Save'); + expect(await onSaveButton.getText()).toBe('on-click Save'); + expect(await myClick.getText()).toBe('click with myClick'); + expect(await deleteButton.getText()).toBe('Delete'); + expect(await saveNoProp.getText()).toBe('Save, no propagation'); + expect(await saveProp.getText()).toBe('Save with propagation'); }); - it('should support user input', () => { + it('should support user input', async () => { const input = element(by.css('input')); const bindingResult = element.all(by.css('h4')).get(1); - expect(bindingResult.getText()).toEqual('Result: teapot'); - input.sendKeys('abc'); - expect(bindingResult.getText()).toEqual('Result: teapotabc'); + expect(await bindingResult.getText()).toEqual('Result: teapot'); + await input.sendKeys('abc'); + expect(await bindingResult.getText()).toEqual('Result: teapotabc'); }); it('should hide the item img', async () => { await deleteButton.click(); - browser.switchTo().alert().accept(); - expect(element.all(by.css('img')).get(0).getCssValue('display')).toEqual('none'); + await browser.switchTo().alert().accept(); + expect(await element.all(by.css('img')).get(0).getCssValue('display')).toEqual('none'); }); it('should show two alerts', async () => { const parentDiv = element.all(by.css('.parent-div')); const childDiv = element.all(by.css('div > div')).get(1); await parentDiv.click(); - browser.switchTo().alert().accept(); - expect(childDiv.getText()).toEqual('Click me too! (child)'); + await browser.switchTo().alert().accept(); + expect(await childDiv.getText()).toEqual('Click me too! (child)'); await childDiv.click(); - expect(browser.switchTo().alert().getText()).toEqual('Click me. Event target class is child-div'); - browser.switchTo().alert().accept(); + expect(await browser.switchTo().alert().getText()).toEqual('Click me. Event target class is child-div'); + await browser.switchTo().alert().accept(); }); it('should show 1 alert from Save, no prop, button', async () => { await saveNoProp.click(); - expect(browser.switchTo().alert().getText()).toEqual('Saved. Event target is Save, no propagation'); - browser.switchTo().alert().accept(); + expect(await browser.switchTo().alert().getText()).toEqual('Saved. Event target is Save, no propagation'); + await browser.switchTo().alert().accept(); }); it('should show 2 alerts from Save w/prop button', async () => { await saveProp.click(); - expect(browser.switchTo().alert().getText()).toEqual('Saved.'); - browser.switchTo().alert().accept(); - expect(browser.switchTo().alert().getText()).toEqual('Saved.'); - browser.switchTo().alert().accept(); + expect(await browser.switchTo().alert().getText()).toEqual('Saved.'); + await browser.switchTo().alert().accept(); + expect(await browser.switchTo().alert().getText()).toEqual('Saved.'); + await browser.switchTo().alert().accept(); }); }); diff --git a/aio/content/examples/feature-modules/e2e/src/app.e2e-spec.ts b/aio/content/examples/feature-modules/e2e/src/app.e2e-spec.ts index fbc7dc198aed1..78e8b1ee46b6f 100644 --- a/aio/content/examples/feature-modules/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/feature-modules/e2e/src/app.e2e-spec.ts @@ -7,11 +7,8 @@ describe('feature-modules App', () => { page = new AppPage(); }); - it('should display message saying app works', () => { - page.navigateTo(); - expect(page.getTitleText()).toEqual('app works!'); + it('should display message saying app works', async () => { + await page.navigateTo(); + expect(await page.getTitleText()).toEqual('app works!'); }); }); - - - diff --git a/aio/content/examples/form-validation/e2e/src/app.e2e-spec.ts b/aio/content/examples/form-validation/e2e/src/app.e2e-spec.ts index b2590fcfd2e75..f81c63b253c5a 100644 --- a/aio/content/examples/form-validation/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/form-validation/e2e/src/app.e2e-spec.ts @@ -3,9 +3,7 @@ import { browser, element, by, protractor, ElementFinder, ElementArrayFinder } f // THESE TESTS ARE INCOMPLETE describe('Form Validation Tests', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); describe('Template-driven form', () => { beforeAll(() => { @@ -71,178 +69,178 @@ function getPage(sectionTag: string) { function tests(title: string) { - it('should display correct title', () => { - expect(page.title.getText()).toContain(title); + it('should display correct title', async () => { + expect(await page.title.getText()).toContain(title); }); - it('should not display submitted message before submit', () => { - expect(page.heroSubmitted.isElementPresent(by.css('p'))).toBe(false); + it('should not display submitted message before submit', async () => { + expect(await page.heroSubmitted.isElementPresent(by.css('p'))).toBe(false); }); - it('should have form buttons', () => { - expect(page.heroFormButtons.count()).toEqual(2); + it('should have form buttons', async () => { + expect(await page.heroFormButtons.count()).toEqual(2); }); - it('should have error at start', () => { - expectFormIsInvalid(); + it('should have error at start', async () => { + await expectFormIsInvalid(); }); // it('showForm', () => { // page.form.getInnerHtml().then(html => console.log(html)); // }); - it('should have disabled submit button', () => { - expect(page.heroFormButtons.get(0).isEnabled()).toBe(false); + it('should have disabled submit button', async () => { + expect(await page.heroFormButtons.get(0).isEnabled()).toBe(false); }); - it('resetting name to valid name should clear errors', () => { + it('resetting name to valid name should clear errors', async () => { const ele = page.nameInput; - expect(ele.isPresent()).toBe(true, 'nameInput should exist'); - ele.clear(); - ele.sendKeys(testName); - expectFormIsValid(); + expect(await ele.isPresent()).toBe(true, 'nameInput should exist'); + await ele.clear(); + await ele.sendKeys(testName); + await expectFormIsValid(); }); - it('should produce "required" error after clearing name', () => { - page.nameInput.clear(); - // page.alterEgoInput.click(); // to blur ... didn't work - page.nameInput.sendKeys('x', protractor.Key.BACK_SPACE); // ugh! - expect(page.form.getAttribute('class')).toMatch('ng-invalid'); - expect(page.errorMessages.get(0).getText()).toContain('required'); + it('should produce "required" error after clearing name', async () => { + await page.nameInput.clear(); + // await page.alterEgoInput.click(); // to blur ... didn't work + await page.nameInput.sendKeys('x', protractor.Key.BACK_SPACE); // ugh! + expect(await page.form.getAttribute('class')).toMatch('ng-invalid'); + expect(await page.errorMessages.get(0).getText()).toContain('required'); }); - it('should produce "at least 4 characters" error when name="x"', () => { - page.nameInput.clear(); - page.nameInput.sendKeys('x'); // too short - expectFormIsInvalid(); - expect(page.errorMessages.get(0).getText()).toContain('at least 4 characters'); + it('should produce "at least 4 characters" error when name="x"', async () => { + await page.nameInput.clear(); + await page.nameInput.sendKeys('x'); // too short + await expectFormIsInvalid(); + expect(await page.errorMessages.get(0).getText()).toContain('at least 4 characters'); }); - it('resetting name to valid name again should clear errors', () => { - page.nameInput.sendKeys(testName); - expectFormIsValid(); + it('resetting name to valid name again should clear errors', async () => { + await page.nameInput.sendKeys(testName); + await expectFormIsValid(); }); - it('should have enabled submit button', () => { + it('should have enabled submit button', async () => { const submitBtn = page.heroFormButtons.get(0); - expect(submitBtn.isEnabled()).toBe(true); + expect(await submitBtn.isEnabled()).toBe(true); }); - it('should hide form after submit', () => { - page.heroFormButtons.get(0).click(); - expect(page.heroFormButtons.get(0).isDisplayed()).toBe(false); + it('should hide form after submit', async () => { + await page.heroFormButtons.get(0).click(); + expect(await page.heroFormButtons.get(0).isDisplayed()).toBe(false); }); - it('submitted form should be displayed', () => { - expect(page.heroSubmitted.isElementPresent(by.css('p'))).toBe(true); + it('submitted form should be displayed', async () => { + expect(await page.heroSubmitted.isElementPresent(by.css('p'))).toBe(true); }); - it('submitted form should have new hero name', () => { - expect(page.heroSubmitted.getText()).toContain(testName); + it('submitted form should have new hero name', async () => { + expect(await page.heroSubmitted.getText()).toContain(testName); }); - it('clicking edit button should reveal form again', () => { + it('clicking edit button should reveal form again', async () => { const newFormBtn = page.heroSubmitted.element(by.css('button')); - newFormBtn.click(); - expect(page.heroSubmitted.isElementPresent(by.css('p'))) + await newFormBtn.click(); + expect(await page.heroSubmitted.isElementPresent(by.css('p'))) .toBe(false, 'submitted hidden again'); - expect(page.title.isDisplayed()).toBe(true, 'can see form title'); + expect(await page.title.isDisplayed()).toBe(true, 'can see form title'); }); } -function expectFormIsValid() { - expect(page.form.getAttribute('class')).toMatch('ng-valid'); +async function expectFormIsValid() { + expect(await page.form.getAttribute('class')).toMatch('ng-valid'); } -function expectFormIsInvalid() { - expect(page.form.getAttribute('class')).toMatch('ng-invalid'); +async function expectFormIsInvalid() { + expect(await page.form.getAttribute('class')).toMatch('ng-invalid'); } -function triggerAlterEgoValidation() { +async function triggerAlterEgoValidation() { // alterEgo has updateOn set to 'blur', click outside of the input to trigger the blur event - element(by.css('app-root')).click(); + await element(by.css('app-root')).click(); } -function waitForAlterEgoValidation() { +async function waitForAlterEgoValidation() { // alterEgo async validation will be performed in 400ms - browser.sleep(400); + await browser.sleep(400); } function bobTests() { const emsg = 'Name cannot be Bob.'; - it('should produce "no bob" error after setting name to "Bobby"', () => { + it('should produce "no bob" error after setting name to "Bobby"', async () => { // Re-populate select element - page.powerSelect.click(); - page.powerOption.click(); + await page.powerSelect.click(); + await page.powerOption.click(); - page.nameInput.clear(); - page.nameInput.sendKeys('Bobby'); - expectFormIsInvalid(); - expect(page.errorMessages.get(0).getText()).toBe(emsg); + await page.nameInput.clear(); + await page.nameInput.sendKeys('Bobby'); + await expectFormIsInvalid(); + expect(await page.errorMessages.get(0).getText()).toBe(emsg); }); - it('should be ok again with valid name', () => { - page.nameInput.clear(); - page.nameInput.sendKeys(testName); - expectFormIsValid(); + it('should be ok again with valid name', async () => { + await page.nameInput.clear(); + await page.nameInput.sendKeys(testName); + await expectFormIsValid(); }); } function asyncValidationTests() { const emsg = 'Alter ego is already taken.'; - it(`should produce "${emsg}" error after setting alterEgo to Eric`, () => { - page.alterEgoInput.clear(); - page.alterEgoInput.sendKeys('Eric'); + it(`should produce "${emsg}" error after setting alterEgo to Eric`, async () => { + await page.alterEgoInput.clear(); + await page.alterEgoInput.sendKeys('Eric'); - triggerAlterEgoValidation(); - waitForAlterEgoValidation(); + await triggerAlterEgoValidation(); + await waitForAlterEgoValidation(); - expectFormIsInvalid(); - expect(page.alterEgoErrors.getText()).toBe(emsg); + await expectFormIsInvalid(); + expect(await page.alterEgoErrors.getText()).toBe(emsg); }); - it('should be ok again with different values', () => { - page.alterEgoInput.clear(); - page.alterEgoInput.sendKeys('John'); + it('should be ok again with different values', async () => { + await page.alterEgoInput.clear(); + await page.alterEgoInput.sendKeys('John'); - triggerAlterEgoValidation(); - waitForAlterEgoValidation(); + await triggerAlterEgoValidation(); + await waitForAlterEgoValidation(); - expectFormIsValid(); - expect(page.alterEgoErrors.isPresent()).toBe(false); + await expectFormIsValid(); + expect(await page.alterEgoErrors.isPresent()).toBe(false); }); } function crossValidationTests() { const emsg = 'Name cannot match alter ego.'; - it(`should produce "${emsg}" error after setting name and alter ego to the same value`, () => { - page.nameInput.clear(); - page.nameInput.sendKeys('Batman'); + it(`should produce "${emsg}" error after setting name and alter ego to the same value`, async () => { + await page.nameInput.clear(); + await page.nameInput.sendKeys('Batman'); - page.alterEgoInput.clear(); - page.alterEgoInput.sendKeys('Batman'); + await page.alterEgoInput.clear(); + await page.alterEgoInput.sendKeys('Batman'); - triggerAlterEgoValidation(); - waitForAlterEgoValidation(); + await triggerAlterEgoValidation(); + await waitForAlterEgoValidation(); - expectFormIsInvalid(); - expect(page.crossValidationErrorMessage.getText()).toBe(emsg); + await expectFormIsInvalid(); + expect(await page.crossValidationErrorMessage.getText()).toBe(emsg); }); - it('should be ok again with different values', () => { - page.nameInput.clear(); - page.nameInput.sendKeys('Batman'); + it('should be ok again with different values', async () => { + await page.nameInput.clear(); + await page.nameInput.sendKeys('Batman'); - page.alterEgoInput.clear(); - page.alterEgoInput.sendKeys('Superman'); + await page.alterEgoInput.clear(); + await page.alterEgoInput.sendKeys('Superman'); - triggerAlterEgoValidation(); - waitForAlterEgoValidation(); + await triggerAlterEgoValidation(); + await waitForAlterEgoValidation(); - expectFormIsValid(); - expect(page.crossValidationErrorMessage.isPresent()).toBe(false); + await expectFormIsValid(); + expect(await page.crossValidationErrorMessage.isPresent()).toBe(false); }); } diff --git a/aio/content/examples/forms-overview/e2e/src/app.e2e-spec.ts b/aio/content/examples/forms-overview/e2e/src/app.e2e-spec.ts index 364159569d3a1..bfcfba08461c7 100644 --- a/aio/content/examples/forms-overview/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/forms-overview/e2e/src/app.e2e-spec.ts @@ -1,10 +1,14 @@ -import { browser, element, by } from 'protractor'; +import { AppPage } from './app.po'; -describe('Forms Overview Tests', () => { +describe('forms-overvoew App', () => { + let page: AppPage; beforeEach(() => { - browser.get(''); + page = new AppPage(); }); + it('should display a title', async () => { + await page.navigateTo(); + expect(await page.getTitleText()).toEqual('Forms Overview'); + }); }); - diff --git a/aio/content/examples/forms/e2e/src/app.e2e-spec.ts b/aio/content/examples/forms/e2e/src/app.e2e-spec.ts index 5c208c7e41846..3b43373382a9d 100644 --- a/aio/content/examples/forms/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/forms/e2e/src/app.e2e-spec.ts @@ -2,61 +2,56 @@ import { browser, element, by } from 'protractor'; describe('Forms Tests', () => { - beforeEach(() => { - browser.get(''); - }); + beforeEach(() => browser.get('')); - it('should display correct title', () => { - expect(element.all(by.css('h1')).get(0).getText()).toEqual('Hero Form'); + it('should display correct title', async () => { + expect(await element.all(by.css('h1')).get(0).getText()).toEqual('Hero Form'); }); - - it('should not display message before submit', () => { + it('should not display message before submit', async () => { const ele = element(by.css('h2')); - expect(ele.isDisplayed()).toBe(false); + expect(await ele.isDisplayed()).toBe(false); }); - it('should hide form after submit', () => { + it('should hide form after submit', async () => { const ele = element.all(by.css('h1')).get(0); - expect(ele.isDisplayed()).toBe(true); + expect(await ele.isDisplayed()).toBe(true); + const b = element.all(by.css('button[type=submit]')).get(0); - b.click().then(() => { - expect(ele.isDisplayed()).toBe(false); - }); + await b.click(); + expect(await ele.isDisplayed()).toBe(false); }); - it('should display message after submit', () => { + it('should display message after submit', async () => { const b = element.all(by.css('button[type=submit]')).get(0); - b.click().then(() => { - expect(element(by.css('h2')).getText()).toContain('You submitted the following'); - }); + await b.click(); + expect(await element(by.css('h2')).getText()).toContain('You submitted the following'); }); - it('should hide form after submit', () => { + it('should hide form after submit', async () => { const alterEgoEle = element.all(by.css('input[name=alterEgo]')).get(0); - expect(alterEgoEle.isDisplayed()).toBe(true); + expect(await alterEgoEle.isDisplayed()).toBe(true); + const submitButtonEle = element.all(by.css('button[type=submit]')).get(0); - submitButtonEle.click().then(() => { - expect(alterEgoEle.isDisplayed()).toBe(false); - }); + await submitButtonEle.click(); + expect(await alterEgoEle.isDisplayed()).toBe(false); }); - it('should reflect submitted data after submit', () => { - const test = 'testing 1 2 3'; - let newValue: string; + it('should reflect submitted data after submit', async () => { const alterEgoEle = element.all(by.css('input[name=alterEgo]')).get(0); - alterEgoEle.getAttribute('value').then((value: string) => { - alterEgoEle.sendKeys(test); - newValue = value + test; - expect(alterEgoEle.getAttribute('value')).toEqual(newValue); - const b = element.all(by.css('button[type=submit]')).get(0); - return b.click(); - }).then(() => { - const alterEgoTextEle = element(by.cssContainingText('div', 'Alter Ego')); - expect(alterEgoTextEle.isPresent()).toBe(true, 'cannot locate "Alter Ego" label'); - const divEle = element(by.cssContainingText('div', newValue)); - expect(divEle.isPresent()).toBe(true, 'cannot locate div with this text: ' + newValue); - }); + const value = await alterEgoEle.getAttribute('value'); + const test = 'testing 1 2 3'; + const newValue = value + test; + + await alterEgoEle.sendKeys(test); + expect(await alterEgoEle.getAttribute('value')).toEqual(newValue); + + const b = element.all(by.css('button[type=submit]')).get(0); + await b.click(); + + const alterEgoTextEle = element(by.cssContainingText('div', 'Alter Ego')); + expect(await alterEgoTextEle.isPresent()).toBe(true, 'cannot locate "Alter Ego" label'); + const divEle = element(by.cssContainingText('div', newValue)); + expect(await divEle.isPresent()).toBe(true, `cannot locate div with this text: ${newValue}`); }); }); - diff --git a/aio/content/examples/getting-started/e2e/src/app.e2e-spec.ts b/aio/content/examples/getting-started/e2e/src/app.e2e-spec.ts index d2eb506938adf..0dfcc856c942f 100644 --- a/aio/content/examples/getting-started/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/getting-started/e2e/src/app.e2e-spec.ts @@ -1,4 +1,4 @@ -import { browser, element, by, ExpectedConditions as EC, logging, ElementFinder, ElementArrayFinder } from 'protractor'; +import { browser, element, by, ExpectedConditions as EC, logging } from 'protractor'; describe('Getting Started', () => { const pageElements = { diff --git a/aio/content/examples/hierarchical-dependency-injection/e2e/src/app.e2e-spec.ts b/aio/content/examples/hierarchical-dependency-injection/e2e/src/app.e2e-spec.ts index 277b2cc4140d8..5c418770ea979 100644 --- a/aio/content/examples/hierarchical-dependency-injection/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/hierarchical-dependency-injection/e2e/src/app.e2e-spec.ts @@ -2,9 +2,7 @@ import { browser, by, element } from 'protractor'; describe('Hierarchical dependency injection', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); describe('Heroes Scenario', () => { const page = { @@ -21,81 +19,68 @@ describe('Hierarchical dependency injection', () => { saveButtonEl: element(by.cssContainingText('app-heroes-list app-hero-tax-return button', 'Save')) }; - it('should list multiple heroes', () => { - expect(element.all(by.css('app-heroes-list li')).count()).toBeGreaterThan(1); + it('should list multiple heroes', async () => { + expect(await element.all(by.css('app-heroes-list li')).count()).toBeGreaterThan(1); }); - it('should show no hero tax-returns at the start', () => { - expect(element.all(by.css('app-heroes-list li app-hero-tax-return')).count()).toBe(0); + it('should show no hero tax-returns at the start', async () => { + expect(await element.all(by.css('app-heroes-list li app-hero-tax-return')).count()).toBe(0); }); - it('should open first hero in app-hero-tax-return view after click', () => { - page.heroEl.getText() - .then(val => { - page.heroName = val; - }) - .then(() => page.heroEl.click()) - .then(() => { - expect(page.heroCardEl.isDisplayed()).toBe(true); - }); + it('should open first hero in app-hero-tax-return view after click', async () => { + page.heroName = await page.heroEl.getText(); + await page.heroEl.click(); + expect(await page.heroCardEl.isDisplayed()).toBe(true); }); - it('hero tax-return should have first hero\'s name', () => { + it('hero tax-return should have first hero\'s name', async () => { // Not `page.tax-returnNameInputEl.getAttribute('value')` although later that is essential - expect(page.taxReturnNameEl.getText()).toEqual(page.heroName); + expect(await page.taxReturnNameEl.getText()).toEqual(page.heroName); }); - it('should be able to cancel change', () => { - page.incomeInputEl.clear() - .then(() => page.incomeInputEl.sendKeys('777')) - .then(() => { - expect(page.incomeInputEl.getAttribute('value')).toBe('777', 'income should be 777'); - return page.cancelButtonEl.click(); - }) - .then(() => { - expect(page.incomeInputEl.getAttribute('value')).not.toBe('777', 'income should not be 777'); - }); + it('should be able to cancel change', async () => { + await page.incomeInputEl.clear(); + await page.incomeInputEl.sendKeys('777'); + expect(await page.incomeInputEl.getAttribute('value')).toBe('777', 'income should be 777'); + + await page.cancelButtonEl.click(); + expect(await page.incomeInputEl.getAttribute('value')).not.toBe('777', 'income should not be 777'); }); - it('should be able to save change', () => { - page.incomeInputEl.clear() - .then(() => page.incomeInputEl.sendKeys('999')) - .then(() => { - expect(page.incomeInputEl.getAttribute('value')).toBe('999', 'income should be 999'); - return page.saveButtonEl.click(); - }) - .then(() => { - expect(page.incomeInputEl.getAttribute('value')).toBe('999', 'income should still be 999'); - }); + it('should be able to save change', async () => { + await page.incomeInputEl.clear(); + await page.incomeInputEl.sendKeys('999'); + expect(await page.incomeInputEl.getAttribute('value')).toBe('999', 'income should be 999'); + + await page.saveButtonEl.click(); + expect(await page.incomeInputEl.getAttribute('value')).toBe('999', 'income should still be 999'); }); - it('should be able to close tax-return', () => { - page.saveButtonEl.click() - .then(() => { - expect(element.all(by.css('app-heroes-list li app-hero-tax-return')).count()).toBe(0); - }); + it('should be able to close tax-return', async () => { + await page.saveButtonEl.click(); + expect(await element.all(by.css('app-heroes-list li app-hero-tax-return')).count()).toBe(0); }); }); describe('Villains Scenario', () => { - it('should list multiple villains', () => { - expect(element.all(by.css('app-villains-list li')).count()).toBeGreaterThan(1); + it('should list multiple villains', async () => { + expect(await element.all(by.css('app-villains-list li')).count()).toBeGreaterThan(1); }); }); describe('Cars Scenario', () => { - it('A-component should use expected services', () => { - expect(element(by.css('a-car')).getText()).toContain('C1-E1-T1'); + it('A-component should use expected services', async () => { + expect(await element(by.css('a-car')).getText()).toContain('C1-E1-T1'); }); - it('B-component should use expected services', () => { - expect(element(by.css('b-car')).getText()).toContain('C2-E2-T1'); + it('B-component should use expected services', async () => { + expect(await element(by.css('b-car')).getText()).toContain('C2-E2-T1'); }); - it('C-component should use expected services', () => { - expect(element(by.css('c-car')).getText()).toContain('C3-E2-T1'); + it('C-component should use expected services', async () => { + expect(await element(by.css('c-car')).getText()).toContain('C3-E2-T1'); }); }); }); diff --git a/aio/content/examples/http/e2e/src/app.e2e-spec.ts b/aio/content/examples/http/e2e/src/app.e2e-spec.ts index b74d2ea951dfa..41a4c2e3c7bec 100644 --- a/aio/content/examples/http/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/http/e2e/src/app.e2e-spec.ts @@ -1,4 +1,4 @@ -import { browser, element, by, ElementFinder } from 'protractor'; +import { browser, element, by } from 'protractor'; import { resolve } from 'path'; const page = { @@ -24,115 +24,113 @@ const page = { uploadMessage: element(by.css('app-uploader p')) }; -const checkLogForMessage = (message: string) => { - expect(page.logList.getText()).toContain(message); +const checkLogForMessage = async (message: string) => { + expect(await page.logList.getText()).toContain(message); }; describe('Http Tests', () => { - beforeEach(() => { - browser.get(''); - }); + beforeEach(() => browser.get('')); describe('Heroes', () => { - it('retrieves the list of heroes at startup', () => { - expect(page.heroesListItems.count()).toBe(4); - expect(page.heroesListItems.get(0).getText()).toContain('Dr Nice'); - checkLogForMessage('GET "api/heroes"'); + it('retrieves the list of heroes at startup', async () => { + expect(await page.heroesListItems.count()).toBe(4); + expect(await page.heroesListItems.get(0).getText()).toContain('Dr Nice'); + await checkLogForMessage('GET "api/heroes"'); }); - it('makes a POST to add a new hero', () => { - page.heroesListInput.sendKeys('Magneta'); - page.heroesListAddButton.click(); - expect(page.heroesListItems.count()).toBe(5); - checkLogForMessage('POST "api/heroes"'); + it('makes a POST to add a new hero', async () => { + await page.heroesListInput.sendKeys('Magneta'); + await page.heroesListAddButton.click(); + expect(await page.heroesListItems.count()).toBe(5); + await checkLogForMessage('POST "api/heroes"'); }); - it('makes a GET to search for a hero', () => { - page.heroesListInput.sendKeys('Celeritas'); - page.heroesListSearchButton.click(); - checkLogForMessage('GET "api/heroes?name=Celeritas"'); + it('makes a GET to search for a hero', async () => { + await page.heroesListInput.sendKeys('Celeritas'); + await page.heroesListSearchButton.click(); + await checkLogForMessage('GET "api/heroes?name=Celeritas"'); }); }); describe('Messages', () => { - it('can clear the logs', () => { - expect(page.logListItems.count()).toBe(1); - page.logClearButton.click(); - expect(page.logListItems.count()).toBe(0); + it('can clear the logs', async () => { + expect(await page.logListItems.count()).toBe(1); + await page.logClearButton.click(); + expect(await page.logListItems.count()).toBe(0); }); }); describe('Configuration', () => { - it('can fetch the configuration JSON file', () => { - page.configGetButton.click(); - checkLogForMessage('GET "assets/config.json"'); - expect(page.configSpan.getText()).toContain('Heroes API URL is "api/heroes"'); - expect(page.configSpan.getText()).toContain('Textfile URL is "assets/textfile.txt"'); + it('can fetch the configuration JSON file', async () => { + await page.configGetButton.click(); + await checkLogForMessage('GET "assets/config.json"'); + expect(await page.configSpan.getText()).toContain('Heroes API URL is "api/heroes"'); + expect(await page.configSpan.getText()).toContain('Textfile URL is "assets/textfile.txt"'); }); - it('can fetch the configuration JSON file with headers', () => { - page.configGetResponseButton.click(); - checkLogForMessage('GET "assets/config.json"'); - expect(page.configSpan.getText()).toContain('Response headers:'); - expect(page.configSpan.getText()).toContain('content-type: application/json; charset=UTF-8'); + it('can fetch the configuration JSON file with headers', async () => { + await page.configGetResponseButton.click(); + await checkLogForMessage('GET "assets/config.json"'); + expect(await page.configSpan.getText()).toContain('Response headers:'); + expect(await page.configSpan.getText()).toContain('content-type: application/json; charset=UTF-8'); }); - it('can clear the configuration log', () => { - page.configGetResponseButton.click(); - expect(page.configSpan.getText()).toContain('Response headers:'); - page.configClearButton.click(); - expect(page.configSpan.isPresent()).toBeFalsy(); + it('can clear the configuration log', async () => { + await page.configGetResponseButton.click(); + expect(await page.configSpan.getText()).toContain('Response headers:'); + await page.configClearButton.click(); + expect(await page.configSpan.isPresent()).toBeFalsy(); }); - it('throws an error for a non valid url', () => { - page.configErrorButton.click(); - checkLogForMessage('GET "not/a/real/url"'); - expect(page.configErrorMessage.getText()).toContain('"Something bad happened; please try again later."'); + it('throws an error for a non valid url', async () => { + await page.configErrorButton.click(); + await checkLogForMessage('GET "not/a/real/url"'); + expect(await page.configErrorMessage.getText()).toContain('"Something bad happened; please try again later."'); }); }); describe('Download', () => { - it('can download a txt file and show it', () => { - page.downloadButton.click(); - checkLogForMessage('DownloaderService downloaded "assets/textfile.txt"'); - checkLogForMessage('GET "assets/textfile.txt"'); - expect(page.downloadMessage.getText()).toContain('Contents: "This is the downloaded text file "'); + it('can download a txt file and show it', async () => { + await page.downloadButton.click(); + await checkLogForMessage('DownloaderService downloaded "assets/textfile.txt"'); + await checkLogForMessage('GET "assets/textfile.txt"'); + expect(await page.downloadMessage.getText()).toContain('Contents: "This is the downloaded text file "'); }); - it('can clear the log of the download', () => { - page.downloadButton.click(); - expect(page.downloadMessage.getText()).toContain('Contents: "This is the downloaded text file "'); - page.downloadClearButton.click(); - expect(page.downloadMessage.isPresent()).toBeFalsy(); + it('can clear the log of the download', async () => { + await page.downloadButton.click(); + expect(await page.downloadMessage.getText()).toContain('Contents: "This is the downloaded text file "'); + await page.downloadClearButton.click(); + expect(await page.downloadMessage.isPresent()).toBeFalsy(); }); }); describe('Upload', () => { - it('can upload a file', () => { + it('can upload a file', async () => { const filename = 'app.po.ts'; const url = resolve(__dirname, filename); - page.uploadInput.sendKeys(url); - checkLogForMessage('POST "/upload/file" succeeded in'); - expect(page.uploadMessage.getText()).toContain( + await page.uploadInput.sendKeys(url); + await checkLogForMessage('POST "/upload/file" succeeded in'); + expect(await page.uploadMessage.getText()).toContain( `File "${filename}" was completely uploaded!`); }); }); describe('PackageSearch', () => { - it('can search for npm package and find in cache', () => { + it('can search for npm package and find in cache', async () => { const packageName = 'angular'; - page.searchInput.sendKeys(packageName); - checkLogForMessage( + await page.searchInput.sendKeys(packageName); + await checkLogForMessage( 'Caching response from "https://npmsearch.com/query?q=angular"'); - expect(page.searchListItems.count()).toBeGreaterThan(1, 'angular items'); + expect(await page.searchListItems.count()).toBeGreaterThan(1, 'angular items'); - page.searchInput.clear(); - page.searchInput.sendKeys(' '); - expect(page.searchListItems.count()).toBe(0, 'search empty'); + await page.searchInput.clear(); + await page.searchInput.sendKeys(' '); + expect(await page.searchListItems.count()).toBe(0, 'search empty'); - page.searchInput.clear(); - page.searchInput.sendKeys(packageName); - checkLogForMessage( + await page.searchInput.clear(); + await page.searchInput.sendKeys(packageName); + await checkLogForMessage( 'Found cached response for "https://npmsearch.com/query?q=angular"'); }); }); diff --git a/aio/content/examples/i18n/e2e/src/app.e2e-spec.ts b/aio/content/examples/i18n/e2e/src/app.e2e-spec.ts index 734110a36fb95..42c50f03a7beb 100644 --- a/aio/content/examples/i18n/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/i18n/e2e/src/app.e2e-spec.ts @@ -2,44 +2,42 @@ import { browser, element, by } from 'protractor'; describe('i18n E2E Tests', () => { - beforeEach(() => { - browser.get(''); - }); + beforeEach(() => browser.get('')); - it('should display i18n translated welcome: Bonjour !', () => { - expect(element(by.css('h1')).getText()).toEqual('Bonjour i18n !'); + it('should display i18n translated welcome: Bonjour !', async () => { + expect(await element(by.css('h1')).getText()).toEqual('Bonjour i18n !'); }); - it('should display the node texts without elements', () => { - expect(element(by.css('app-root')).getText()).toContain(`Je n'affiche aucun élément`); + it('should display the node texts without elements', async () => { + expect(await element(by.css('app-root')).getText()).toContain(`Je n'affiche aucun élément`); }); - it('should display the translated title attribute', () => { - const title = element(by.css('img')).getAttribute('title'); + it('should display the translated title attribute', async () => { + const title = await element(by.css('img')).getAttribute('title'); expect(title).toBe(`Logo d'Angular`); }); - it('should display the ICU plural expression', () => { - expect(element.all(by.css('span')).get(0).getText()).toBe(`Mis à jour à l'instant`); + it('should display the ICU plural expression', async () => { + expect(await element.all(by.css('span')).get(0).getText()).toBe(`Mis à jour à l'instant`); }); - it('should display the ICU select expression', () => { + it('should display the ICU select expression', async () => { const selectIcuExp = element.all(by.css('span')).get(1); - expect(selectIcuExp.getText()).toBe(`L'auteur est une femme`); - element.all(by.css('button')).get(2).click(); - expect(selectIcuExp.getText()).toBe(`L'auteur est un homme`); + expect(await selectIcuExp.getText()).toBe(`L'auteur est une femme`); + await element.all(by.css('button')).get(2).click(); + expect(await selectIcuExp.getText()).toBe(`L'auteur est un homme`); }); - it('should display the nested expression', () => { + it('should display the nested expression', async () => { const nestedExp = element.all(by.css('span')).get(2); const incBtn = element.all(by.css('button')).get(0); - expect(nestedExp.getText()).toBe(`Mis à jour: à l'instant`); - incBtn.click(); - expect(nestedExp.getText()).toBe(`Mis à jour: il y a une minute`); - incBtn.click(); - incBtn.click(); - element.all(by.css('button')).get(4).click(); - expect(nestedExp.getText()).toBe(`Mis à jour: il y a 3 minutes par autre`); + expect(await nestedExp.getText()).toBe(`Mis à jour: à l'instant`); + await incBtn.click(); + expect(await nestedExp.getText()).toBe(`Mis à jour: il y a une minute`); + await incBtn.click(); + await incBtn.click(); + await element.all(by.css('button')).get(4).click(); + expect(await nestedExp.getText()).toBe(`Mis à jour: il y a 3 minutes par autre`); }); }); diff --git a/aio/content/examples/inputs-outputs/e2e/src/app.e2e-spec.ts b/aio/content/examples/inputs-outputs/e2e/src/app.e2e-spec.ts index 9fa48c7eb52c0..50816b32608a5 100644 --- a/aio/content/examples/inputs-outputs/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/inputs-outputs/e2e/src/app.e2e-spec.ts @@ -1,14 +1,11 @@ -import { browser, element, by } from 'protractor'; -import { logging } from 'selenium-webdriver'; +import { browser, element, by, logging } from 'protractor'; describe('Inputs and Outputs', () => { - beforeEach(() => browser.get('')); - // helper function used to test what's logged to the console - async function logChecker(button, contents) { + async function logChecker(contents) { const logs = await browser .manage() .logs() @@ -17,9 +14,9 @@ describe('Inputs and Outputs', () => { expect(messages.length).toBeGreaterThan(0); } - it('should have title Inputs and Outputs', () => { + it('should have title Inputs and Outputs', async () => { const title = element.all(by.css('h1')).get(0); - expect(title.getText()).toEqual('Inputs and Outputs'); + expect(await title.getText()).toEqual('Inputs and Outputs'); }); it('should add 123 to the parent list', async () => { @@ -28,36 +25,35 @@ describe('Inputs and Outputs', () => { const addedItem = element.all(by.css('li')).get(4); await addToListInput.sendKeys('123'); await addToParentButton.click(); - expect(addedItem.getText()).toEqual('123'); + expect(await addedItem.getText()).toEqual('123'); }); it('should delete item', async () => { const deleteButton = element.all(by.css('button')).get(1); const contents = 'Child'; await deleteButton.click(); - await logChecker(deleteButton, contents); + await logChecker(contents); }); it('should log buy the item', async () => { const buyButton = element.all(by.css('button')).get(2); const contents = 'Child'; await buyButton.click(); - await logChecker(buyButton, contents); + await logChecker(contents); }); it('should save item for later', async () => { const saveButton = element.all(by.css('button')).get(3); const contents = 'Child'; await saveButton.click(); - await logChecker(saveButton, contents); + await logChecker(contents); }); it('should add item to wishlist', async () => { const addToParentButton = element.all(by.css('button')).get(4); const addedItem = element.all(by.css('li')).get(6); await addToParentButton.click(); - expect(addedItem.getText()).toEqual('Television'); + expect(await addedItem.getText()).toEqual('Television'); }); }); - diff --git a/aio/content/examples/interpolation/e2e/src/app.e2e-spec.ts b/aio/content/examples/interpolation/e2e/src/app.e2e-spec.ts index 63e713bd981f8..d12b2c47f35b3 100644 --- a/aio/content/examples/interpolation/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/interpolation/e2e/src/app.e2e-spec.ts @@ -2,46 +2,44 @@ import { browser, element, by } from 'protractor'; describe('Interpolation e2e tests', () => { - beforeEach(() => { - browser.get(''); - }); + beforeEach(() => browser.get('')); - it('should display Interpolation and Template Expressions', () => { - expect(element(by.css('h1')).getText()).toEqual('Interpolation and Template Expressions'); + it('should display Interpolation and Template Expressions', async () => { + expect(await element(by.css('h1')).getText()).toEqual('Interpolation and Template Expressions'); }); - it('should display Current customer: Maria', () => { - expect(element.all(by.css('h3')).get(0).getText()).toBe(`Current customer: Maria`); + it('should display Current customer: Maria', async () => { + expect(await element.all(by.css('h3')).get(0).getText()).toBe(`Current customer: Maria`); }); - it('should display The sum of 1 + 1 is not 4.', () => { - expect(element.all(by.css('p:last-child')).get(0).getText()).toBe(`The sum of 1 + 1 is not 4.`); + it('should display The sum of 1 + 1 is not 4.', async () => { + expect(await element.all(by.css('p:last-child')).get(0).getText()).toBe(`The sum of 1 + 1 is not 4.`); }); - it('should display Expression Context', () => { - expect(element.all(by.css('h2')).get(1).getText()).toBe(`Expression Context`); + it('should display Expression Context', async () => { + expect(await element.all(by.css('h2')).get(1).getText()).toBe(`Expression Context`); }); - it('should display a list of customers', () => { - expect(element.all(by.css('li')).get(0).getText()).toBe(`Maria`); + it('should display a list of customers', async () => { + expect(await element.all(by.css('li')).get(0).getText()).toBe(`Maria`); }); - it('should display two pictures', () => { + it('should display two pictures', async () => { const pottedPlant = element.all(by.css('img')).get(0); const lamp = element.all(by.css('img')).get(1); - expect(pottedPlant.getAttribute('src')).toContain('potted-plant'); - expect(pottedPlant.isDisplayed()).toBe(true); + expect(await pottedPlant.getAttribute('src')).toContain('potted-plant'); + expect(await pottedPlant.isDisplayed()).toBe(true); - expect(lamp.getAttribute('src')).toContain('lamp'); - expect(lamp.isDisplayed()).toBe(true); + expect(await lamp.getAttribute('src')).toContain('lamp'); + expect(await lamp.isDisplayed()).toBe(true); }); - it('should support user input', () => { + it('should support user input', async () => { const input = element(by.css('input')); const label = element(by.css('label')); - expect(label.getText()).toEqual('Type something:'); - input.sendKeys('abc'); - expect(label.getText()).toEqual('Type something: abc'); + expect(await label.getText()).toEqual('Type something:'); + await input.sendKeys('abc'); + expect(await label.getText()).toEqual('Type something: abc'); }); }); diff --git a/aio/content/examples/lazy-loading-ngmodules/e2e/src/app.e2e-spec.ts b/aio/content/examples/lazy-loading-ngmodules/e2e/src/app.e2e-spec.ts index 744abfa7efb65..b7c0eef894faa 100644 --- a/aio/content/examples/lazy-loading-ngmodules/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/lazy-loading-ngmodules/e2e/src/app.e2e-spec.ts @@ -1,5 +1,5 @@ +import { element, by } from 'protractor'; import { AppPage } from './app.po'; -import { browser, element, by } from 'protractor'; describe('providers App', () => { @@ -7,41 +7,34 @@ describe('providers App', () => { const buttons = element.all(by.css('button')); const customersButton = buttons.get(0); const ordersButton = buttons.get(1); - const homeButton = buttons.get(2); - beforeEach(() => { + beforeEach(async () => { page = new AppPage(); + await page.navigateTo(); }); - it('should display message saying app works', () => { - page.navigateTo(); - expect(page.getTitleText()).toEqual('Lazy loading feature modules'); + it('should display message saying app works', async () => { + expect(await page.getTitleText()).toEqual('Lazy loading feature modules'); }); describe('Customers', () => { - beforeEach(() => { - customersButton.click(); - }); + beforeEach(() => customersButton.click()); - it('should show customers when the button is clicked', () => { - const customersMessage = element(by.css('app-customers > p')); - expect(customersMessage.getText()).toBe('customers works!'); + it('should show customers when the button is clicked', async () => { + const customersMessage = element(by.css('app-customers > p')); + expect(await customersMessage.getText()).toBe('customers works!'); }); }); describe('Orders', () => { - beforeEach(() => { - ordersButton.click(); - }); + beforeEach(() => ordersButton.click()); - it('should show orders when the button is clicked', () => { - const ordersMessage = element(by.css('app-orders > p')); - expect(ordersMessage.getText()).toBe('orders works!'); + it('should show orders when the button is clicked', async () => { + const ordersMessage = element(by.css('app-orders > p')); + expect(await ordersMessage.getText()).toBe('orders works!'); }); }); }); - - diff --git a/aio/content/examples/lifecycle-hooks/e2e/src/app.e2e-spec.ts b/aio/content/examples/lifecycle-hooks/e2e/src/app.e2e-spec.ts index 6ec9eb2e63d97..45422afe34539 100644 --- a/aio/content/examples/lifecycle-hooks/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/lifecycle-hooks/e2e/src/app.e2e-spec.ts @@ -1,40 +1,41 @@ import { browser, element, ElementFinder, by } from 'protractor'; describe('Lifecycle hooks', () => { - const sendKeys = (el: ElementFinder, input: string) => - input.split('').reduce((prev, c) => prev.then(() => el.sendKeys(c)), Promise.resolve()); + const sendKeys = async (el: ElementFinder, input: string) => { + for (const c of input.split('')) { + await el.sendKeys(c); + } + }; - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('should open correctly', () => { - expect(element.all(by.css('h2')).get(0).getText()).toEqual('Peek-A-Boo'); + it('should open correctly', async () => { + expect(await element.all(by.css('h2')).get(0).getText()).toEqual('Peek-A-Boo'); }); it('should support peek-a-boo', async () => { const pabComp = element(by.css('peek-a-boo-parent peek-a-boo')); - expect(pabComp.isPresent()).toBe(false, 'should not be able to find the "peek-a-boo" component'); + expect(await pabComp.isPresent()).toBe(false, 'should not be able to find the "peek-a-boo" component'); const pabButton = element.all(by.css('peek-a-boo-parent button')).get(0); const updateHeroButton = element.all(by.css('peek-a-boo-parent button')).get(1); - expect(pabButton.getText()).toContain('Create Peek'); + expect(await pabButton.getText()).toContain('Create Peek'); await pabButton.click(); - expect(pabButton.getText()).toContain('Destroy Peek'); - expect(pabComp.isDisplayed()).toBe(true, 'should be able to see the "peek-a-boo" component'); - expect(pabComp.getText()).toContain('Windstorm'); - expect(pabComp.getText()).not.toContain('Windstorm!'); - expect(updateHeroButton.isPresent()).toBe(true, 'should be able to see the update hero button'); + expect(await pabButton.getText()).toContain('Destroy Peek'); + expect(await pabComp.isDisplayed()).toBe(true, 'should be able to see the "peek-a-boo" component'); + expect(await pabComp.getText()).toContain('Windstorm'); + expect(await pabComp.getText()).not.toContain('Windstorm!'); + expect(await updateHeroButton.isPresent()).toBe(true, 'should be able to see the update hero button'); await updateHeroButton.click(); - expect(pabComp.getText()).toContain('Windstorm!'); + expect(await pabComp.getText()).toContain('Windstorm!'); await pabButton.click(); - expect(pabComp.isPresent()).toBe(false, 'should no longer be able to find the "peek-a-boo" component'); + expect(await pabComp.isPresent()).toBe(false, 'should no longer be able to find the "peek-a-boo" component'); }); - it('should support OnChanges hook', () => { + it('should support OnChanges hook', async () => { const onChangesViewEle = element.all(by.css('on-changes div')).get(0); const inputEles = element.all(by.css('on-changes-parent input')); const heroNameInputEle = inputEles.get(1); @@ -42,15 +43,15 @@ describe('Lifecycle hooks', () => { const titleEle = onChangesViewEle.element(by.css('p')); const changeLogEles = onChangesViewEle.all(by.css('div')); - expect(titleEle.getText()).toContain('Windstorm can sing'); - expect(changeLogEles.count()).toEqual(2, 'should start with 2 messages'); - heroNameInputEle.sendKeys('-foo-'); - expect(titleEle.getText()).toContain('Windstorm-foo- can sing'); - expect(changeLogEles.count()).toEqual(2, 'should still have 2 messages'); - powerInputEle.sendKeys('-bar-'); - expect(titleEle.getText()).toContain('Windstorm-foo- can sing-bar-'); + expect(await titleEle.getText()).toContain('Windstorm can sing'); + expect(await changeLogEles.count()).toEqual(2, 'should start with 2 messages'); + await heroNameInputEle.sendKeys('-foo-'); + expect(await titleEle.getText()).toContain('Windstorm-foo- can sing'); + expect(await changeLogEles.count()).toEqual(2, 'should still have 2 messages'); + await powerInputEle.sendKeys('-bar-'); + expect(await titleEle.getText()).toContain('Windstorm-foo- can sing-bar-'); // 7 == 2 previously + length of '-bar-' - expect(changeLogEles.count()).toEqual(7, 'should have 7 messages now'); + expect(await changeLogEles.count()).toEqual(7, 'should have 7 messages now'); }); it('should support DoCheck hook', async () => { @@ -62,7 +63,7 @@ describe('Lifecycle hooks', () => { const changeLogEles = doCheckViewEle.all(by.css('div')); let logCount: number; - expect(titleEle.getText()).toContain('Windstorm can sing'); + expect(await titleEle.getText()).toContain('Windstorm can sing'); let count = await changeLogEles.count(); // 3 messages to start @@ -71,13 +72,13 @@ describe('Lifecycle hooks', () => { logCount = count; await sendKeys(heroNameInputEle, '-foo-'); count = await changeLogEles.count(); - expect(titleEle.getText()).toContain('Windstorm-foo- can sing'); + expect(await titleEle.getText()).toContain('Windstorm-foo- can sing'); expect(count).toBeGreaterThanOrEqual(logCount + 5, 'should add at least one more message for each keystroke'); logCount = count; await sendKeys(powerInputEle, '-bar-'); count = await changeLogEles.count(); - expect(titleEle.getText()).toContain('Windstorm-foo- can sing-bar-'); + expect(await titleEle.getText()).toContain('Windstorm-foo- can sing-bar-'); expect(count).toBeGreaterThanOrEqual(logCount + 5, 'should add at least one more message for each keystroke'); }); @@ -89,15 +90,15 @@ describe('Lifecycle hooks', () => { const childViewInputEle = parentEle.element(by.css('app-child-view input')); let logCount: number; - expect(childViewInputEle.getAttribute('value')).toContain('Magneta'); - expect(commentEle.isPresent()).toBe(false, 'comment should not be in DOM'); + expect(await childViewInputEle.getAttribute('value')).toContain('Magneta'); + expect(await commentEle.isPresent()).toBe(false, 'comment should not be in DOM'); logCount = await logEles.count(); await childViewInputEle.sendKeys('-test-'); - expect(childViewInputEle.getAttribute('value')).toContain('-test-'); - expect(commentEle.isPresent()).toBe(true, 'should have comment because >10 chars'); - expect(commentEle.getText()).toContain('long name'); + expect(await childViewInputEle.getAttribute('value')).toContain('-test-'); + expect(await commentEle.isPresent()).toBe(true, 'should have comment because >10 chars'); + expect(await commentEle.getText()).toContain('long name'); const count = await logEles.count(); expect(logCount + 7).toBeGreaterThan(count - 3, '7 additional log messages should have been added'); @@ -105,7 +106,7 @@ describe('Lifecycle hooks', () => { logCount = count; await buttonEle.click(); - expect(logEles.count()).toBeLessThan(logCount, 'log should shrink after reset'); + expect(await logEles.count()).toBeLessThan(logCount, 'log should shrink after reset'); }); it('should support AfterContent hooks', async () => { @@ -116,19 +117,19 @@ describe('Lifecycle hooks', () => { const childViewInputEle = parentEle.element(by.css('app-child input')); let logCount = await logEles.count(); - expect(childViewInputEle.getAttribute('value')).toContain('Magneta'); - expect(commentEle.isPresent()).toBe(false, 'comment should not be in DOM'); + expect(await childViewInputEle.getAttribute('value')).toContain('Magneta'); + expect(await commentEle.isPresent()).toBe(false, 'comment should not be in DOM'); await sendKeys(childViewInputEle, '-test-'); const count = await logEles.count(); - expect(childViewInputEle.getAttribute('value')).toContain('-test-'); - expect(commentEle.isPresent()).toBe(true, 'should have comment because >10 chars'); - expect(commentEle.getText()).toContain('long name'); + expect(await childViewInputEle.getAttribute('value')).toContain('-test-'); + expect(await commentEle.isPresent()).toBe(true, 'should have comment because >10 chars'); + expect(await commentEle.getText()).toContain('long name'); expect(count).toBeGreaterThanOrEqual(logCount + 5, 'additional log messages should have been added'); logCount = count; await buttonEle.click(); - expect(logEles.count()).toBeLessThan(logCount, 'log should shrink after reset'); + expect(await logEles.count()).toBeLessThan(logCount, 'log should shrink after reset'); }); it('should support spy\'s OnInit & OnDestroy hooks', async () => { @@ -138,18 +139,18 @@ describe('Lifecycle hooks', () => { const heroEles = element.all(by.css('spy-parent div[appSpy')); const logEles = element.all(by.css('spy-parent h4 ~ div')); - expect(heroEles.count()).toBe(2, 'should have two heroes displayed'); - expect(logEles.count()).toBe(2, 'should have two log entries'); + expect(await heroEles.count()).toBe(2, 'should have two heroes displayed'); + expect(await logEles.count()).toBe(2, 'should have two log entries'); await inputEle.sendKeys('-test-'); await addHeroButtonEle.click(); - expect(heroEles.count()).toBe(3, 'should have added one hero'); - expect(heroEles.get(2).getText()).toContain('-test-'); - expect(logEles.count()).toBe(3, 'should now have 3 log entries'); + expect(await heroEles.count()).toBe(3, 'should have added one hero'); + expect(await heroEles.get(2).getText()).toContain('-test-'); + expect(await logEles.count()).toBe(3, 'should now have 3 log entries'); await resetHeroesButtonEle.click(); - expect(heroEles.count()).toBe(0, 'should no longer have any heroes'); - expect(logEles.count()).toBe(7, 'should now have 7 log entries - 3 orig + 1 reset + 3 removeall'); + expect(await heroEles.count()).toBe(0, 'should no longer have any heroes'); + expect(await logEles.count()).toBe(7, 'should now have 7 log entries - 3 orig + 1 reset + 3 removeall'); }); it('should support "spy counter"', async () => { @@ -158,15 +159,15 @@ describe('Lifecycle hooks', () => { const textEle = element(by.css('counter-parent app-counter > div')); const logEles = element.all(by.css('counter-parent h4 ~ div')); - expect(textEle.getText()).toContain('Counter = 0'); - expect(logEles.count()).toBe(2, 'should start with two log entries'); + expect(await textEle.getText()).toContain('Counter = 0'); + expect(await logEles.count()).toBe(2, 'should start with two log entries'); await updateCounterButtonEle.click(); - expect(textEle.getText()).toContain('Counter = 1'); - expect(logEles.count()).toBe(3, 'should now have 3 log entries'); + expect(await textEle.getText()).toContain('Counter = 1'); + expect(await logEles.count()).toBe(3, 'should now have 3 log entries'); await resetCounterButtonEle.click(); - expect(textEle.getText()).toContain('Counter = 0'); - expect(logEles.count()).toBe(7, 'should now have 7 log entries - 3 prev + 1 reset + 2 destroy + 1 init'); + expect(await textEle.getText()).toContain('Counter = 0'); + expect(await logEles.count()).toBe(7, 'should now have 7 log entries - 3 prev + 1 reset + 2 destroy + 1 init'); }); }); diff --git a/aio/content/examples/ngmodules/e2e/src/app.e2e-spec.ts b/aio/content/examples/ngmodules/e2e/src/app.e2e-spec.ts index 4660126083e3b..9e7613caf3a13 100644 --- a/aio/content/examples/ngmodules/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/ngmodules/e2e/src/app.e2e-spec.ts @@ -56,116 +56,109 @@ describe('NgModule-example', () => { // tests function appTitleTests(color: string, name?: string) { return () => { - it('should have a gray header', () => { + it('should have a gray header', async () => { const commons = getCommonsSectionStruct(); - expect(commons.title.getCssValue('backgroundColor')).toBe(color); + expect(await commons.title.getCssValue('backgroundColor')).toBe(color); }); - it('should welcome us', () => { + it('should welcome us', async () => { const commons = getCommonsSectionStruct(); - expect(commons.subtitle.getText()).toBe('Welcome, ' + (name || 'Miss Marple')); + expect(await commons.subtitle.getText()).toBe(`Welcome, ${name || 'Miss Marple'}`); }); }; } function contactTests(color: string, name?: string) { return () => { - it('shows the contact\'s owner', () => { + it('shows the contact\'s owner', async () => { const contacts = getContactSectionStruct(); - expect(contacts.header.getText()).toBe((name || 'Miss Marple') + '\'s Contacts'); + expect(await contacts.header.getText()).toBe(`${name || 'Miss Marple'}'s Contacts`); }); - it('can cycle between contacts', () => { + it('can cycle between contacts', async () => { const contacts = getContactSectionStruct(); const nextButton = contacts.nextContactButton; - expect(contacts.contactNameHeader.getText()).toBe('Awesome Yasha'); - expect(contacts.contactNameHeader.getCssValue('backgroundColor')).toBe(color); - nextButton.click().then(() => { - expect(contacts.contactNameHeader.getText()).toBe('Awesome Iulia'); - return nextButton.click(); - }).then(() => { - expect(contacts.contactNameHeader.getText()).toBe('Awesome Karina'); - }); + expect(await contacts.contactNameHeader.getText()).toBe('Awesome Yasha'); + expect(await contacts.contactNameHeader.getCssValue('backgroundColor')).toBe(color); + + await nextButton.click(); + expect(await contacts.contactNameHeader.getText()).toBe('Awesome Iulia'); + + await nextButton.click(); + expect(await contacts.contactNameHeader.getText()).toBe('Awesome Karina'); }); - it('can create a new contact', () => { + it('can create a new contact', async () => { const contacts = getContactSectionStruct(); const newContactButton = contacts.newContactButton; const nextButton = contacts.nextContactButton; const input = contacts.input; const saveButton = contacts.saveButton; - newContactButton.click().then(() => { - input.click(); - nextButton.click(); - expect(contacts.validationError.getText()).toBe('Name is required.'); - input.click(); - contacts.input.sendKeys('Watson'); - saveButton.click(); - expect(contacts.contactNameHeader.getText()).toBe('Awesome Watson'); + await newContactButton.click(); + await input.click(); + await nextButton.click(); + expect(await contacts.validationError.getText()).toBe('Name is required.'); - }); + await input.click(); + await contacts.input.sendKeys('Watson'); + await saveButton.click(); + expect(await contacts.contactNameHeader.getText()).toBe('Awesome Watson'); }); }; } describe('index.html', () => { - beforeEach(() => { - browser.get(''); - }); + beforeEach(() => browser.get('')); describe('app-title', appTitleTests(white, 'Miss Marple')); describe('contact', contactTests(lightgray, 'Miss Marple')); describe('item center', () => { - beforeEach(() => { - getCommonsSectionStruct().itemButton.click(); - }); + beforeEach(() => getCommonsSectionStruct().itemButton.click()); - it('shows a list of items', () => { + it('shows a list of items', async () => { const item = getItemSectionStruct(); - expect(item.title.getText()).toBe('Items List'); - expect(item.items.count()).toBe(4); - expect(item.items.get(0).getText()).toBe('1 - Sticky notes'); + expect(await item.title.getText()).toBe('Items List'); + expect(await item.items.count()).toBe(4); + expect(await item.items.get(0).getText()).toBe('1 - Sticky notes'); }); - it('can navigate to one item details', () => { + it('can navigate to one item details', async () => { const item = getItemSectionStruct(); - item.items.get(0).click().then(() => { - expect(item.itemId.getText()).toBe('Item id: 1'); - return item.listLink.click(); - }).then(() => { - // We are back to the list - expect(item.items.count()).toBe(4); - }); + + await item.items.get(0).click(); + expect(await item.itemId.getText()).toBe('Item id: 1'); + + await item.listLink.click(); + // We are back to the list + expect(await item.items.count()).toBe(4); }); }); describe('customers', () => { - beforeEach(() => { - getCommonsSectionStruct().customersButton.click(); - }); + beforeEach(() => getCommonsSectionStruct().customersButton.click()); - it('shows a list of customers', () => { + it('shows a list of customers', async () => { const customers = getCustomersSectionStruct(); - expect(customers.header.getText()).toBe('Customers of Miss Marple times 2'); - expect(customers.title.getText()).toBe('Customer List'); - expect(customers.items.count()).toBe(6); - expect(customers.items.get(0).getText()).toBe('11 - Julian'); + expect(await customers.header.getText()).toBe('Customers of Miss Marple times 2'); + expect(await customers.title.getText()).toBe('Customer List'); + expect(await customers.items.count()).toBe(6); + expect(await customers.items.get(0).getText()).toBe('11 - Julian'); }); - it('can navigate and edit one customer details', () => { + it('can navigate and edit one customer details', async () => { const customers = getCustomersSectionStruct(); - customers.items.get(0).click().then(() => { - expect(customers.itemId.getText()).toBe('Id: 11'); - customers.itemInput.sendKeys(' try'); - return customers.listLink.click(); - }).then(() => { - // We are back to the list - expect(customers.items.count()).toBe(6); - expect(customers.items.get(0).getText()).toBe('11 - Julian try'); - }); + + await customers.items.get(0).click(); + expect(await customers.itemId.getText()).toBe('Id: 11'); + + await customers.itemInput.sendKeys(' try'); + await customers.listLink.click(); + // We are back to the list + expect(await customers.items.count()).toBe(6); + expect(await customers.items.get(0).getText()).toBe('11 - Julian try'); }); }); }); diff --git a/aio/content/examples/pipes/e2e/src/app.e2e-spec.ts b/aio/content/examples/pipes/e2e/src/app.e2e-spec.ts index e4ef900a6c24a..cabb8f0baae07 100644 --- a/aio/content/examples/pipes/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/pipes/e2e/src/app.e2e-spec.ts @@ -1,114 +1,108 @@ import { browser, element, by } from 'protractor'; -const { version: angularVersion } = require('@angular/core/package.json'); describe('Pipes', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('should open correctly', () => { - expect(element.all(by.tagName('h1')).get(0).getText()).toEqual('Pipes'); - expect(element(by.css('app-hero-birthday p')).getText()).toEqual(`The hero's birthday is Apr 15, 1988`); + it('should open correctly', async () => { + expect(await element.all(by.tagName('h1')).get(0).getText()).toEqual('Pipes'); + expect(await element(by.css('app-hero-birthday p')).getText()).toEqual(`The hero's birthday is Apr 15, 1988`); }); - it('should show 4 heroes', () => { - expect(element.all(by.css('app-hero-list div')).count()).toEqual(4); + it('should show 4 heroes', async () => { + expect(await element.all(by.css('app-hero-list div')).count()).toEqual(4); }); - it('should show a familiar hero in json', () => { - expect(element(by.cssContainingText('app-hero-list p', 'Heroes as JSON')).getText()).toContain('Bombasto'); + it('should show a familiar hero in json', async () => { + expect(await element(by.cssContainingText('app-hero-list p', 'Heroes as JSON')).getText()).toContain('Bombasto'); }); - it('should show alternate birthday formats', () => { - expect(element(by.cssContainingText('app-root > p', `The hero's birthday is Apr 15, 1988`)).isDisplayed()).toBe(true); - expect(element(by.cssContainingText('app-root > p', `The hero's birthday is 04/15/88`)).isDisplayed()).toBe(true); + it('should show alternate birthday formats', async () => { + expect(await element(by.cssContainingText('app-root > p', `The hero's birthday is Apr 15, 1988`)).isDisplayed()) + .toBe(true); + expect(await element(by.cssContainingText('app-root > p', `The hero's birthday is 04/15/88`)).isDisplayed()) + .toBe(true); }); - it('should be able to toggle birthday formats', () => { + it('should be able to toggle birthday formats', async () => { const birthDayEle = element(by.css('app-hero-birthday2 > p')); - if (angularVersion.indexOf('4.') === 0) { // Breaking change between v4 and v5 (https://github.com/angular/angular/commit/079d884) - expect(birthDayEle.getText()).toEqual(`The hero's birthday is 4/15/1988`); - } else { - expect(birthDayEle.getText()).toEqual(`The hero's birthday is 4/15/88`); - } + expect(await birthDayEle.getText()).toEqual(`The hero's birthday is 4/15/88`); + const buttonEle = element(by.cssContainingText('app-hero-birthday2 > button', 'Toggle Format')); - expect(buttonEle.isDisplayed()).toBe(true); - buttonEle.click().then(() => { - expect(birthDayEle.getText()).toEqual(`The hero's birthday is Friday, April 15, 1988`); - }); + expect(await buttonEle.isDisplayed()).toBe(true); + + await buttonEle.click(); + expect(await birthDayEle.getText()).toEqual(`The hero's birthday is Friday, April 15, 1988`); }); - it('should be able to chain and compose pipes', () => { + it('should be able to chain and compose pipes', async () => { const chainedPipeEles = element.all(by.cssContainingText('app-root p', `The chained hero's`)); - expect(chainedPipeEles.count()).toBe(3, 'should have 3 chained pipe examples'); - expect(chainedPipeEles.get(0).getText()).toContain('APR 15, 1988'); - expect(chainedPipeEles.get(1).getText()).toContain('FRIDAY, APRIL 15, 1988'); - expect(chainedPipeEles.get(2).getText()).toContain('FRIDAY, APRIL 15, 1988'); + expect(await chainedPipeEles.count()).toBe(3, 'should have 3 chained pipe examples'); + expect(await chainedPipeEles.get(0).getText()).toContain('APR 15, 1988'); + expect(await chainedPipeEles.get(1).getText()).toContain('FRIDAY, APRIL 15, 1988'); + expect(await chainedPipeEles.get(2).getText()).toContain('FRIDAY, APRIL 15, 1988'); }); - it('should be able to use ExponentialStrengthPipe pipe', () => { + it('should be able to use ExponentialStrengthPipe pipe', async () => { const ele = element(by.css('app-power-booster p')); - expect(ele.getText()).toContain('Super power boost: 1024'); + expect(await ele.getText()).toContain('Super power boost: 1024'); }); - it('should be able to use the exponential calculator', () => { + it('should be able to use the exponential calculator', async () => { const eles = element.all(by.css('app-power-boost-calculator input')); const baseInputEle = eles.get(0); const factorInputEle = eles.get(1); const outputEle = element(by.css('app-power-boost-calculator p')); - baseInputEle.clear().then(() => { - baseInputEle.sendKeys('7'); - return factorInputEle.clear(); - }).then(() => { - factorInputEle.sendKeys('3'); - expect(outputEle.getText()).toContain('343'); - }); + + await baseInputEle.clear(); + await baseInputEle.sendKeys('7'); + await factorInputEle.clear(); + await factorInputEle.sendKeys('3'); + expect(await outputEle.getText()).toContain('343'); }); - it('should support flying heroes (pure) ', () => { + it('should support flying heroes (pure) ', async () => { const nameEle = element(by.css('app-flying-heroes input[type="text"]')); const canFlyCheckEle = element(by.css('app-flying-heroes #can-fly')); const mutateCheckEle = element(by.css('app-flying-heroes #mutate')); const resetEle = element(by.css('app-flying-heroes button')); const flyingHeroesEle = element.all(by.css('app-flying-heroes #flyers div')); - expect(canFlyCheckEle.getAttribute('checked')).toEqual('true', 'should default to "can fly"'); - expect(mutateCheckEle.getAttribute('checked')).toEqual('true', 'should default to mutating array'); - expect(flyingHeroesEle.count()).toEqual(2, 'only two of the original heroes can fly'); - - nameEle.sendKeys('test1\n'); - expect(flyingHeroesEle.count()).toEqual(2, 'no change while mutating array'); - mutateCheckEle.click().then(() => { - nameEle.sendKeys('test2\n'); - expect(flyingHeroesEle.count()).toEqual(4, 'not mutating; should see both adds'); - expect(flyingHeroesEle.get(2).getText()).toContain('test1'); - expect(flyingHeroesEle.get(3).getText()).toContain('test2'); - return resetEle.click(); - }) - .then(() => { - expect(flyingHeroesEle.count()).toEqual(2, 'reset should restore original flying heroes'); - }); + expect(await canFlyCheckEle.getAttribute('checked')).toEqual('true', 'should default to "can fly"'); + expect(await mutateCheckEle.getAttribute('checked')).toEqual('true', 'should default to mutating array'); + expect(await flyingHeroesEle.count()).toEqual(2, 'only two of the original heroes can fly'); + + await nameEle.sendKeys('test1\n'); + expect(await flyingHeroesEle.count()).toEqual(2, 'no change while mutating array'); + + await mutateCheckEle.click(); + await nameEle.sendKeys('test2\n'); + expect(await flyingHeroesEle.count()).toEqual(4, 'not mutating; should see both adds'); + expect(await flyingHeroesEle.get(2).getText()).toContain('test1'); + expect(await flyingHeroesEle.get(3).getText()).toContain('test2'); + + await resetEle.click(); + expect(await flyingHeroesEle.count()).toEqual(2, 'reset should restore original flying heroes'); }); - it('should support flying heroes (impure) ', () => { + it('should support flying heroes (impure) ', async () => { const nameEle = element(by.css('app-flying-heroes-impure input[type="text"]')); const canFlyCheckEle = element(by.css('app-flying-heroes-impure #can-fly')); const mutateCheckEle = element(by.css('app-flying-heroes-impure #mutate')); const flyingHeroesEle = element.all(by.css('app-flying-heroes-impure #flyers div')); - expect(canFlyCheckEle.getAttribute('checked')).toEqual('true', 'should default to "can fly"'); - expect(mutateCheckEle.getAttribute('checked')).toEqual('true', 'should default to mutating array'); - expect(flyingHeroesEle.count()).toEqual(2, 'only two of the original heroes can fly'); + expect(await canFlyCheckEle.getAttribute('checked')).toEqual('true', 'should default to "can fly"'); + expect(await mutateCheckEle.getAttribute('checked')).toEqual('true', 'should default to mutating array'); + expect(await flyingHeroesEle.count()).toEqual(2, 'only two of the original heroes can fly'); - nameEle.sendKeys('test1\n'); - expect(flyingHeroesEle.count()).toEqual(3, 'new flying hero should show in mutating array'); + await nameEle.sendKeys('test1\n'); + expect(await flyingHeroesEle.count()).toEqual(3, 'new flying hero should show in mutating array'); }); - it('should show an async hero message', () => { - expect(element.all(by.tagName('app-hero-message')).get(0).getText()).toContain('hero'); + it('should show an async hero message', async () => { + expect(await element.all(by.tagName('app-hero-message')).get(0).getText()).toContain('hero'); }); }); diff --git a/aio/content/examples/property-binding/e2e/src/app.e2e-spec.ts b/aio/content/examples/property-binding/e2e/src/app.e2e-spec.ts index 97a9060e96cb3..b134930d07475 100644 --- a/aio/content/examples/property-binding/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/property-binding/e2e/src/app.e2e-spec.ts @@ -3,52 +3,50 @@ import { browser, element, by } from 'protractor'; describe('Property binding e2e tests', () => { - beforeEach(() => { - browser.get(''); - }); + beforeEach(() => browser.get('')); - it('should display Property Binding with Angular', () => { - expect(element(by.css('h1')).getText()).toEqual('Property Binding with Angular'); + it('should display Property Binding with Angular', async () => { + expect(await element(by.css('h1')).getText()).toEqual('Property Binding with Angular'); }); - it('should display four phone pictures', () => { - expect(element.all(by.css('img')).isPresent()).toBe(true); - expect(element.all(by.css('img')).count()).toBe(4); - + it('should display four phone pictures', async () => { + expect(await element.all(by.css('img')).isPresent()).toBe(true); + expect(await element.all(by.css('img')).count()).toBe(4); }); - it('should display Disabled button', () => { - expect(element.all(by.css('button')).get(0).getText()).toBe(`Disabled Button`); + it('should display Disabled button', async () => { + expect(await element.all(by.css('button')).get(0).getText()).toBe(`Disabled Button`); }); - it('should display Binding to a property of a directive', () => { - expect(element.all(by.css('h2')).get(4).getText()).toBe(`Binding to a property of a directive`); + it('should display Binding to a property of a directive', async () => { + expect(await element.all(by.css('h2')).get(4).getText()).toBe(`Binding to a property of a directive`); }); - it('should display Your item is: lamp', () => { - expect(element.all(by.css('p')).get(0).getText()).toContain(`blue`); + it('should display blue', async () => { + expect(await element.all(by.css('p')).get(0).getText()).toContain(`blue`); }); - it('should display Your item is: lamp', () => { - expect(element.all(by.css('p')).get(1).getText()).toContain(`Your item is: lamp`); + + it('should display Your item is: lamp', async () => { + expect(await element.all(by.css('p')).get(1).getText()).toContain(`Your item is: lamp`); }); - it('should display Your item is: parentItem', () => { - expect(element.all(by.css('p')).get(2).getText()).toBe(`Your item is: parentItem`); + it('should display Your item is: parentItem', async () => { + expect(await element.all(by.css('p')).get(2).getText()).toBe(`Your item is: parentItem`); }); - it('should display a ul', () => { - expect(element.all(by.css('ul')).get(0).getText()).toContain(`tv`); + it('should display a ul', async () => { + expect(await element.all(by.css('ul')).get(0).getText()).toContain(`tv`); }); - it('should display a ul containing phone', () => { - expect(element.all(by.css('ul')).get(1).getText()).toBe(`21 phone`); + it('should display a ul containing phone', async () => { + expect(await element.all(by.css('ul')).get(1).getText()).toBe(`21 phone`); }); - it('should display one-time initialized string', () => { - expect(element.all(by.css('p')).get(3).getText()).toContain(`one-time initialized`); + it('should display one-time initialized string', async () => { + expect(await element.all(by.css('p')).get(3).getText()).toContain(`one-time initialized`); }); - it('should display Malicious content', () => { - expect(element.all(by.css('h2')).get(8).getText()).toBe(`Malicious content`); + it('should display Malicious content', async () => { + expect(await element.all(by.css('h2')).get(8).getText()).toBe(`Malicious content`); }); }); diff --git a/aio/content/examples/providers-viewproviders/e2e/src/app.e2e-spec.ts b/aio/content/examples/providers-viewproviders/e2e/src/app.e2e-spec.ts index e9ff9138bbcfc..a351968b704d5 100644 --- a/aio/content/examples/providers-viewproviders/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/providers-viewproviders/e2e/src/app.e2e-spec.ts @@ -1,24 +1,19 @@ import { browser, element, by } from 'protractor'; -import { logging } from 'selenium-webdriver'; describe('Providers and ViewProviders', () => { + beforeEach(() => browser.get('')); - beforeEach(() => { - browser.get(''); + it('shows basic flower emoji', async () => { + expect(await element.all(by.css('p')).get(0).getText()).toContain('🌺'); }); - it('shows basic flower emoji', () => { - expect(element.all(by.css('p')).get(0).getText()).toContain('🌺'); + it('shows whale emoji', async () => { + expect(await element.all(by.css('p')).get(1).getText()).toContain('🐳'); }); - it('shows whale emoji', () => { - expect(element.all(by.css('p')).get(1).getText()).toContain('🐳'); - }); - - it('shows sunflower from FlowerService', () => { - expect(element.all(by.css('p')).get(8).getText()).toContain('🌻'); + it('shows sunflower from FlowerService', async () => { + expect(await element.all(by.css('p')).get(8).getText()).toContain('🌻'); }); }); - diff --git a/aio/content/examples/providers/e2e/src/app.e2e-spec.ts b/aio/content/examples/providers/e2e/src/app.e2e-spec.ts index 76a09e389f2ef..1281bd979593f 100644 --- a/aio/content/examples/providers/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/providers/e2e/src/app.e2e-spec.ts @@ -1,37 +1,23 @@ +import { element, by } from 'protractor'; import { AppPage } from './app.po'; -import { browser, element, by } from 'protractor'; describe('providers App', () => { let page: AppPage; - beforeEach(() => { + beforeEach(async () => { page = new AppPage(); + await page.navigateTo(); }); - function getUsersStruct() { - return { - user: element.all(by.css('ng-component li')).get(0), - userId: element.all(by.css('ng-component span')).get(0) - }; - } - - function getListSectionStruct() { - return { - items: element.all(by.css('app-root li')) - }; - } - - it('should display header that says Users list', () => { - page.navigateTo(); - expect(page.getTitleText()).toEqual('Users list'); + it('should display header that says Users list', async () => { + expect(await page.getTitleText()).toEqual('Users list'); }); - - it('shows a list of customers', () => { - const list = getListSectionStruct(); - expect(list.items.count()).toBe(10); - expect(list.items.get(0).getText()).toBe('1 Maria'); - expect(list.items.get(9).getText()).toBe('10 Seth'); + it('shows a list of customers', async () => { + const items = element.all(by.css('app-root li')); + expect(await items.count()).toBe(10); + expect(await items.get(0).getText()).toBe('1 Maria'); + expect(await items.get(9).getText()).toBe('10 Seth'); }); }); diff --git a/aio/content/examples/reactive-forms/e2e/src/app.e2e-spec.ts b/aio/content/examples/reactive-forms/e2e/src/app.e2e-spec.ts index 8fe627ced7116..53c3d756b7db5 100644 --- a/aio/content/examples/reactive-forms/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/reactive-forms/e2e/src/app.e2e-spec.ts @@ -6,9 +6,7 @@ describe('Reactive forms', () => { const nameEditorLink = element(by.cssContainingText('app-root > nav > a', 'Name Editor')); const profileEditorLink = element(by.cssContainingText('app-root > nav > a', 'Profile Editor')); - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); describe('Name Editor', () => { const nameInput = nameEditor.element(by.css('input')); @@ -55,7 +53,6 @@ describe('Reactive forms', () => { describe('Profile Editor', () => { const firstNameInput = getInput('firstName'); - const lastNameInput = getInput('lastName'); const streetInput = getInput('street'); const addAliasButton = element(by.buttonText('Add Alias')); const updateButton = profileEditor.element(by.buttonText('Update Profile')); @@ -117,7 +114,7 @@ describe('Reactive forms', () => { it('should update the displayed form value when form inputs are updated', async () => { const aliasText = 'Johnny'; - const inputs = await Promise.all( + await Promise.all( Object.keys(profile) .map(key => getInput(key).sendKeys(`${profile[key]}`) diff --git a/aio/content/examples/resolution-modifiers/e2e/src/app.e2e-spec.ts b/aio/content/examples/resolution-modifiers/e2e/src/app.e2e-spec.ts index dc78e01102fa8..1f1b85d289165 100644 --- a/aio/content/examples/resolution-modifiers/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/resolution-modifiers/e2e/src/app.e2e-spec.ts @@ -2,20 +2,18 @@ import { browser, element, by } from 'protractor'; describe('Resolution-modifiers-example', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('shows basic flower emoji', () => { - expect(element.all(by.css('p')).get(0).getText()).toContain('🌸'); + it('shows basic flower emoji', async () => { + expect(await element.all(by.css('p')).get(0).getText()).toContain('🌸'); }); - it('shows basic leaf emoji', () => { - expect(element.all(by.css('p')).get(1).getText()).toContain('🌿'); + it('shows basic leaf emoji', async () => { + expect(await element.all(by.css('p')).get(1).getText()).toContain('🌿'); }); - it('shows yellow flower in host child', () => { - expect(element.all(by.css('p')).get(9).getText()).toContain('🌼'); + it('shows yellow flower in host child', async () => { + expect(await element.all(by.css('p')).get(9).getText()).toContain('🌼'); }); }); diff --git a/aio/content/examples/router-tutorial/e2e/src/app.e2e-spec.ts b/aio/content/examples/router-tutorial/e2e/src/app.e2e-spec.ts index ac01714126ee3..c73d879e8ec6d 100644 --- a/aio/content/examples/router-tutorial/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/router-tutorial/e2e/src/app.e2e-spec.ts @@ -2,41 +2,39 @@ import { browser, element, by } from 'protractor'; describe('Router basic tutorial e2e tests', () => { - beforeEach(() => { - browser.get(''); - }); + beforeEach(() => browser.get('')); - it('should display Angular Router Sample', () => { - expect(element(by.css('h1')).getText()).toBe('Angular Router Sample'); + it('should display Angular Router Sample', async () => { + expect(await element(by.css('h1')).getText()).toBe('Angular Router Sample'); }); - it('should display Crisis Center button', () => { - expect(element.all(by.css('a')).get(0).getText()).toBe('Crisis Center'); + it('should display Crisis Center button', async () => { + expect(await element.all(by.css('a')).get(0).getText()).toBe('Crisis Center'); }); - it('should display Heroes button', () => { - expect(element.all(by.css('a')).get(1).getText()).toBe('Heroes'); + it('should display Heroes button', async () => { + expect(await element.all(by.css('a')).get(1).getText()).toBe('Heroes'); }); - it('should display HEROES', () => { - expect(element(by.css('h3')).getText()).toBe('HEROES'); + it('should display HEROES', async () => { + expect(await element(by.css('h3')).getText()).toBe('HEROES'); }); it('should change to display crisis list component', async () => { const crisisButton = element.all(by.css('a')).get(0); await crisisButton.click(); - expect(element(by.css('h3')).getText()).toBe('CRISIS CENTER'); + expect(await element(by.css('h3')).getText()).toBe('CRISIS CENTER'); }); it('should change to display heroes component', async () => { const heroesButton = element.all(by.css('a')).get(1); await heroesButton.click(); - expect(element(by.css('h3')).getText()).toBe('HEROES'); + expect(await element(by.css('h3')).getText()).toBe('HEROES'); }); it('should use wildcard route', async () => { - browser.get('/fake-page'); - expect(browser.getCurrentUrl()).toContain('fake-page'); - expect(element(by.css('h2')).getText()).toBe('Page Not Found'); + await browser.get('/fake-page'); + expect(await browser.getCurrentUrl()).toContain('fake-page'); + expect(await element(by.css('h2')).getText()).toBe('Page Not Found'); }); }); diff --git a/aio/content/examples/router/e2e/src/app.e2e-spec.ts b/aio/content/examples/router/e2e/src/app.e2e-spec.ts index 00d3bad6dea14..ae174e549eaf0 100644 --- a/aio/content/examples/router/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/router/e2e/src/app.e2e-spec.ts @@ -1,9 +1,8 @@ -import { browser, element, by, ExpectedConditions } from 'protractor'; +import { browser, element, by, ExpectedConditions as EC } from 'protractor'; const numDashboardTabs = 5; const numCrises = 4; const numHeroes = 10; -const EC = ExpectedConditions; describe('Router', () => { @@ -43,43 +42,43 @@ describe('Router', () => { }; } - it('has expected dashboard tabs', () => { + it('has expected dashboard tabs', async () => { const page = getPageStruct(); - expect(page.hrefs.count()).toEqual(numDashboardTabs, 'dashboard tab count'); - expect(page.crisisHref.getText()).toEqual('Crisis Center'); - expect(page.heroesHref.getText()).toEqual('Heroes'); - expect(page.adminHref.getText()).toEqual('Admin'); - expect(page.loginHref.getText()).toEqual('Login'); - expect(page.contactHref.getText()).toEqual('Contact'); + expect(await page.hrefs.count()).toEqual(numDashboardTabs, 'dashboard tab count'); + expect(await page.crisisHref.getText()).toEqual('Crisis Center'); + expect(await page.heroesHref.getText()).toEqual('Heroes'); + expect(await page.adminHref.getText()).toEqual('Admin'); + expect(await page.loginHref.getText()).toEqual('Login'); + expect(await page.contactHref.getText()).toEqual('Contact'); }); - it('has heroes selected as opening tab', () => { + it('has heroes selected as opening tab', async () => { const page = getPageStruct(); - expect(page.activeHref.getText()).toEqual('Heroes'); + expect(await page.activeHref.getText()).toEqual('Heroes'); }); it('has crises center items', async () => { const page = getPageStruct(); await page.crisisHref.click(); - expect(page.activeHref.getText()).toEqual('Crisis Center'); - expect(page.crisisList.count()).toBe(numCrises, 'crisis list count'); + expect(await page.activeHref.getText()).toEqual('Crisis Center'); + expect(await page.crisisList.count()).toBe(numCrises, 'crisis list count'); }); it('has hero items', async () => { const page = getPageStruct(); await page.heroesHref.click(); - expect(page.activeHref.getText()).toEqual('Heroes'); - expect(page.heroesList.count()).toBe(numHeroes, 'hero list count'); + expect(await page.activeHref.getText()).toEqual('Heroes'); + expect(await page.heroesList.count()).toBe(numHeroes, 'hero list count'); }); it('toggles views', async () => { const page = getPageStruct(); await page.crisisHref.click(); - expect(page.activeHref.getText()).toEqual('Crisis Center'); - expect(page.crisisList.count()).toBe(numCrises, 'crisis list count'); + expect(await page.activeHref.getText()).toEqual('Crisis Center'); + expect(await page.crisisList.count()).toBe(numCrises, 'crisis list count'); await page.heroesHref.click(); - expect(page.activeHref.getText()).toEqual('Heroes'); - expect(page.heroesList.count()).toBe(numHeroes, 'hero list count'); + expect(await page.activeHref.getText()).toEqual('Heroes'); + expect(await page.heroesList.count()).toBe(numHeroes, 'hero list count'); }); it('saves changed crisis details', async () => { @@ -107,17 +106,17 @@ describe('Router', () => { await heroEle.click(); await browser.sleep(600); - expect(page.heroesList.count()).toBe(0, 'hero list count'); - expect(page.heroDetail.isPresent()).toBe(true, 'hero detail'); - expect(page.heroDetailTitle.getText()).toContain(heroText); + expect(await page.heroesList.count()).toBe(0, 'hero list count'); + expect(await page.heroDetail.isPresent()).toBe(true, 'hero detail'); + expect(await page.heroDetailTitle.getText()).toContain(heroText); const inputEle = page.heroDetail.element(by.css('input')); await inputEle.sendKeys('-foo'); - expect(page.heroDetailTitle.getText()).toContain(heroText + '-foo'); + expect(await page.heroDetailTitle.getText()).toContain(heroText + '-foo'); const buttonEle = page.heroDetail.element(by.css('button')); await buttonEle.click(); await browser.sleep(600); - expect(heroEle.getText()).toContain(heroText + '-foo'); + expect(await heroEle.getText()).toContain(heroText + '-foo'); }); it('sees preloaded modules', async () => { @@ -125,7 +124,7 @@ describe('Router', () => { await page.loginHref.click(); await page.loginButton.click(); const list = page.adminPreloadList; - expect(list.count()).toBe(1, 'preloaded module'); + expect(await list.count()).toBe(1, 'preloaded module'); expect(await list.first().getText()).toBe('crisis-center', 'first preloaded module'); }); @@ -133,8 +132,8 @@ describe('Router', () => { const page = getPageStruct(); await page.heroesHref.click(); await page.contactHref.click(); - expect(page.primaryOutlet.count()).toBe(1, 'primary outlet'); - expect(page.secondaryOutlet.count()).toBe(1, 'secondary outlet'); + expect(await page.primaryOutlet.count()).toBe(1, 'primary outlet'); + expect(await page.secondaryOutlet.count()).toBe(1, 'secondary outlet'); }); it('should redirect with secondary route', async () => { @@ -159,7 +158,7 @@ describe('Router', () => { await page.loginButton.click(); expect(await page.adminPage.isDisplayed()).toBeTruthy(); - expect(page.secondaryOutlet.count()).toBeTruthy(); + expect(await page.secondaryOutlet.count()).toBeTruthy(); }); async function crisisCenterEdit(index: number, save: boolean) { @@ -172,8 +171,8 @@ describe('Router', () => { const crisisText = text.substr(text.indexOf(' ')).trim(); await crisisEle.click(); - expect(page.crisisDetail.isPresent()).toBe(true, 'crisis detail present'); - expect(page.crisisDetailTitle.getText()).toContain(crisisText); + expect(await page.crisisDetail.isPresent()).toBe(true, 'crisis detail present'); + expect(await page.crisisDetailTitle.getText()).toContain(crisisText); const inputEle = page.crisisDetail.element(by.css('input')); await inputEle.sendKeys('-foo'); @@ -181,11 +180,11 @@ describe('Router', () => { await buttonEle.click(); crisisEle = page.crisisList.get(index); if (save) { - expect(crisisEle.getText()).toContain(crisisText + '-foo'); + expect(await crisisEle.getText()).toContain(crisisText + '-foo'); } else { await browser.wait(EC.alertIsPresent(), 4000); await browser.switchTo().alert().accept(); - expect(crisisEle.getText()).toContain(crisisText); + expect(await crisisEle.getText()).toContain(crisisText); } } diff --git a/aio/content/examples/security/e2e/src/app.e2e-spec.ts b/aio/content/examples/security/e2e/src/app.e2e-spec.ts index 2a071ab074389..fb8c75ae5870e 100644 --- a/aio/content/examples/security/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/security/e2e/src/app.e2e-spec.ts @@ -3,33 +3,33 @@ import { browser, element, By } from 'protractor'; describe('Security E2E Tests', () => { beforeAll(() => browser.get('')); - it('sanitizes innerHTML', () => { + it('sanitizes innerHTML', async () => { const interpolated = element(By.className('e2e-inner-html-interpolated')); - expect(interpolated.getText()) + expect(await interpolated.getText()) .toContain('Template Syntax'); const bound = element(By.className('e2e-inner-html-bound')); - expect(bound.getText()).toContain('Template Syntax'); + expect(await bound.getText()).toContain('Template Syntax'); const bold = element(By.css('.e2e-inner-html-bound b')); - expect(bold.getText()).toContain('Syntax'); + expect(await bold.getText()).toContain('Syntax'); }); - it('escapes untrusted URLs', () => { + it('escapes untrusted URLs', async () => { const untrustedUrl = element(By.className('e2e-dangerous-url')); - expect(untrustedUrl.getAttribute('href')).toMatch(/^unsafe:javascript/); + expect(await untrustedUrl.getAttribute('href')).toMatch(/^unsafe:javascript/); }); - it('binds trusted URLs', () => { + it('binds trusted URLs', async () => { const trustedUrl = element(By.className('e2e-trusted-url')); - expect(trustedUrl.getAttribute('href')).toMatch(/^javascript:alert/); + expect(await trustedUrl.getAttribute('href')).toMatch(/^javascript:alert/); }); - it('escapes untrusted resource URLs', () => { + it('escapes untrusted resource URLs', async () => { const iframe = element(By.className('e2e-iframe-untrusted-src')); - expect(iframe.getAttribute('src')).toBe(''); + expect(await iframe.getAttribute('src')).toBe(''); }); - it('binds trusted resource URLs', () => { + it('binds trusted resource URLs', async () => { const iframe = element(By.className('e2e-iframe-trusted-src')); - expect(iframe.getAttribute('src')).toMatch(/^https:\/\/www.youtube.com\//); + expect(await iframe.getAttribute('src')).toMatch(/^https:\/\/www.youtube.com\//); }); }); diff --git a/aio/content/examples/service-worker-getting-started/e2e/src/app.e2e-spec.ts b/aio/content/examples/service-worker-getting-started/e2e/src/app.e2e-spec.ts index bfb5f1c5bb66c..e0d18fc72cc1d 100755 --- a/aio/content/examples/service-worker-getting-started/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/service-worker-getting-started/e2e/src/app.e2e-spec.ts @@ -1,45 +1,44 @@ import { AppPage } from './app.po'; -import { browser, element, by } from 'protractor'; +import { element, by } from 'protractor'; describe('sw-example App', () => { let page: AppPage; - beforeEach(() => { + beforeEach(async () => { page = new AppPage(); + await page.navigateTo(); }); - it('should display welcome message', () => { - page.navigateTo(); - expect(page.getTitleText()).toEqual('Welcome to Service Workers!'); + it('should display welcome message', async () => { + expect(await page.getTitleText()).toEqual('Welcome to Service Workers!'); }); - it('should display the Angular logo', () => { + it('should display the Angular logo', async () => { const logo = element(by.css('img')); - page.navigateTo(); - expect(logo.isPresent()).toBe(true); + expect(await logo.isPresent()).toBe(true); }); - it('should show a header for the list of links', () => { + it('should show a header for the list of links', async () => { const listHeader = element(by.css('app-root > h2')); - expect(listHeader.getText()).toEqual('Here are some links to help you start:'); + expect(await listHeader.getText()).toEqual('Here are some links to help you start:'); }); - it('should show a list of links', () => { - element.all(by.css('ul > li > h2 > a')).then((items) => { - expect(items.length).toBe(4); - expect(items[0].getText()).toBe('Angular Service Worker Intro'); - expect(items[1].getText()).toBe('Tour of Heroes'); - expect(items[2].getText()).toBe('CLI Documentation'); - expect(items[3].getText()).toBe('Angular blog'); - }); + it('should show a list of links', async () => { + const items = await element.all(by.css('ul > li > h2 > a')); + + expect(items.length).toBe(4); + expect(await items[0].getText()).toBe('Angular Service Worker Intro'); + expect(await items[1].getText()).toBe('Tour of Heroes'); + expect(await items[2].getText()).toBe('CLI Documentation'); + expect(await items[3].getText()).toBe('Angular blog'); }); // Check for a rejected promise as the service worker is not enabled - it('SwUpdate.checkForUpdate() should return a rejected promise', () => { + it('SwUpdate.checkForUpdate() should return a rejected promise', async () => { const button = element(by.css('button')); const rejectMessage = element(by.css('p')); - button.click(); - expect(rejectMessage.getText()).toContain('rejected: '); + await button.click(); + expect(await rejectMessage.getText()).toContain('rejected: '); }); }); diff --git a/aio/content/examples/set-document-title/e2e/src/app.e2e-spec.ts b/aio/content/examples/set-document-title/e2e/src/app.e2e-spec.ts index 86b9bc76ebc44..c94d0dbd2327e 100644 --- a/aio/content/examples/set-document-title/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/set-document-title/e2e/src/app.e2e-spec.ts @@ -1,26 +1,21 @@ -import { browser, element, by, ElementFinder } from 'protractor'; +import { browser, element, by } from 'protractor'; describe('Set Document Title', () => { - beforeAll(() => browser.get('')); - - it('should set the document title', () => { + beforeEach(() => browser.get('')); + it('should set the document title', async () => { + const elems = await element.all(by.css('ul li a')); const titles = [ 'Good morning!', 'Good afternoon!', - 'Good evening!' + 'Good evening!', ]; - element.all( by.css( 'ul li a' ) ).each( - function iterator( elem: ElementFinder, i: number ) { - - elem.click(); - expect( browser.getTitle() ).toEqual( titles[ i ] ); - - } - ); - + for (let i = 0; i < elems.length; i++) { + await elems[i].click(); + expect(await browser.getTitle()).toEqual(titles[i]); + } }); }); diff --git a/aio/content/examples/set-document-title/src/app/app.component.ts b/aio/content/examples/set-document-title/src/app/app.component.ts index adef47a050ea4..e4d6671a47788 100644 --- a/aio/content/examples/set-document-title/src/app/app.component.ts +++ b/aio/content/examples/set-document-title/src/app/app.component.ts @@ -5,25 +5,25 @@ import { Component } from '@angular/core'; import { Title } from '@angular/platform-browser'; @Component({ -selector: 'app-root', -template: - `

- Select a title to set on the current HTML document: -

+ selector: 'app-root', + template: ` +

+ Select a title to set on the current HTML document: +

- - ` + + `, }) // #docregion class export class AppComponent { - public constructor(private titleService: Title ) { } + public constructor(private titleService: Title) { } - public setTitle( newTitle: string) { - this.titleService.setTitle( newTitle ); + public setTitle(newTitle: string) { + this.titleService.setTitle(newTitle); } } // #enddocregion class diff --git a/aio/content/examples/setup/e2e/src/app.e2e-spec.ts b/aio/content/examples/setup/e2e/src/app.e2e-spec.ts index 560d326a55fb7..db185ac5d9125 100644 --- a/aio/content/examples/setup/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/setup/e2e/src/app.e2e-spec.ts @@ -4,12 +4,10 @@ describe('QuickStart E2E Tests', () => { const expectedMsg = 'Hello Angular'; - beforeEach(() => { - browser.get(''); - }); + beforeEach(() => browser.get('')); - it(`should display: ${expectedMsg}`, () => { - expect(element(by.css('h1')).getText()).toEqual(expectedMsg); + it(`should display: ${expectedMsg}`, async () => { + expect(await element(by.css('h1')).getText()).toEqual(expectedMsg); }); }); diff --git a/aio/content/examples/structural-directives/e2e/src/app.e2e-spec.ts b/aio/content/examples/structural-directives/e2e/src/app.e2e-spec.ts index 98cac565dd5c7..12092d401e1bc 100644 --- a/aio/content/examples/structural-directives/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/structural-directives/e2e/src/app.e2e-spec.ts @@ -2,55 +2,52 @@ import { browser, element, by } from 'protractor'; describe('Structural Directives', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('first div should show hero name with *ngIf', () => { + it('first div should show hero name with *ngIf', async () => { const allDivs = element.all(by.tagName('div')); - expect(allDivs.get(0).getText()).toEqual('Dr Nice'); + expect(await allDivs.get(0).getText()).toEqual('Dr Nice'); }); - it('first li should show hero name with *ngFor', () => { + it('first li should show hero name with *ngFor', async () => { const allLis = element.all(by.tagName('li')); - expect(allLis.get(0).getText()).toEqual('Dr Nice'); + expect(await allLis.get(0).getText()).toEqual('Dr Nice'); }); - it('ngSwitch have two instances', () => { + it('ngSwitch have two instances', async () => { const happyHeroEls = element.all(by.tagName('app-happy-hero')); - expect(happyHeroEls.count()).toEqual(2); + expect(await happyHeroEls.count()).toEqual(2); }); - it('should toggle *ngIf="hero" with a button', () => { + it('should toggle *ngIf="hero" with a button', async () => { const toggleHeroButton = element.all(by.cssContainingText('button', 'Toggle hero')).get(0); const paragraph = element.all(by.cssContainingText('p', 'I turned the corner')); - expect(paragraph.get(0).getText()).toContain('I waved'); - toggleHeroButton.click().then(() => { - expect(paragraph.get(0).getText()).not.toContain('I waved'); - }); + expect(await paragraph.get(0).getText()).toContain('I waved'); + await toggleHeroButton.click(); + expect(await paragraph.get(0).getText()).not.toContain('I waved'); }); - it('should have only one "Hip!" (the other is erased)', () => { + it('should have only one "Hip!" (the other is erased)', async () => { const paragraph = element.all(by.cssContainingText('p', 'Hip!')); - expect(paragraph.count()).toEqual(1); + expect(await paragraph.count()).toEqual(1); }); - it('appUnless should show 3 paragraph (A)s and (B)s at the start', () => { + it('appUnless should show 3 paragraph (A)s and (B)s at the start', async () => { const paragraph = element.all(by.css('p.unless')); - expect(paragraph.count()).toEqual(3); + expect(await paragraph.count()).toEqual(3); for (let i = 0; i < 3; i++) { - expect(paragraph.get(i).getText()).toContain('(A)'); + expect(await paragraph.get(i).getText()).toContain('(A)'); } }); - it('appUnless should show 1 paragraph (B) after toggling condition', () => { + it('appUnless should show 1 paragraph (B) after toggling condition', async () => { const toggleConditionButton = element.all(by.cssContainingText('button', 'Toggle condition')).get(0); const paragraph = element.all(by.css('p.unless')); - toggleConditionButton.click().then(() => { - expect(paragraph.count()).toEqual(1); - expect(paragraph.get(0).getText()).toContain('(B)'); - }); + await toggleConditionButton.click(); + + expect(await paragraph.count()).toEqual(1); + expect(await paragraph.get(0).getText()).toContain('(B)'); }); }); diff --git a/aio/content/examples/styleguide/e2e/src/app.e2e-spec.ts b/aio/content/examples/styleguide/e2e/src/app.e2e-spec.ts index fb1f35730df85..e92c52dff57ce 100644 --- a/aio/content/examples/styleguide/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/styleguide/e2e/src/app.e2e-spec.ts @@ -1,147 +1,147 @@ import { browser, element, by } from 'protractor'; describe('Style Guide', () => { - it('01-01', () => { - browser.get('#/01-01'); + it('01-01', async () => { + await browser.get('#/01-01'); const pre = element(by.tagName('toh-heroes > pre')); - expect(pre.getText()).toContain('Bombasto'); - expect(pre.getText()).toContain('Tornado'); - expect(pre.getText()).toContain('Magneta'); + expect(await pre.getText()).toContain('Bombasto'); + expect(await pre.getText()).toContain('Tornado'); + expect(await pre.getText()).toContain('Magneta'); }); - it('02-07', () => { - browser.get('#/02-07'); + it('02-07', async () => { + await browser.get('#/02-07'); const hero = element(by.tagName('toh-hero > div')); const users = element(by.tagName('admin-users > div')); - expect(hero.getText()).toBe('hero component'); - expect(users.getText()).toBe('users component'); + expect(await hero.getText()).toBe('hero component'); + expect(await users.getText()).toBe('users component'); }); - it('02-08', () => { - browser.get('#/02-08'); + it('02-08', async () => { + await browser.get('#/02-08'); const input = element(by.tagName('input[tohvalidate]')); - expect(input.isPresent()).toBe(true); + expect(await input.isPresent()).toBe(true); }); - it('04-10', () => { - browser.get('#/04-10'); + it('04-10', async () => { + await browser.get('#/04-10'); const div = element(by.tagName('sg-app > toh-heroes > div')); - expect(div.getText()).toBe('This is heroes component'); + expect(await div.getText()).toBe('This is heroes component'); }); - it('05-02', () => { - browser.get('#/05-02'); + it('05-02', async () => { + await browser.get('#/05-02'); const button = element(by.tagName('sg-app > toh-hero-button > button')); - expect(button.getText()).toBe('Hero button'); + expect(await button.getText()).toBe('Hero button'); }); - it('05-03', () => { - browser.get('#/05-03'); + it('05-03', async () => { + await browser.get('#/05-03'); const button = element(by.tagName('sg-app > toh-hero-button > button')); - expect(button.getText()).toBe('Hero button'); + expect(await button.getText()).toBe('Hero button'); }); - it('05-04', () => { - browser.get('#/05-04'); + it('05-04', async () => { + await browser.get('#/05-04'); const h2 = element(by.tagName('sg-app > toh-heroes > div > h2')); - expect(h2.getText()).toBe('My Heroes'); + expect(await h2.getText()).toBe('My Heroes'); }); - it('05-12', () => { - browser.get('#/05-12'); + it('05-12', async () => { + await browser.get('#/05-12'); const button = element(by.tagName('sg-app > toh-hero-button > button')); - expect(button.getText()).toBe('OK'); + expect(await button.getText()).toBe('OK'); }); - it('05-13', () => { - browser.get('#/05-13'); + it('05-13', async () => { + await browser.get('#/05-13'); const button = element(by.tagName('sg-app > toh-hero-button > button')); - expect(button.getText()).toBe('OK'); + expect(await button.getText()).toBe('OK'); }); - it('05-14', () => { - browser.get('#/05-14'); + it('05-14', async () => { + await browser.get('#/05-14'); const toast = element(by.tagName('sg-app > toh-toast')); - expect(toast.getText()).toBe('...'); + expect(await toast.getText()).toBe('...'); }); - it('05-15', () => { - browser.get('#/05-15'); + it('05-15', async () => { + await browser.get('#/05-15'); const heroList = element(by.tagName('sg-app > toh-hero-list')); - expect(heroList.getText()).toBe('...'); + expect(await heroList.getText()).toBe('...'); }); - it('05-16', () => { - browser.get('#/05-16'); + it('05-16', async () => { + await browser.get('#/05-16'); const hero = element(by.tagName('sg-app > toh-hero')); - expect(hero.getText()).toBe('...'); + expect(await hero.getText()).toBe('...'); }); - it('05-17', () => { - browser.get('#/05-17'); + it('05-17', async () => { + await browser.get('#/05-17'); const section = element(by.tagName('sg-app > toh-hero-list > section')); - expect(section.getText()).toContain('Our list of heroes'); - expect(section.getText()).toContain('Total powers'); - expect(section.getText()).toContain('Average power'); + expect(await section.getText()).toContain('Our list of heroes'); + expect(await section.getText()).toContain('Total powers'); + expect(await section.getText()).toContain('Average power'); }); - it('06-01', () => { - browser.get('#/06-01'); + it('06-01', async () => { + await browser.get('#/06-01'); const div = element(by.tagName('sg-app > div[tohhighlight]')); - expect(div.getText()).toBe('Bombasta'); + expect(await div.getText()).toBe('Bombasta'); }); - it('06-03', () => { - browser.get('#/06-03'); + it('06-03', async () => { + await browser.get('#/06-03'); const input = element(by.tagName('input[tohvalidator]')); - expect(input.isPresent()).toBe(true); + expect(await input.isPresent()).toBe(true); }); // temporarily disabled because of a weird issue when used with rxjs v6 with rxjs-compat - xit('07-01', () => { - browser.get('#/07-01'); + xit('07-01', async () => { + await browser.get('#/07-01'); const lis = element.all(by.tagName('sg-app > ul > li')); - expect(lis.get(0).getText()).toBe('Windstorm'); - expect(lis.get(1).getText()).toBe('Bombasto'); - expect(lis.get(2).getText()).toBe('Magneta'); - expect(lis.get(3).getText()).toBe('Tornado'); + expect(await lis.get(0).getText()).toBe('Windstorm'); + expect(await lis.get(1).getText()).toBe('Bombasto'); + expect(await lis.get(2).getText()).toBe('Magneta'); + expect(await lis.get(3).getText()).toBe('Tornado'); }); - it('07-03', () => { - browser.get('#/07-03'); + it('07-03', async () => { + await browser.get('#/07-03'); const pre = element(by.tagName('toh-heroes > pre')); - expect(pre.getText()).toContain('[]'); + expect(await pre.getText()).toContain('[]'); }); - it('07-04', () => { - browser.get('#/07-04'); + it('07-04', async () => { + await browser.get('#/07-04'); const pre = element(by.tagName('toh-app > pre')); - expect(pre.getText()).toContain('[]'); + expect(await pre.getText()).toContain('[]'); }); - it('09-01', () => { - browser.get('#/09-01'); + it('09-01', async () => { + await browser.get('#/09-01'); const button = element(by.tagName('sg-app > toh-hero-button > button')); - expect(button.getText()).toBe('OK'); + expect(await button.getText()).toBe('OK'); }); }); diff --git a/aio/content/examples/template-expression-operators/e2e/src/app.e2e-spec.ts b/aio/content/examples/template-expression-operators/e2e/src/app.e2e-spec.ts index 1cc2511ad9e3b..05fcf51d9b577 100644 --- a/aio/content/examples/template-expression-operators/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/template-expression-operators/e2e/src/app.e2e-spec.ts @@ -1,31 +1,27 @@ import { browser, element, by } from 'protractor'; -import { logging } from 'selenium-webdriver'; describe('Template Expression Operators', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('should have title Inputs and Outputs', () => { + it('should have title Inputs and Outputs', async () => { const title = element.all(by.css('h1')).get(0); - expect(title.getText()).toEqual('Template Expression Operators'); + expect(await title.getText()).toEqual('Template Expression Operators'); }); - it('should display json data', () => { + it('should display json data', async () => { const jsonDate = element.all(by.css('p')).get(4); - expect(jsonDate.getText()).toContain('1980'); + expect(await jsonDate.getText()).toContain('1980'); }); - it('should display $98', () => { + it('should display $98', async () => { const jsonDate = element.all(by.css('p')).get(5); - expect(jsonDate.getText()).toContain('$98.00'); + expect(await jsonDate.getText()).toContain('$98.00'); }); - it('should display Telephone', () => { + it('should display Telephone', async () => { const jsonDate = element.all(by.css('p')).get(6); - expect(jsonDate.getText()).toContain('Telephone'); + expect(await jsonDate.getText()).toContain('Telephone'); }); - }); diff --git a/aio/content/examples/template-reference-variables/e2e/src/app.e2e-spec.ts b/aio/content/examples/template-reference-variables/e2e/src/app.e2e-spec.ts index 6b0cb6bd54ffd..9adeed1dae026 100644 --- a/aio/content/examples/template-reference-variables/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/template-reference-variables/e2e/src/app.e2e-spec.ts @@ -1,11 +1,10 @@ -import { browser, element, by } from 'protractor'; -import { logging } from 'selenium-webdriver'; +import { browser, element, by, logging } from 'protractor'; describe('Template-reference-variables-example', () => { beforeEach(() => browser.get('')); // helper function used to test what's logged to the console - async function logChecker(button, contents) { + async function logChecker(contents) { const logs = await browser .manage() .logs() @@ -14,8 +13,8 @@ describe('Template-reference-variables-example', () => { expect(messages.length).toBeGreaterThan(0); } - it('should display Template reference variables', () => { - expect(element(by.css('h1')).getText()).toEqual( + it('should display Template reference variables', async () => { + expect(await element(by.css('h1')).getText()).toEqual( 'Template reference variables' ); }); @@ -26,7 +25,7 @@ describe('Template-reference-variables-example', () => { await phoneInput.sendKeys('123'); await callButton.click(); const contents = 'Calling 123 ...'; - await logChecker(callButton, contents); + await logChecker(contents); }); it('should log a Faxing 123 ... message', async () => { @@ -35,12 +34,12 @@ describe('Template-reference-variables-example', () => { await faxInput.sendKeys('123'); await faxButton.click(); const contents = 'Faxing 123 ...'; - await logChecker(faxButton, contents); + await logChecker(contents); }); - it('should display a disabled button', () => { + it('should display a disabled button', async () => { const disabledButton = element.all(by.css('button')).get(2); - expect(disabledButton.isEnabled()).toBe(false); + expect(await disabledButton.isEnabled()).toBe(false); }); it('should submit form', async () => { @@ -48,8 +47,7 @@ describe('Template-reference-variables-example', () => { const nameInput = element.all(by.css('input')).get(2); await nameInput.sendKeys('123'); await submitButton.click(); - expect(element.all(by.css('div > p')).get(2).getText()).toEqual('Submitted. Form value is {"name":"123"}'); + expect(await element.all(by.css('div > p')).get(2).getText()).toEqual('Submitted. Form value is {"name":"123"}'); }); - }); diff --git a/aio/content/examples/template-syntax/e2e/src/app.e2e-spec.ts b/aio/content/examples/template-syntax/e2e/src/app.e2e-spec.ts index b44aeb7cdf32a..88f94ec10d583 100644 --- a/aio/content/examples/template-syntax/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/template-syntax/e2e/src/app.e2e-spec.ts @@ -3,30 +3,28 @@ import { browser, element, by } from 'protractor'; // TODO Not yet complete describe('Template Syntax', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('should be able to use interpolation with a hero', () => { + it('should be able to use interpolation with a hero', async () => { const heroInterEle = element.all(by.css('h2+p')).get(0); - expect(heroInterEle.getText()).toEqual('My current hero is Hercules'); + expect(await heroInterEle.getText()).toEqual('My current hero is Hercules'); }); - it('should be able to use interpolation with a calculation', () => { + it('should be able to use interpolation with a calculation', async () => { const theSumEles = element.all(by.cssContainingText('h3~p', 'The sum of')); - expect(theSumEles.count()).toBe(2); - expect(theSumEles.get(0).getText()).toEqual('The sum of 1 + 1 is 2'); - expect(theSumEles.get(1).getText()).toEqual('The sum of 1 + 1 is not 4'); + expect(await theSumEles.count()).toBe(2); + expect(await theSumEles.get(0).getText()).toEqual('The sum of 1 + 1 is 2'); + expect(await theSumEles.get(1).getText()).toEqual('The sum of 1 + 1 is not 4'); }); - it('should be able to use class binding syntax', () => { + it('should be able to use class binding syntax', async () => { const specialEle = element(by.cssContainingText('div', 'Special')); - expect(specialEle.getAttribute('class')).toMatch('special'); + expect(await specialEle.getAttribute('class')).toMatch('special'); }); - it('should be able to use style binding syntax', () => { + it('should be able to use style binding syntax', async () => { const specialButtonEle = element(by.cssContainingText('div.special~button', 'button')); - expect(specialButtonEle.getAttribute('style')).toMatch('color: red'); + expect(await specialButtonEle.getAttribute('style')).toMatch('color: red'); }); it('should two-way bind to sizer', async () => { @@ -34,15 +32,15 @@ describe('Template Syntax', () => { const incButton = div.element(by.buttonText('+')); const input = div.element(by.css('input')); const initSize = await input.getAttribute('value'); - incButton.click(); - expect(input.getAttribute('value')).toEqual((+initSize + 1).toString()); + await incButton.click(); + expect(await input.getAttribute('value')).toEqual((+initSize + 1).toString()); }); it('should change SVG rectangle\'s fill color on click', async () => { const div = element(by.css('app-svg')); const colorSquare = div.element(by.css('rect')); const initialColor = await colorSquare.getAttribute('fill'); - colorSquare.click(); - expect(colorSquare.getAttribute('fill')).not.toEqual(initialColor); + await colorSquare.click(); + expect(await colorSquare.getAttribute('fill')).not.toEqual(initialColor); }); }); diff --git a/aio/content/examples/testing/e2e/src/app.e2e-spec.ts b/aio/content/examples/testing/e2e/src/app.e2e-spec.ts index b06b7a095d377..d458faa747499 100644 --- a/aio/content/examples/testing/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/testing/e2e/src/app.e2e-spec.ts @@ -1,4 +1,4 @@ -import { browser, element, by, ElementFinder } from 'protractor'; +import { browser, element, by } from 'protractor'; describe('Testing Example', () => { const expectedViewNames = ['Dashboard', 'Heroes', 'About']; @@ -6,11 +6,8 @@ describe('Testing Example', () => { beforeAll(() => browser.get('')); function getPageElts() { - const navElts = element.all(by.css('app-root nav a')); - return { - navElts, - + navElts: element.all(by.css('app-root nav a')), appDashboard: element(by.css('app-root app-dashboard')), }; } @@ -20,14 +17,14 @@ describe('Testing Example', () => { }); it(`has views ${expectedViewNames}`, async () => { - const viewNames = getPageElts().navElts.map(async (el: ElementFinder) => await el.getText()); + const viewNames = await getPageElts().navElts.map(el => el.getText()); expect(viewNames).toEqual(expectedViewNames); }); - it('has dashboard as the active view', () => { + it('has dashboard as the active view', async () => { const page = getPageElts(); - expect(page.appDashboard.isPresent()).toBeTruthy(); + expect(await page.appDashboard.isPresent()).toBeTruthy(); }); }); diff --git a/aio/content/examples/toh-pt0/e2e/src/app.e2e-spec.ts b/aio/content/examples/toh-pt0/e2e/src/app.e2e-spec.ts index e05a1b4b21a99..4dccb587639f2 100644 --- a/aio/content/examples/toh-pt0/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/toh-pt0/e2e/src/app.e2e-spec.ts @@ -3,8 +3,8 @@ import { browser, element, by } from 'protractor'; describe('Tour of Heroes', () => { beforeEach(() => browser.get('/')); - it('should display "Tour of Heroes"', () => { - const title = element(by.css('app-root h1')).getText(); + it('should display "Tour of Heroes"', async () => { + const title = await element(by.css('app-root h1')).getText(); expect(title).toEqual('Tour of Heroes'); }); }); diff --git a/aio/content/examples/toh-pt1/e2e/src/app.e2e-spec.ts b/aio/content/examples/toh-pt1/e2e/src/app.e2e-spec.ts index 6d9cd078b60b4..b9724c090e43e 100644 --- a/aio/content/examples/toh-pt1/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/toh-pt1/e2e/src/app.e2e-spec.ts @@ -1,5 +1,4 @@ import { browser, element, by, ElementFinder } from 'protractor'; -import { promise } from 'selenium-webdriver'; const expectedH1 = 'Tour of Heroes'; const expectedTitle = `${expectedH1}`; @@ -23,9 +22,9 @@ class Hero { } const nameSuffix = 'X'; -function addToHeroName(text: string): promise.Promise { +async function addToHeroName(text: string): Promise { const input = element(by.css('input')); - return input.sendKeys(text); + await input.sendKeys(text); } describe('Tutorial part 1', () => { @@ -34,12 +33,12 @@ describe('Tutorial part 1', () => { beforeAll(() => browser.get('')); - it(`has title '${expectedTitle}'`, () => { - expect(browser.getTitle()).toEqual(expectedTitle); + it(`has title '${expectedTitle}'`, async () => { + expect(await browser.getTitle()).toEqual(expectedTitle); }); - it(`has h1 '${expectedH1}'`, () => { - const hText = element(by.css('h1')).getText(); + it(`has h1 '${expectedH1}'`, async () => { + const hText = await element(by.css('h1')).getText(); expect(hText).toEqual(expectedH1, 'h1'); }); @@ -51,7 +50,7 @@ describe('Tutorial part 1', () => { }); it(`shows updated hero name`, async () => { - addToHeroName(nameSuffix); + await addToHeroName(nameSuffix); const page = getPageElts(); const hero = await Hero.fromDetail(page.heroDetail); const newName = expectedHero.name + nameSuffix; diff --git a/aio/content/examples/toh-pt2/e2e/src/app.e2e-spec.ts b/aio/content/examples/toh-pt2/e2e/src/app.e2e-spec.ts index acc6f83229946..edf3b10fc6260 100644 --- a/aio/content/examples/toh-pt2/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/toh-pt2/e2e/src/app.e2e-spec.ts @@ -1,5 +1,4 @@ import { browser, element, by, ElementFinder } from 'protractor'; -import { promise } from 'selenium-webdriver'; const expectedH1 = 'Tour of Heroes'; const expectedTitle = `${expectedH1}`; @@ -8,30 +7,30 @@ const targetHero = { id: 16, name: 'RubberMan' }; const nameSuffix = 'X'; class Hero { - id: number; - name: string; - - // Factory methods - - // Get hero from s formatted as ' '. - static fromString(s: string): Hero { - return { - id: +s.substr(0, s.indexOf(' ')), - name: s.substr(s.indexOf(' ') + 1), - }; - } - - // Get hero id and name from the given detail element. - static async fromDetail(detail: ElementFinder): Promise { - // Get hero id from the first
- const id = await detail.all(by.css('div')).first().getText(); - // Get name from the h2 - const name = await detail.element(by.css('h2')).getText(); - return { - id: +id.substr(id.indexOf(' ') + 1), - name: name.substr(0, name.lastIndexOf(' ')) - }; - } + id: number; + name: string; + + // Factory methods + + // Get hero from s formatted as ' '. + static fromString(s: string): Hero { + return { + id: +s.substr(0, s.indexOf(' ')), + name: s.substr(s.indexOf(' ') + 1), + }; + } + + // Get hero id and name from the given detail element. + static async fromDetail(detail: ElementFinder): Promise { + // Get hero id from the first
+ const id = await detail.all(by.css('div')).first().getText(); + // Get name from the h2 + const name = await detail.element(by.css('h2')).getText(); + return { + id: +id.substr(id.indexOf(' ') + 1), + name: name.substr(0, name.lastIndexOf(' ')) + }; + } } describe('Tutorial part 2', () => { @@ -42,41 +41,41 @@ describe('Tutorial part 2', () => { }); function initialPageTests() { - it(`has title '${expectedTitle}'`, () => { - expect(browser.getTitle()).toEqual(expectedTitle); + it(`has title '${expectedTitle}'`, async () => { + expect(await browser.getTitle()).toEqual(expectedTitle); }); - it(`has h1 '${expectedH1}'`, () => { - expectHeading(1, expectedH1); + it(`has h1 '${expectedH1}'`, async () => { + await expectHeading(1, expectedH1); }); - it(`has h2 '${expectedH2}'`, () => { - expectHeading(2, expectedH2); + it(`has h2 '${expectedH2}'`, async () => { + await expectHeading(2, expectedH2); }); - it('has the right number of heroes', () => { + it('has the right number of heroes', async () => { const page = getPageElts(); - expect(page.heroes.count()).toEqual(10); + expect(await page.heroes.count()).toEqual(10); }); - it('has no selected hero and no hero details', () => { + it('has no selected hero and no hero details', async () => { const page = getPageElts(); - expect(page.selected.isPresent()).toBeFalsy('selected hero'); - expect(page.heroDetail.isPresent()).toBeFalsy('no hero detail'); + expect(await page.selected.isPresent()).toBeFalsy('selected hero'); + expect(await page.heroDetail.isPresent()).toBeFalsy('no hero detail'); }); } function selectHeroTests() { - it(`selects ${targetHero.name} from hero list`, () => { + it(`selects ${targetHero.name} from hero list`, async () => { const hero = element(by.cssContainingText('li span.badge', targetHero.id.toString())); - hero.click(); + await hero.click(); // Nothing specific to expect other than lack of exceptions. }); - it(`has selected ${targetHero.name}`, () => { + it(`has selected ${targetHero.name}`, async () => { const page = getPageElts(); const expectedText = `${targetHero.id} ${targetHero.name}`; - expect(page.selected.getText()).toBe(expectedText); + expect(await page.selected.getText()).toBe(expectedText); }); it('shows selected hero details', async () => { @@ -88,8 +87,8 @@ function selectHeroTests() { } function updateHeroTests() { - it(`can update hero name`, () => { - addToHeroName(nameSuffix); + it(`can update hero name`, async () => { + await addToHeroName(nameSuffix); // Nothing specific to expect other than lack of exceptions. }); @@ -111,15 +110,15 @@ function updateHeroTests() { } -function addToHeroName(text: string): promise.Promise { +async function addToHeroName(text: string): Promise { const input = element(by.css('input')); - return input.sendKeys(text); + await input.sendKeys(text); } -function expectHeading(hLevel: number, expectedText: string): void { - const hTag = `h${hLevel}`; - const hText = element(by.css(hTag)).getText(); - expect(hText).toEqual(expectedText, hTag); +async function expectHeading(hLevel: number, expectedText: string): Promise { + const hTag = `h${hLevel}`; + const hText = await element(by.css(hTag)).getText(); + expect(hText).toEqual(expectedText, hTag); } function getPageElts() { diff --git a/aio/content/examples/toh-pt3/e2e/src/app.e2e-spec.ts b/aio/content/examples/toh-pt3/e2e/src/app.e2e-spec.ts index 4eb601fee6016..b312ec9e67799 100644 --- a/aio/content/examples/toh-pt3/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/toh-pt3/e2e/src/app.e2e-spec.ts @@ -1,5 +1,4 @@ import { browser, element, by, ElementFinder } from 'protractor'; -import { promise } from 'selenium-webdriver'; const expectedH1 = 'Tour of Heroes'; const expectedTitle = `${expectedH1}`; @@ -8,30 +7,30 @@ const targetHero = { id: 16, name: 'RubberMan' }; const nameSuffix = 'X'; class Hero { - id: number; - name: string; - - // Factory methods - - // Get hero from s formatted as ' '. - static fromString(s: string): Hero { - return { - id: +s.substr(0, s.indexOf(' ')), - name: s.substr(s.indexOf(' ') + 1), - }; - } - - // Get hero id and name from the given detail element. - static async fromDetail(detail: ElementFinder): Promise { - // Get hero id from the first
- const id = await detail.all(by.css('div')).first().getText(); - // Get name from the h2 - const name = await detail.element(by.css('h2')).getText(); - return { - id: +id.substr(id.indexOf(' ') + 1), - name: name.substr(0, name.lastIndexOf(' ')) - }; - } + id: number; + name: string; + + // Factory methods + + // Get hero from s formatted as ' '. + static fromString(s: string): Hero { + return { + id: +s.substr(0, s.indexOf(' ')), + name: s.substr(s.indexOf(' ') + 1), + }; + } + + // Get hero id and name from the given detail element. + static async fromDetail(detail: ElementFinder): Promise { + // Get hero id from the first
+ const id = await detail.all(by.css('div')).first().getText(); + // Get name from the h2 + const name = await detail.element(by.css('h2')).getText(); + return { + id: +id.substr(id.indexOf(' ') + 1), + name: name.substr(0, name.lastIndexOf(' ')) + }; + } } describe('Tutorial part 3', () => { @@ -42,41 +41,41 @@ describe('Tutorial part 3', () => { }); function initialPageTests() { - it(`has title '${expectedTitle}'`, () => { - expect(browser.getTitle()).toEqual(expectedTitle); + it(`has title '${expectedTitle}'`, async () => { + expect(await browser.getTitle()).toEqual(expectedTitle); }); - it(`has h1 '${expectedH1}'`, () => { - expectHeading(1, expectedH1); + it(`has h1 '${expectedH1}'`, async () => { + await expectHeading(1, expectedH1); }); - it(`has h2 '${expectedH2}'`, () => { - expectHeading(2, expectedH2); + it(`has h2 '${expectedH2}'`, async () => { + await expectHeading(2, expectedH2); }); - it('has the right number of heroes', () => { + it('has the right number of heroes', async () => { const page = getPageElts(); - expect(page.heroes.count()).toEqual(10); + expect(await page.heroes.count()).toEqual(10); }); - it('has no selected hero and no hero details', () => { + it('has no selected hero and no hero details', async () => { const page = getPageElts(); - expect(page.selected.isPresent()).toBeFalsy('selected hero'); - expect(page.heroDetail.isPresent()).toBeFalsy('no hero detail'); + expect(await page.selected.isPresent()).toBeFalsy('selected hero'); + expect(await page.heroDetail.isPresent()).toBeFalsy('no hero detail'); }); } function selectHeroTests() { - it(`selects ${targetHero.name} from hero list`, () => { + it(`selects ${targetHero.name} from hero list`, async () => { const hero = element(by.cssContainingText('li span.badge', targetHero.id.toString())); - hero.click(); + await hero.click(); // Nothing specific to expect other than lack of exceptions. }); - it(`has selected ${targetHero.name}`, () => { + it(`has selected ${targetHero.name}`, async () => { const page = getPageElts(); const expectedText = `${targetHero.id} ${targetHero.name}`; - expect(page.selected.getText()).toBe(expectedText); + expect(await page.selected.getText()).toBe(expectedText); }); it('shows selected hero details', async () => { @@ -88,8 +87,8 @@ function selectHeroTests() { } function updateHeroTests() { - it(`can update hero name`, () => { - addToHeroName(nameSuffix); + it(`can update hero name`, async () => { + await addToHeroName(nameSuffix); // Nothing specific to expect other than lack of exceptions. }); @@ -111,15 +110,15 @@ function updateHeroTests() { } -function addToHeroName(text: string): promise.Promise { +async function addToHeroName(text: string): Promise { const input = element(by.css('input')); - return input.sendKeys(text); + await input.sendKeys(text); } -function expectHeading(hLevel: number, expectedText: string): void { - const hTag = `h${hLevel}`; - const hText = element(by.css(hTag)).getText(); - expect(hText).toEqual(expectedText, hTag); +async function expectHeading(hLevel: number, expectedText: string): Promise { + const hTag = `h${hLevel}`; + const hText = await element(by.css(hTag)).getText(); + expect(hText).toEqual(expectedText, hTag); } function getPageElts() { diff --git a/aio/content/examples/toh-pt4/e2e/src/app.e2e-spec.ts b/aio/content/examples/toh-pt4/e2e/src/app.e2e-spec.ts index 02330926afc59..450d520246c1c 100644 --- a/aio/content/examples/toh-pt4/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/toh-pt4/e2e/src/app.e2e-spec.ts @@ -1,5 +1,4 @@ import { browser, element, by, ElementFinder } from 'protractor'; -import { promise } from 'selenium-webdriver'; const expectedH1 = 'Tour of Heroes'; const expectedTitle = `${expectedH1}`; @@ -8,30 +7,30 @@ const targetHero = { id: 16, name: 'RubberMan' }; const nameSuffix = 'X'; class Hero { - id: number; - name: string; - - // Factory methods - - // Get hero from s formatted as ' '. - static fromString(s: string): Hero { - return { - id: +s.substr(0, s.indexOf(' ')), - name: s.substr(s.indexOf(' ') + 1), - }; - } - - // Get hero id and name from the given detail element. - static async fromDetail(detail: ElementFinder): Promise { - // Get hero id from the first
- const id = await detail.all(by.css('div')).first().getText(); - // Get name from the h2 - const name = await detail.element(by.css('h2')).getText(); - return { - id: +id.substr(id.indexOf(' ') + 1), - name: name.substr(0, name.lastIndexOf(' ')) - }; - } + id: number; + name: string; + + // Factory methods + + // Get hero from s formatted as ' '. + static fromString(s: string): Hero { + return { + id: +s.substr(0, s.indexOf(' ')), + name: s.substr(s.indexOf(' ') + 1), + }; + } + + // Get hero id and name from the given detail element. + static async fromDetail(detail: ElementFinder): Promise { + // Get hero id from the first
+ const id = await detail.all(by.css('div')).first().getText(); + // Get name from the h2 + const name = await detail.element(by.css('h2')).getText(); + return { + id: +id.substr(id.indexOf(' ') + 1), + name: name.substr(0, name.lastIndexOf(' ')) + }; + } } describe('Tutorial part 4', () => { @@ -42,58 +41,57 @@ describe('Tutorial part 4', () => { }); function initialPageTests() { - it(`has title '${expectedTitle}'`, () => { - expect(browser.getTitle()).toEqual(expectedTitle); + it(`has title '${expectedTitle}'`, async () => { + expect(await browser.getTitle()).toEqual(expectedTitle); }); - it(`has h1 '${expectedH1}'`, () => { - expectHeading(1, expectedH1); + it(`has h1 '${expectedH1}'`, async () => { + await expectHeading(1, expectedH1); }); - it(`has h2 '${expectedH2}'`, () => { - expectHeading(2, expectedH2); + it(`has h2 '${expectedH2}'`, async () => { + await expectHeading(2, expectedH2); }); - it('has the right number of heroes', () => { + it('has the right number of heroes', async () => { const page = getPageElts(); - expect(page.heroes.count()).toEqual(10); + expect(await page.heroes.count()).toEqual(10); }); - it('has no selected hero and no hero details', () => { + it('has no selected hero and no hero details', async () => { const page = getPageElts(); - expect(page.selected.isPresent()).toBeFalsy('selected hero'); - expect(page.heroDetail.isPresent()).toBeFalsy('no hero detail'); + expect(await page.selected.isPresent()).toBeFalsy('selected hero'); + expect(await page.heroDetail.isPresent()).toBeFalsy('no hero detail'); }); } function selectHeroTests() { - it(`selects ${targetHero.name} from hero list`, () => { + it(`selects ${targetHero.name} from hero list`, async () => { const hero = element(by.cssContainingText('li span.badge', targetHero.id.toString())); - hero.click(); + await hero.click(); // Nothing specific to expect other than lack of exceptions. }); - it(`has selected ${targetHero.name}`, () => { + it(`has selected ${targetHero.name}`, async () => { const page = getPageElts(); const expectedText = `${targetHero.id} ${targetHero.name}`; - expect(page.selected.getText()).toBe(expectedText); + expect(await page.selected.getText()).toBe(expectedText); }); it('shows selected hero details', async () => { const page = getPageElts(); - const message = getMessage(); + const message = await getMessage(); const hero = await Hero.fromDetail(page.heroDetail); expect(hero.id).toEqual(targetHero.id); expect(hero.name).toEqual(targetHero.name.toUpperCase()); // Message text contain id number matches the hero.id number - expect(message.getText()).toContain(hero.id); - + expect(await message.getText()).toContain(hero.id); }); } function updateHeroTests() { - it(`can update hero name`, () => { - addToHeroName(nameSuffix); + it(`can update hero name`, async () => { + await addToHeroName(nameSuffix); // Nothing specific to expect other than lack of exceptions. }); @@ -115,15 +113,15 @@ function updateHeroTests() { } -function addToHeroName(text: string): promise.Promise { +async function addToHeroName(text: string): Promise { const input = element(by.css('input')); - return input.sendKeys(text); + await input.sendKeys(text); } -function expectHeading(hLevel: number, expectedText: string): void { - const hTag = `h${hLevel}`; - const hText = element(by.css(hTag)).getText(); - expect(hText).toEqual(expectedText, hTag); +async function expectHeading(hLevel: number, expectedText: string): Promise { + const hTag = `h${hLevel}`; + const hText = await element(by.css(hTag)).getText(); + expect(hText).toEqual(expectedText, hTag); } function getPageElts() { @@ -134,8 +132,8 @@ function getPageElts() { }; } -function getMessage() { +async function getMessage() { const hero = element(by.cssContainingText('li span.badge', targetHero.id.toString())); - hero.click(); + await hero.click(); return element.all(by.css('app-root > app-messages > div > div')).get(1); } diff --git a/aio/content/examples/toh-pt5/e2e/src/app.e2e-spec.ts b/aio/content/examples/toh-pt5/e2e/src/app.e2e-spec.ts index ff0c0b5ff7eda..205d500afe80d 100644 --- a/aio/content/examples/toh-pt5/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/toh-pt5/e2e/src/app.e2e-spec.ts @@ -1,5 +1,4 @@ import { browser, element, by, ElementFinder } from 'protractor'; -import { promise } from 'selenium-webdriver'; const expectedH1 = 'Tour of Heroes'; const expectedTitle = `${expectedH1}`; @@ -9,30 +8,30 @@ const nameSuffix = 'X'; const newHeroName = targetHero.name + nameSuffix; class Hero { - id: number; - name: string; - - // Factory methods - - // Get hero from s formatted as ' '. - static fromString(s: string): Hero { - return { - id: +s.substr(0, s.indexOf(' ')), - name: s.substr(s.indexOf(' ') + 1), - }; - } - - // Get hero id and name from the given detail element. - static async fromDetail(detail: ElementFinder): Promise { - // Get hero id from the first
- const id = await detail.all(by.css('div')).first().getText(); - // Get name from the h2 - const name = await detail.element(by.css('h2')).getText(); - return { - id: +id.substr(id.indexOf(' ') + 1), - name: name.substr(0, name.lastIndexOf(' ')) - }; - } + id: number; + name: string; + + // Factory methods + + // Get hero from s formatted as ' '. + static fromString(s: string): Hero { + return { + id: +s.substr(0, s.indexOf(' ')), + name: s.substr(s.indexOf(' ') + 1), + }; + } + + // Get hero id and name from the given detail element. + static async fromDetail(detail: ElementFinder): Promise { + // Get hero id from the first
+ const id = await detail.all(by.css('div')).first().getText(); + // Get name from the h2 + const name = await detail.element(by.css('h2')).getText(); + return { + id: +id.substr(id.indexOf(' ') + 1), + name: name.substr(0, name.lastIndexOf(' ')) + }; + } } describe('Tutorial part 5', () => { @@ -58,23 +57,23 @@ describe('Tutorial part 5', () => { describe('Initial page', () => { - it(`has title '${expectedTitle}'`, () => { - expect(browser.getTitle()).toEqual(expectedTitle); + it(`has title '${expectedTitle}'`, async () => { + expect(await browser.getTitle()).toEqual(expectedTitle); }); - it(`has h1 '${expectedH1}'`, () => { - expectHeading(1, expectedH1); + it(`has h1 '${expectedH1}'`, async () => { + await expectHeading(1, expectedH1); }); const expectedViewNames = ['Dashboard', 'Heroes']; - it(`has views ${expectedViewNames}`, () => { - const viewNames = getPageElts().navElts.map((el: ElementFinder) => el.getText()); + it(`has views ${expectedViewNames}`, async () => { + const viewNames = await getPageElts().navElts.map(el => el.getText()); expect(viewNames).toEqual(expectedViewNames); }); - it('has dashboard as the active view', () => { + it('has dashboard as the active view', async () => { const page = getPageElts(); - expect(page.appDashboard.isPresent()).toBeTruthy(); + expect(await page.appDashboard.isPresent()).toBeTruthy(); }); }); @@ -83,19 +82,19 @@ describe('Tutorial part 5', () => { beforeAll(() => browser.get('')); - it('has top heroes', () => { + it('has top heroes', async () => { const page = getPageElts(); - expect(page.topHeroes.count()).toEqual(4); + expect(await page.topHeroes.count()).toEqual(4); }); it(`selects and routes to ${targetHero.name} details`, dashboardSelectTargetHero); it(`updates hero name (${newHeroName}) in details view`, updateHeroNameInDetailView); - it(`saves and shows ${newHeroName} in Dashboard`, () => { - element(by.buttonText('go back')).click(); + it(`saves and shows ${newHeroName} in Dashboard`, async () => { + await element(by.buttonText('go back')).click(); const targetHeroElt = getPageElts().topHeroes.get(targetHeroDashboardIndex); - expect(targetHeroElt.getText()).toEqual(newHeroName); + expect(await targetHeroElt.getText()).toEqual(newHeroName); }); }); @@ -104,18 +103,18 @@ describe('Tutorial part 5', () => { beforeAll(() => browser.get('')); - it('can switch to Heroes view', () => { - getPageElts().appHeroesHref.click(); + it('can switch to Heroes view', async () => { + await getPageElts().appHeroesHref.click(); const page = getPageElts(); - expect(page.appHeroes.isPresent()).toBeTruthy(); - expect(page.allHeroes.count()).toEqual(10, 'number of heroes'); + expect(await page.appHeroes.isPresent()).toBeTruthy(); + expect(await page.allHeroes.count()).toEqual(10, 'number of heroes'); }); it('can route to hero details', async () => { - getHeroLiEltById(targetHero.id).click(); + await getHeroLiEltById(targetHero.id).click(); const page = getPageElts(); - expect(page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); + expect(await page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); const hero = await Hero.fromDetail(page.heroDetail); expect(hero.id).toEqual(targetHero.id); expect(hero.name).toEqual(targetHero.name.toUpperCase()); @@ -123,21 +122,21 @@ describe('Tutorial part 5', () => { it(`updates hero name (${newHeroName}) in details view`, updateHeroNameInDetailView); - it(`shows ${newHeroName} in Heroes list`, () => { - element(by.buttonText('go back')).click(); + it(`shows ${newHeroName} in Heroes list`, async () => { + await element(by.buttonText('go back')).click(); const expectedText = `${targetHero.id} ${newHeroName}`; - expect(getHeroLiEltById(targetHero.id).getText()).toEqual(expectedText); + expect(await getHeroLiEltById(targetHero.id).getText()).toEqual(expectedText); }); }); async function dashboardSelectTargetHero() { const targetHeroElt = getPageElts().topHeroes.get(targetHeroDashboardIndex); - expect(targetHeroElt.getText()).toEqual(targetHero.name); - targetHeroElt.click(); + expect(await targetHeroElt.getText()).toEqual(targetHero.name); + await targetHeroElt.click(); const page = getPageElts(); - expect(page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); + expect(await page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); const hero = await Hero.fromDetail(page.heroDetail); expect(hero.id).toEqual(targetHero.id); expect(hero.name).toEqual(targetHero.name.toUpperCase()); @@ -145,7 +144,7 @@ describe('Tutorial part 5', () => { async function updateHeroNameInDetailView() { // Assumes that the current view is the hero details view. - addToHeroName(nameSuffix); + await addToHeroName(nameSuffix); const page = getPageElts(); const hero = await Hero.fromDetail(page.heroDetail); @@ -155,15 +154,15 @@ describe('Tutorial part 5', () => { }); -function addToHeroName(text: string): promise.Promise { +async function addToHeroName(text: string): Promise { const input = element(by.css('input')); - return input.sendKeys(text); + await input.sendKeys(text); } -function expectHeading(hLevel: number, expectedText: string): void { - const hTag = `h${hLevel}`; - const hText = element(by.css(hTag)).getText(); - expect(hText).toEqual(expectedText, hTag); +async function expectHeading(hLevel: number, expectedText: string): Promise { + const hTag = `h${hLevel}`; + const hText = await element(by.css(hTag)).getText(); + expect(hText).toEqual(expectedText, hTag); } function getHeroLiEltById(id: number) { diff --git a/aio/content/examples/toh-pt6/e2e/src/app.e2e-spec.ts b/aio/content/examples/toh-pt6/e2e/src/app.e2e-spec.ts index 58f5677d9d70c..c92e101fb0b71 100644 --- a/aio/content/examples/toh-pt6/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/toh-pt6/e2e/src/app.e2e-spec.ts @@ -1,5 +1,4 @@ import { browser, element, by, ElementFinder, ElementArrayFinder } from 'protractor'; -import { promise } from 'selenium-webdriver'; const expectedH1 = 'Tour of Heroes'; const expectedTitle = `${expectedH1}`; @@ -24,9 +23,9 @@ class Hero { // Hero from hero list
  • element. static async fromLi(li: ElementFinder): Promise { - const stringsFromA = await li.all(by.css('a')).getText(); - const strings = stringsFromA[0].split(' '); - return { id: +strings[0], name: strings[1] }; + const stringsFromA = await li.all(by.css('a')).getText(); + const strings = stringsFromA[0].split(' '); + return { id: +strings[0], name: strings[1] }; } // Hero id and name from the given detail element. @@ -36,8 +35,8 @@ class Hero { // Get name from the h2 const name = await detail.element(by.css('h2')).getText(); return { - id: +id.substr(id.indexOf(' ') + 1), - name: name.substr(0, name.lastIndexOf(' ')) + id: +id.substr(id.indexOf(' ') + 1), + name: name.substr(0, name.lastIndexOf(' ')) }; } } @@ -70,23 +69,23 @@ describe('Tutorial part 6', () => { describe('Initial page', () => { - it(`has title '${expectedTitle}'`, () => { - expect(browser.getTitle()).toEqual(expectedTitle); + it(`has title '${expectedTitle}'`, async () => { + expect(await browser.getTitle()).toEqual(expectedTitle); }); - it(`has h1 '${expectedH1}'`, () => { - expectHeading(1, expectedH1); + it(`has h1 '${expectedH1}'`, async () => { + await expectHeading(1, expectedH1); }); const expectedViewNames = ['Dashboard', 'Heroes']; - it(`has views ${expectedViewNames}`, () => { - const viewNames = getPageElts().navElts.map((el: ElementFinder) => el.getText()); + it(`has views ${expectedViewNames}`, async () => { + const viewNames = await getPageElts().navElts.map(el => el.getText()); expect(viewNames).toEqual(expectedViewNames); }); - it('has dashboard as the active view', () => { + it('has dashboard as the active view', async () => { const page = getPageElts(); - expect(page.appDashboard.isPresent()).toBeTruthy(); + expect(await page.appDashboard.isPresent()).toBeTruthy(); }); }); @@ -95,33 +94,33 @@ describe('Tutorial part 6', () => { beforeAll(() => browser.get('')); - it('has top heroes', () => { + it('has top heroes', async () => { const page = getPageElts(); - expect(page.topHeroes.count()).toEqual(4); + expect(await page.topHeroes.count()).toEqual(4); }); it(`selects and routes to ${targetHero.name} details`, dashboardSelectTargetHero); it(`updates hero name (${newHeroName}) in details view`, updateHeroNameInDetailView); - it(`cancels and shows ${targetHero.name} in Dashboard`, () => { - element(by.buttonText('go back')).click(); - browser.waitForAngular(); // seems necessary to gets tests to pass for toh-pt6 + it(`cancels and shows ${targetHero.name} in Dashboard`, async () => { + await element(by.buttonText('go back')).click(); + await browser.waitForAngular(); // seems necessary to gets tests to pass for toh-pt6 const targetHeroElt = getPageElts().topHeroes.get(targetHeroDashboardIndex); - expect(targetHeroElt.getText()).toEqual(targetHero.name); + expect(await targetHeroElt.getText()).toEqual(targetHero.name); }); it(`selects and routes to ${targetHero.name} details`, dashboardSelectTargetHero); it(`updates hero name (${newHeroName}) in details view`, updateHeroNameInDetailView); - it(`saves and shows ${newHeroName} in Dashboard`, () => { - element(by.buttonText('save')).click(); - browser.waitForAngular(); // seems necessary to gets tests to pass for toh-pt6 + it(`saves and shows ${newHeroName} in Dashboard`, async () => { + await element(by.buttonText('save')).click(); + await browser.waitForAngular(); // seems necessary to gets tests to pass for toh-pt6 const targetHeroElt = getPageElts().topHeroes.get(targetHeroDashboardIndex); - expect(targetHeroElt.getText()).toEqual(newHeroName); + expect(await targetHeroElt.getText()).toEqual(newHeroName); }); }); @@ -130,18 +129,18 @@ describe('Tutorial part 6', () => { beforeAll(() => browser.get('')); - it('can switch to Heroes view', () => { - getPageElts().appHeroesHref.click(); + it('can switch to Heroes view', async () => { + await getPageElts().appHeroesHref.click(); const page = getPageElts(); - expect(page.appHeroes.isPresent()).toBeTruthy(); - expect(page.allHeroes.count()).toEqual(10, 'number of heroes'); + expect(await page.appHeroes.isPresent()).toBeTruthy(); + expect(await page.allHeroes.count()).toEqual(10, 'number of heroes'); }); it('can route to hero details', async () => { - getHeroLiEltById(targetHero.id).click(); + await getHeroLiEltById(targetHero.id).click(); const page = getPageElts(); - expect(page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); + expect(await page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); const hero = await Hero.fromDetail(page.heroDetail); expect(hero.id).toEqual(targetHero.id); expect(hero.name).toEqual(targetHero.name.toUpperCase()); @@ -149,21 +148,21 @@ describe('Tutorial part 6', () => { it(`updates hero name (${newHeroName}) in details view`, updateHeroNameInDetailView); - it(`shows ${newHeroName} in Heroes list`, () => { - element(by.buttonText('save')).click(); - browser.waitForAngular(); + it(`shows ${newHeroName} in Heroes list`, async () => { + await element(by.buttonText('save')).click(); + await browser.waitForAngular(); const expectedText = `${targetHero.id} ${newHeroName}`; - expect(getHeroAEltById(targetHero.id).getText()).toEqual(expectedText); + expect(await getHeroAEltById(targetHero.id).getText()).toEqual(expectedText); }); it(`deletes ${newHeroName} from Heroes list`, async () => { const heroesBefore = await toHeroArray(getPageElts().allHeroes); const li = getHeroLiEltById(targetHero.id); - li.element(by.buttonText('x')).click(); + await li.element(by.buttonText('x')).click(); const page = getPageElts(); - expect(page.appHeroes.isPresent()).toBeTruthy(); - expect(page.allHeroes.count()).toEqual(9, 'number of heroes'); + expect(await page.appHeroes.isPresent()).toBeTruthy(); + expect(await page.allHeroes.count()).toEqual(9, 'number of heroes'); const heroesAfter = await toHeroArray(page.allHeroes); // console.log(await Hero.fromLi(page.allHeroes[0])); const expectedHeroes = heroesBefore.filter(h => h.name !== newHeroName); @@ -176,8 +175,8 @@ describe('Tutorial part 6', () => { const heroesBefore = await toHeroArray(getPageElts().allHeroes); const numHeroes = heroesBefore.length; - element(by.css('input')).sendKeys(addedHeroName); - element(by.buttonText('add')).click(); + await element(by.css('input')).sendKeys(addedHeroName); + await element(by.buttonText('add')).click(); const page = getPageElts(); const heroesAfter = await toHeroArray(page.allHeroes); @@ -190,25 +189,25 @@ describe('Tutorial part 6', () => { }); it('displays correctly styled buttons', async () => { - element.all(by.buttonText('x')).then(buttons => { - for (const button of buttons) { - // Inherited styles from styles.css - expect(button.getCssValue('font-family')).toBe('Arial'); - expect(button.getCssValue('border')).toContain('none'); - expect(button.getCssValue('padding')).toBe('5px 10px'); - expect(button.getCssValue('border-radius')).toBe('4px'); - // Styles defined in heroes.component.css - expect(button.getCssValue('left')).toBe('194px'); - expect(button.getCssValue('top')).toBe('-32px'); - } - }); + const buttons = await element.all(by.buttonText('x')); + + for (const button of buttons) { + // Inherited styles from styles.css + expect(await button.getCssValue('font-family')).toBe('Arial'); + expect(await button.getCssValue('border')).toContain('none'); + expect(await button.getCssValue('padding')).toBe('5px 10px'); + expect(await button.getCssValue('border-radius')).toBe('4px'); + // Styles defined in heroes.component.css + expect(await button.getCssValue('left')).toBe('194px'); + expect(await button.getCssValue('top')).toBe('-32px'); + } const addButton = element(by.buttonText('add')); // Inherited styles from styles.css - expect(addButton.getCssValue('font-family')).toBe('Arial'); - expect(addButton.getCssValue('border')).toContain('none'); - expect(addButton.getCssValue('padding')).toBe('5px 10px'); - expect(addButton.getCssValue('border-radius')).toBe('4px'); + expect(await addButton.getCssValue('font-family')).toBe('Arial'); + expect(await addButton.getCssValue('border')).toContain('none'); + expect(await addButton.getCssValue('padding')).toBe('5px 10px'); + expect(await addButton.getCssValue('border-radius')).toBe('4px'); }); }); @@ -218,34 +217,34 @@ describe('Tutorial part 6', () => { beforeAll(() => browser.get('')); it(`searches for 'Ma'`, async () => { - getPageElts().searchBox.sendKeys('Ma'); - browser.sleep(1000); + await getPageElts().searchBox.sendKeys('Ma'); + await browser.sleep(1000); - expect(getPageElts().searchResults.count()).toBe(4); + expect(await getPageElts().searchResults.count()).toBe(4); }); it(`continues search with 'g'`, async () => { - getPageElts().searchBox.sendKeys('g'); - browser.sleep(1000); - expect(getPageElts().searchResults.count()).toBe(2); + await getPageElts().searchBox.sendKeys('g'); + await browser.sleep(1000); + expect(await getPageElts().searchResults.count()).toBe(2); }); it(`continues search with 'e' and gets ${targetHero.name}`, async () => { - getPageElts().searchBox.sendKeys('n'); - browser.sleep(1000); + await getPageElts().searchBox.sendKeys('n'); + await browser.sleep(1000); const page = getPageElts(); - expect(page.searchResults.count()).toBe(1); + expect(await page.searchResults.count()).toBe(1); const hero = page.searchResults.get(0); - expect(hero.getText()).toEqual(targetHero.name); + expect(await hero.getText()).toEqual(targetHero.name); }); it(`navigates to ${targetHero.name} details view`, async () => { const hero = getPageElts().searchResults.get(0); - expect(hero.getText()).toEqual(targetHero.name); - hero.click(); + expect(await hero.getText()).toEqual(targetHero.name); + await hero.click(); const page = getPageElts(); - expect(page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); + expect(await page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); const hero2 = await Hero.fromDetail(page.heroDetail); expect(hero2.id).toEqual(targetHero.id); expect(hero2.name).toEqual(targetHero.name.toUpperCase()); @@ -254,12 +253,12 @@ describe('Tutorial part 6', () => { async function dashboardSelectTargetHero() { const targetHeroElt = getPageElts().topHeroes.get(targetHeroDashboardIndex); - expect(targetHeroElt.getText()).toEqual(targetHero.name); - targetHeroElt.click(); - browser.waitForAngular(); // seems necessary to gets tests to pass for toh-pt6 + expect(await targetHeroElt.getText()).toEqual(targetHero.name); + await targetHeroElt.click(); + await browser.waitForAngular(); // seems necessary to gets tests to pass for toh-pt6 const page = getPageElts(); - expect(page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); + expect(await page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); const hero = await Hero.fromDetail(page.heroDetail); expect(hero.id).toEqual(targetHero.id); expect(hero.name).toEqual(targetHero.name.toUpperCase()); @@ -267,7 +266,7 @@ describe('Tutorial part 6', () => { async function updateHeroNameInDetailView() { // Assumes that the current view is the hero details view. - addToHeroName(nameSuffix); + await addToHeroName(nameSuffix); const page = getPageElts(); const hero = await Hero.fromDetail(page.heroDetail); @@ -277,15 +276,15 @@ describe('Tutorial part 6', () => { }); -function addToHeroName(text: string): promise.Promise { +async function addToHeroName(text: string): Promise { const input = element(by.css('input')); - return input.sendKeys(text); + await input.sendKeys(text); } -function expectHeading(hLevel: number, expectedText: string): void { - const hTag = `h${hLevel}`; - const hText = element(by.css(hTag)).getText(); - expect(hText).toEqual(expectedText, hTag); +async function expectHeading(hLevel: number, expectedText: string): Promise { + const hTag = `h${hLevel}`; + const hText = await element(by.css(hTag)).getText(); + expect(hText).toEqual(expectedText, hTag); } function getHeroAEltById(id: number): ElementFinder { @@ -299,7 +298,5 @@ function getHeroLiEltById(id: number): ElementFinder { } async function toHeroArray(allHeroes: ElementArrayFinder): Promise { - const promisedHeroes = await allHeroes.map(Hero.fromLi); - // The cast is necessary to get around issuing with the signature of Promise.all() - return Promise.all(promisedHeroes) as Promise; + return allHeroes.map(Hero.fromLi); } diff --git a/aio/content/examples/two-way-binding/e2e/src/app.e2e-spec.ts b/aio/content/examples/two-way-binding/e2e/src/app.e2e-spec.ts index 229a0987d3a4c..c0a29c9b6a64e 100644 --- a/aio/content/examples/two-way-binding/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/two-way-binding/e2e/src/app.e2e-spec.ts @@ -2,41 +2,39 @@ import { browser, element, by } from 'protractor'; describe('Two-way binding e2e tests', () => { - beforeEach(() => { - browser.get(''); - }); + beforeEach(() => browser.get('')); const minusButton = element.all(by.css('button')).get(0); const plusButton = element.all(by.css('button')).get(1); const minus2Button = element.all(by.css('button')).get(2); const plus2Button = element.all(by.css('button')).get(3); - it('should display Two-way Binding', () => { - expect(element(by.css('h1')).getText()).toEqual('Two-way Binding'); + it('should display Two-way Binding', async () => { + expect(await element(by.css('h1')).getText()).toEqual('Two-way Binding'); }); - it('should display four buttons', () => { - expect(minusButton.getText()).toBe('-'); - expect(plusButton.getText()).toBe('+'); - expect(minus2Button.getText()).toBe('-'); - expect(plus2Button.getText()).toBe('+'); + it('should display four buttons', async () => { + expect(await minusButton.getText()).toBe('-'); + expect(await plusButton.getText()).toBe('+'); + expect(await minus2Button.getText()).toBe('-'); + expect(await plus2Button.getText()).toBe('+'); }); it('should change font size labels', async () => { await minusButton.click(); - expect(element.all(by.css('label')).get(0).getText()).toEqual('FontSize: 15px'); - expect(element.all(by.css('input')).get(0).getAttribute('value')).toEqual('15'); + expect(await element.all(by.css('label')).get(0).getText()).toEqual('FontSize: 15px'); + expect(await element.all(by.css('input')).get(0).getAttribute('value')).toEqual('15'); await plusButton.click(); - expect(element.all(by.css('label')).get(0).getText()).toEqual('FontSize: 16px'); - expect(element.all(by.css('input')).get(0).getAttribute('value')).toEqual('16'); + expect(await element.all(by.css('label')).get(0).getText()).toEqual('FontSize: 16px'); + expect(await element.all(by.css('input')).get(0).getAttribute('value')).toEqual('16'); await minus2Button.click(); - await expect(element.all(by.css('label')).get(2).getText()).toEqual('FontSize: 15px'); + expect(await element.all(by.css('label')).get(2).getText()).toEqual('FontSize: 15px'); }); - it('should display De-sugared two-way binding', () => { - expect(element(by.css('h2')).getText()).toEqual('De-sugared two-way binding'); + it('should display De-sugared two-way binding', async () => { + expect(await element(by.css('h2')).getText()).toEqual('De-sugared two-way binding'); }); }); diff --git a/aio/content/examples/universal/e2e/src/app.e2e-spec.ts b/aio/content/examples/universal/e2e/src/app.e2e-spec.ts index 92cae94e31b09..ffebea3ff196e 100644 --- a/aio/content/examples/universal/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/universal/e2e/src/app.e2e-spec.ts @@ -52,74 +52,74 @@ describe('Universal', () => { describe('Initial page', () => { beforeAll(() => browser.get('')); - it(`has title '${expectedTitle}'`, () => { - expect(browser.getTitle()).toEqual(expectedTitle); + it(`has title '${expectedTitle}'`, async () => { + expect(await browser.getTitle()).toEqual(expectedTitle); }); - it(`has h1 '${expectedH1}'`, () => { - expectHeading(1, expectedH1); + it(`has h1 '${expectedH1}'`, async () => { + await expectHeading(1, expectedH1); }); const expectedViewNames = ['Dashboard', 'Heroes']; - it(`has views ${expectedViewNames}`, () => { - const viewNames = getPageElts().navElts.map((el: ElementFinder) => el.getText()); + it(`has views ${expectedViewNames}`, async () => { + const viewNames = await getPageElts().navElts.map(el => el.getText()); expect(viewNames).toEqual(expectedViewNames); }); - it('has dashboard as the active view', () => { + it('has dashboard as the active view', async () => { const page = getPageElts(); - expect(page.appDashboard.isPresent()).toBeTruthy(); + expect(await page.appDashboard.isPresent()).toBeTruthy(); }); }); describe('Dashboard tests', () => { beforeAll(() => browser.get('')); - it('has top heroes', () => { + it('has top heroes', async () => { const page = getPageElts(); - expect(page.topHeroes.count()).toEqual(4); + expect(await page.topHeroes.count()).toEqual(4); }); it(`selects and routes to ${targetHero.name} details`, dashboardSelectTargetHero); it(`updates hero name (${newHeroName}) in details view`, updateHeroNameInDetailView); - it(`cancels and shows ${targetHero.name} in Dashboard`, () => { - element(by.buttonText('go back')).click(); - browser.waitForAngular(); // seems necessary to gets tests to pass for toh-pt6 + it(`cancels and shows ${targetHero.name} in Dashboard`, async () => { + await element(by.buttonText('go back')).click(); + await browser.waitForAngular(); // seems necessary to gets tests to pass for toh-pt6 const targetHeroElt = getPageElts().topHeroes.get(targetHeroDashboardIndex); - expect(targetHeroElt.getText()).toEqual(targetHero.name); + expect(await targetHeroElt.getText()).toEqual(targetHero.name); }); it(`selects and routes to ${targetHero.name} details`, dashboardSelectTargetHero); it(`updates hero name (${newHeroName}) in details view`, updateHeroNameInDetailView); - it(`saves and shows ${newHeroName} in Dashboard`, () => { - element(by.buttonText('save')).click(); - browser.waitForAngular(); // seems necessary to gets tests to pass for toh-pt6 + it(`saves and shows ${newHeroName} in Dashboard`, async () => { + await element(by.buttonText('save')).click(); + await browser.waitForAngular(); // seems necessary to gets tests to pass for toh-pt6 const targetHeroElt = getPageElts().topHeroes.get(targetHeroDashboardIndex); - expect(targetHeroElt.getText()).toEqual(newHeroName); + expect(await targetHeroElt.getText()).toEqual(newHeroName); }); }); describe('Heroes tests', () => { beforeAll(() => browser.get('')); - it('can switch to Heroes view', () => { - getPageElts().appHeroesHref.click(); + it('can switch to Heroes view', async () => { + await getPageElts().appHeroesHref.click(); const page = getPageElts(); - expect(page.appHeroes.isPresent()).toBeTruthy(); - expect(page.allHeroes.count()).toEqual(10, 'number of heroes'); + expect(await page.appHeroes.isPresent()).toBeTruthy(); + expect(await page.allHeroes.count()).toEqual(10, 'number of heroes'); }); it('can route to hero details', async () => { - getHeroLiEltById(targetHero.id).click(); + await getHeroLiEltById(targetHero.id).click(); const page = getPageElts(); - expect(page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); + expect(await page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); const hero = await Hero.fromDetail(page.heroDetail); expect(hero.id).toEqual(targetHero.id); expect(hero.name).toEqual(targetHero.name.toUpperCase()); @@ -127,26 +127,26 @@ describe('Universal', () => { it(`updates hero name (${newHeroName}) in details view`, updateHeroNameInDetailView); - it(`shows ${newHeroName} in Heroes list`, () => { - element(by.buttonText('save')).click(); - browser.waitForAngular(); + it(`shows ${newHeroName} in Heroes list`, async () => { + await element(by.buttonText('save')).click(); + await browser.waitForAngular(); const expectedText = `${targetHero.id} ${newHeroName}`; - expect(getHeroAEltById(targetHero.id).getText()).toEqual(expectedText); + expect(await getHeroAEltById(targetHero.id).getText()).toEqual(expectedText); }); it(`deletes ${newHeroName} from Heroes list`, async () => { const heroesBefore = await toHeroArray(getPageElts().allHeroes); const li = getHeroLiEltById(targetHero.id); - li.element(by.buttonText('x')).click(); + await li.element(by.buttonText('x')).click(); const page = getPageElts(); - expect(page.appHeroes.isPresent()).toBeTruthy(); - expect(page.allHeroes.count()).toEqual(9, 'number of heroes'); + expect(await page.appHeroes.isPresent()).toBeTruthy(); + expect(await page.allHeroes.count()).toEqual(9, 'number of heroes'); const heroesAfter = await toHeroArray(page.allHeroes); // console.log(await Hero.fromLi(page.allHeroes[0])); const expectedHeroes = heroesBefore.filter(h => h.name !== newHeroName); expect(heroesAfter).toEqual(expectedHeroes); - // expect(page.selectedHeroSubview.isPresent()).toBeFalsy(); + // expect(await page.selectedHeroSubview.isPresent()).toBeFalsy(); }); it(`adds back ${targetHero.name}`, async () => { @@ -154,8 +154,8 @@ describe('Universal', () => { const heroesBefore = await toHeroArray(getPageElts().allHeroes); const numHeroes = heroesBefore.length; - element(by.css('input')).sendKeys(updatedHeroName); - element(by.buttonText('add')).click(); + await element(by.css('input')).sendKeys(updatedHeroName); + await element(by.buttonText('add')).click(); const page = getPageElts(); const heroesAfter = await toHeroArray(page.allHeroes); @@ -168,25 +168,25 @@ describe('Universal', () => { }); it('displays correctly styled buttons', async () => { - element.all(by.buttonText('x')).then(buttons => { - for (const button of buttons) { - // Inherited styles from styles.css - expect(button.getCssValue('font-family')).toBe('Arial'); - expect(button.getCssValue('border')).toContain('none'); - expect(button.getCssValue('padding')).toBe('5px 10px'); - expect(button.getCssValue('border-radius')).toBe('4px'); - // Styles defined in heroes.component.css - expect(button.getCssValue('left')).toBe('194px'); - expect(button.getCssValue('top')).toBe('-32px'); - } - }); + const buttons = await element.all(by.buttonText('x')); + + for (const button of buttons) { + // Inherited styles from styles.css + expect(await button.getCssValue('font-family')).toBe('Arial'); + expect(await button.getCssValue('border')).toContain('none'); + expect(await button.getCssValue('padding')).toBe('5px 10px'); + expect(await button.getCssValue('border-radius')).toBe('4px'); + // Styles defined in heroes.component.css + expect(await button.getCssValue('left')).toBe('194px'); + expect(await button.getCssValue('top')).toBe('-32px'); + } const addButton = element(by.buttonText('add')); // Inherited styles from styles.css - expect(addButton.getCssValue('font-family')).toBe('Arial'); - expect(addButton.getCssValue('border')).toContain('none'); - expect(addButton.getCssValue('padding')).toBe('5px 10px'); - expect(addButton.getCssValue('border-radius')).toBe('4px'); + expect(await addButton.getCssValue('font-family')).toBe('Arial'); + expect(await addButton.getCssValue('border')).toContain('none'); + expect(await addButton.getCssValue('padding')).toBe('5px 10px'); + expect(await addButton.getCssValue('border-radius')).toBe('4px'); }); }); @@ -194,34 +194,34 @@ describe('Universal', () => { beforeAll(() => browser.get('')); it(`searches for 'Ma'`, async () => { - getPageElts().searchBox.sendKeys('Ma'); - browser.sleep(1000); + await getPageElts().searchBox.sendKeys('Ma'); + await browser.sleep(1000); - expect(getPageElts().searchResults.count()).toBe(4); + expect(await getPageElts().searchResults.count()).toBe(4); }); it(`continues search with 'g'`, async () => { - getPageElts().searchBox.sendKeys('g'); - browser.sleep(1000); - expect(getPageElts().searchResults.count()).toBe(2); + await getPageElts().searchBox.sendKeys('g'); + await browser.sleep(1000); + expect(await getPageElts().searchResults.count()).toBe(2); }); it(`continues search with 'e' and gets ${targetHero.name}`, async () => { - getPageElts().searchBox.sendKeys('n'); - browser.sleep(1000); + await getPageElts().searchBox.sendKeys('n'); + await browser.sleep(1000); const page = getPageElts(); - expect(page.searchResults.count()).toBe(1); + expect(await page.searchResults.count()).toBe(1); const hero = page.searchResults.get(0); - expect(hero.getText()).toEqual(targetHero.name); + expect(await hero.getText()).toEqual(targetHero.name); }); it(`navigates to ${targetHero.name} details view`, async () => { const hero = getPageElts().searchResults.get(0); - expect(hero.getText()).toEqual(targetHero.name); - hero.click(); + expect(await hero.getText()).toEqual(targetHero.name); + await hero.click(); const page = getPageElts(); - expect(page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); + expect(await page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); const hero2 = await Hero.fromDetail(page.heroDetail); expect(hero2.id).toEqual(targetHero.id); expect(hero2.name).toEqual(targetHero.name.toUpperCase()); @@ -229,26 +229,26 @@ describe('Universal', () => { }); // Helpers - function addToHeroName(text: string): Promise { - return element(by.css('input')).sendKeys(text) as Promise; + async function addToHeroName(text: string): Promise { + await element(by.css('input')).sendKeys(text); } async function dashboardSelectTargetHero(): Promise { const targetHeroElt = getPageElts().topHeroes.get(targetHeroDashboardIndex); - expect(targetHeroElt.getText()).toEqual(targetHero.name); - targetHeroElt.click(); - browser.waitForAngular(); // seems necessary to gets tests to pass for toh-pt6 + expect(await targetHeroElt.getText()).toEqual(targetHero.name); + await targetHeroElt.click(); + await browser.waitForAngular(); // seems necessary to gets tests to pass for toh-pt6 const page = getPageElts(); - expect(page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); + expect(await page.heroDetail.isPresent()).toBeTruthy('shows hero detail'); const hero = await Hero.fromDetail(page.heroDetail); expect(hero.id).toEqual(targetHero.id); expect(hero.name).toEqual(targetHero.name.toUpperCase()); } - function expectHeading(hLevel: number, expectedText: string): void { + async function expectHeading(hLevel: number, expectedText: string): Promise { const hTag = `h${hLevel}`; - const hText = element(by.css(hTag)).getText(); + const hText = await element(by.css(hTag)).getText(); expect(hText).toEqual(expectedText, hTag); } @@ -290,7 +290,7 @@ describe('Universal', () => { async function updateHeroNameInDetailView(): Promise { // Assumes that the current view is the hero details view. - addToHeroName(nameSuffix); + await addToHeroName(nameSuffix); const page = getPageElts(); const hero = await Hero.fromDetail(page.heroDetail); diff --git a/aio/content/examples/upgrade-module/e2e-spec.ts b/aio/content/examples/upgrade-module/e2e-spec.ts index 4d1c31c74aaa2..c38ad9dcb628c 100644 --- a/aio/content/examples/upgrade-module/e2e-spec.ts +++ b/aio/content/examples/upgrade-module/e2e-spec.ts @@ -4,48 +4,40 @@ describe('Upgrade Tests', () => { describe('AngularJS Auto-bootstrap', () => { - beforeAll(() => { - browser.get('/index-ng-app.html'); - }); + beforeAll(() => browser.get('/index-ng-app.html')); - it('bootstraps as expected', () => { - expect(element(by.css('#message')).getText()).toEqual('Hello world'); + it('bootstraps as expected', async () => { + expect(await element(by.css('#message')).getText()).toEqual('Hello world'); }); }); describe('AngularJS JavaScript Bootstrap', () => { - beforeAll(() => { - browser.get('/index-bootstrap.html'); - }); + beforeAll(() => browser.get('/index-bootstrap.html')); - it('bootstraps as expected', () => { - expect(element(by.css('#message')).getText()).toEqual('Hello world'); + it('bootstraps as expected', async () => { + expect(await element(by.css('#message')).getText()).toEqual('Hello world'); }); }); describe('AngularJS-Angular Hybrid Bootstrap', () => { - beforeAll(() => { - browser.get('/index-ajs-a-hybrid-bootstrap.html'); - }); + beforeAll(() => browser.get('/index-ajs-a-hybrid-bootstrap.html')); - it('bootstraps as expected', () => { - expect(element(by.css('#message')).getText()).toEqual('Hello world'); + it('bootstraps as expected', async () => { + expect(await element(by.css('#message')).getText()).toEqual('Hello world'); }); }); - describe('Upgraded static component', () => { + describe('Upgraded static component', async () => { - beforeAll(() => { - browser.get('/index-upgrade-static.html'); - }); + beforeAll(() => browser.get('/index-upgrade-static.html')); - it('renders', () => { - expect(element(by.css('h2')).getText()).toEqual('Windstorm details!'); + it('renders', async () => { + expect(await element(by.css('h2')).getText()).toEqual('Windstorm details!'); }); }); @@ -53,17 +45,15 @@ describe('Upgrade Tests', () => { describe('Upgraded component with IO', () => { - beforeAll(() => { - browser.get('/index-upgrade-io.html'); - }); + beforeAll(() => browser.get('/index-upgrade-io.html')); - it('has inputs', () => { - expect(element(by.css('h2')).getText()).toEqual('Windstorm details!'); + it('has inputs', async () => { + expect(await element(by.css('h2')).getText()).toEqual('Windstorm details!'); }); - it('has outputs', () => { - element(by.buttonText('Delete')).click(); - expect(element(by.css('h2')).getText()).toEqual('Ex-Windstorm details!'); + it('has outputs', async () => { + await element(by.buttonText('Delete')).click(); + expect(await element(by.css('h2')).getText()).toEqual('Ex-Windstorm details!'); }); }); @@ -71,33 +61,29 @@ describe('Upgrade Tests', () => { describe('Downgraded static component', () => { - beforeAll(() => { - browser.get('/index-downgrade-static.html'); - }); + beforeAll(() => browser.get('/index-downgrade-static.html')); - it('renders', () => { - expect(element(by.css('h2')).getText()).toEqual('Windstorm details!'); + it('renders', async () => { + expect(await element(by.css('h2')).getText()).toEqual('Windstorm details!'); }); }); describe('Downgraded component with IO', () => { - beforeAll(() => { - browser.get('/index-downgrade-io.html'); - }); + beforeAll(() => browser.get('/index-downgrade-io.html')); - it('has inputs', () => { - expect(element.all(by.css('h2')).first().getText()).toEqual('Windstorm details!'); + it('has inputs', async () => { + expect(await element.all(by.css('h2')).first().getText()).toEqual('Windstorm details!'); }); - it('has outputs', () => { - element.all(by.buttonText('Delete')).first().click(); - expect(element.all(by.css('h2')).first().getText()).toEqual('Ex-Windstorm details!'); + it('has outputs', async () => { + await element.all(by.buttonText('Delete')).first().click(); + expect(await element.all(by.css('h2')).first().getText()).toEqual('Ex-Windstorm details!'); }); - it('supports ng-repeat', () => { - expect(element.all(by.css('hero-detail')).count()).toBe(3); + it('supports ng-repeat', async () => { + expect(await element.all(by.css('hero-detail')).count()).toBe(3); }); }); @@ -105,12 +91,10 @@ describe('Upgrade Tests', () => { describe('Downgraded component with content projection', () => { - beforeAll(() => { - browser.get('/index-ajs-to-a-projection.html'); - }); + beforeAll(() => browser.get('/index-ajs-to-a-projection.html')); - it('can be transcluded into', () => { - expect(element(by.css('hero-detail')).getText()).toContain('Specific powers of controlling winds'); + it('can be transcluded into', async () => { + expect(await element(by.css('hero-detail')).getText()).toContain('Specific powers of controlling winds'); }); }); @@ -118,12 +102,10 @@ describe('Upgrade Tests', () => { describe('Upgraded component with transclusion', () => { - beforeAll(() => { - browser.get('/index-a-to-ajs-transclusion.html'); - }); + beforeAll(() => browser.get('/index-a-to-ajs-transclusion.html')); - it('can be projected into', () => { - expect(element(by.css('hero-detail')).getText()).toContain('Specific powers of controlling winds'); + it('can be projected into', async () => { + expect(await element(by.css('hero-detail')).getText()).toContain('Specific powers of controlling winds'); }); }); @@ -131,12 +113,10 @@ describe('Upgrade Tests', () => { describe('Upgrading AngularJS Providers', () => { - beforeAll(() => { - browser.get('/index-ajs-to-a-providers.html'); - }); + beforeAll(() => browser.get('/index-ajs-to-a-providers.html')); - it('works', () => { - expect(element(by.css('h2')).getText()).toBe('1: Windstorm'); + it('works', async () => { + expect(await element(by.css('h2')).getText()).toBe('1: Windstorm'); }); }); @@ -144,12 +124,10 @@ describe('Upgrade Tests', () => { describe('Downgrading Angular Providers', () => { - beforeAll(() => { - browser.get('/index-a-to-ajs-providers.html'); - }); + beforeAll(() => browser.get('/index-a-to-ajs-providers.html')); - it('works', () => { - expect(element(by.css('h2')).getText()).toBe('1: Windstorm'); + it('works', async () => { + expect(await element(by.css('h2')).getText()).toBe('1: Windstorm'); }); }); diff --git a/aio/content/examples/upgrade-phonecat-1-typescript/e2e-spec.ts b/aio/content/examples/upgrade-phonecat-1-typescript/e2e-spec.ts index fe87205fcd641..1c5b51467ed7c 100644 --- a/aio/content/examples/upgrade-phonecat-1-typescript/e2e-spec.ts +++ b/aio/content/examples/upgrade-phonecat-1-typescript/e2e-spec.ts @@ -11,41 +11,39 @@ describe('PhoneCat Application', () => { browser.rootEl = 'body'; }); - it('should redirect `index.html` to `index.html#!/phones', () => { - browser.get('index.html'); - expect(browser.getLocationAbsUrl()).toBe('/phones'); + it('should redirect `index.html` to `index.html#!/phones', async () => { + await browser.get('index.html'); + expect(await browser.getLocationAbsUrl()).toBe('/phones'); }); describe('View: Phone list', () => { // Helpers - const waitForCount = (elems: ElementArrayFinder, count: number) => { + const waitForCount = async (elems: ElementArrayFinder, count: number) => { // Wait for the list to stabilize, which may take a while (e.g. due to animations). - browser.wait(() => elems.count().then(c => c === count), 5000); + await browser.wait(async () => await elems.count() === count, 5000); }; - beforeEach(() => { - browser.get('index.html#!/phones'); - }); + beforeEach(() => browser.get('index.html#!/phones')); - it('should filter the phone list as a user types into the search box', () => { + it('should filter the phone list as a user types into the search box', async () => { const phoneList = element.all(by.repeater('phone in $ctrl.phones')); const query = element(by.model('$ctrl.query')); - waitForCount(phoneList, 20); - expect(phoneList.count()).toBe(20); + await waitForCount(phoneList, 20); + expect(await phoneList.count()).toBe(20); - query.sendKeys('nexus'); - waitForCount(phoneList, 1); - expect(phoneList.count()).toBe(1); + await query.sendKeys('nexus'); + await waitForCount(phoneList, 1); + expect(await phoneList.count()).toBe(1); - query.clear(); - query.sendKeys('motorola'); - waitForCount(phoneList, 8); - expect(phoneList.count()).toBe(8); + await query.clear(); + await query.sendKeys('motorola'); + await waitForCount(phoneList, 8); + expect(await phoneList.count()).toBe(8); }); - it('should be possible to control phone order via the drop-down menu', () => { + it('should be possible to control phone order via the drop-down menu', async () => { const queryField = element(by.model('$ctrl.query')); const orderSelect = element(by.model('$ctrl.orderProp')); const nameOption = orderSelect.element(by.css('option[value="name"]')); @@ -55,63 +53,61 @@ describe('PhoneCat Application', () => { return phoneNameColumn.map((elem: ElementFinder) => elem.getText()); } - queryField.sendKeys('tablet'); // Let's narrow the dataset to make the assertions shorter - waitForCount(phoneNameColumn, 2); + await queryField.sendKeys('tablet'); // Let's narrow the dataset to make the assertions shorter + await waitForCount(phoneNameColumn, 2); - expect(getNames()).toEqual([ + expect(await getNames()).toEqual([ 'Motorola XOOM\u2122 with Wi-Fi', 'MOTOROLA XOOM\u2122' ]); - nameOption.click(); + await nameOption.click(); - expect(getNames()).toEqual([ + expect(await getNames()).toEqual([ 'MOTOROLA XOOM\u2122', 'Motorola XOOM\u2122 with Wi-Fi' ]); }); - it('should render phone specific links', () => { + it('should render phone specific links', async () => { const phoneList = element.all(by.repeater('phone in $ctrl.phones')); const query = element(by.model('$ctrl.query')); - query.sendKeys('nexus'); - waitForCount(phoneList, 1); + await query.sendKeys('nexus'); + await waitForCount(phoneList, 1); const nexusPhone = phoneList.first(); const detailLink = nexusPhone.all(by.css('a')).first(); - detailLink.click(); - expect(browser.getLocationAbsUrl()).toBe('/phones/nexus-s'); + await detailLink.click(); + expect(await browser.getLocationAbsUrl()).toBe('/phones/nexus-s'); }); }); describe('View: Phone detail', () => { - beforeEach(() => { - browser.get('index.html#!/phones/nexus-s'); - }); + beforeEach(() => browser.get('index.html#!/phones/nexus-s')); - it('should display the `nexus-s` page', () => { - expect(element(by.binding('$ctrl.phone.name')).getText()).toBe('Nexus S'); + it('should display the `nexus-s` page', async () => { + expect(await element(by.binding('$ctrl.phone.name')).getText()).toBe('Nexus S'); }); - it('should display the first phone image as the main phone image', () => { + it('should display the first phone image as the main phone image', async () => { const mainImage = element(by.css('img.phone.selected')); - expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/); + expect(await mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/); }); - it('should swap the main image when clicking on a thumbnail image', () => { + it('should swap the main image when clicking on a thumbnail image', async () => { const mainImage = element(by.css('img.phone.selected')); const thumbnails = element.all(by.css('.phone-thumbs img')); - thumbnails.get(2).click(); - expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/); + await thumbnails.get(2).click(); + expect(await mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/); - thumbnails.get(0).click(); - expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/); + await thumbnails.get(0).click(); + expect(await mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/); }); }); diff --git a/aio/content/examples/upgrade-phonecat-2-hybrid/e2e-spec.ts b/aio/content/examples/upgrade-phonecat-2-hybrid/e2e-spec.ts index 6c09547b395ab..424f91ca4a1a3 100644 --- a/aio/content/examples/upgrade-phonecat-2-hybrid/e2e-spec.ts +++ b/aio/content/examples/upgrade-phonecat-2-hybrid/e2e-spec.ts @@ -5,33 +5,31 @@ import { browser, element, by } from 'protractor'; describe('PhoneCat Application', () => { - it('should redirect `index.html` to `index.html#!/phones', () => { - browser.get('index.html'); - browser.sleep(1000); // Not sure why this is needed but it is. The route change works fine. - expect(browser.getCurrentUrl()).toMatch(/\/phones$/); + it('should redirect `index.html` to `index.html#!/phones', async () => { + await browser.get('index.html'); + await browser.sleep(1000); // Not sure why this is needed but it is. The route change works fine. + expect(await browser.getCurrentUrl()).toMatch(/\/phones$/); }); describe('View: Phone list', () => { - beforeEach(() => { - browser.get('index.html#!/phones'); - }); + beforeEach(() => browser.get('index.html#!/phones')); - it('should filter the phone list as a user types into the search box', () => { + it('should filter the phone list as a user types into the search box', async () => { const phoneList = element.all(by.css('.phones li')); const query = element(by.css('input')); - expect(phoneList.count()).toBe(20); + expect(await phoneList.count()).toBe(20); - query.sendKeys('nexus'); - expect(phoneList.count()).toBe(1); + await query.sendKeys('nexus'); + expect(await phoneList.count()).toBe(1); - query.clear(); - query.sendKeys('motorola'); - expect(phoneList.count()).toBe(8); + await query.clear(); + await query.sendKeys('motorola'); + expect(await phoneList.count()).toBe(8); }); - it('should be possible to control phone order via the drop-down menu', () => { + it('should be possible to control phone order via the drop-down menu', async () => { const queryField = element(by.css('input')); const orderSelect = element(by.css('select')); const nameOption = orderSelect.element(by.css('option[value="name"]')); @@ -41,57 +39,55 @@ describe('PhoneCat Application', () => { return phoneNameColumn.map((elem) => elem.getText()); } - queryField.sendKeys('tablet'); // Let's narrow the dataset to make the assertions shorter + await queryField.sendKeys('tablet'); // Let's narrow the dataset to make the assertions shorter - expect(getNames()).toEqual([ + expect(await getNames()).toEqual([ 'Motorola XOOM\u2122 with Wi-Fi', 'MOTOROLA XOOM\u2122' ]); - nameOption.click(); + await nameOption.click(); - expect(getNames()).toEqual([ + expect(await getNames()).toEqual([ 'MOTOROLA XOOM\u2122', 'Motorola XOOM\u2122 with Wi-Fi' ]); }); - it('should render phone specific links', () => { + it('should render phone specific links', async () => { const query = element(by.css('input')); - query.sendKeys('nexus'); + await query.sendKeys('nexus'); - element.all(by.css('.phones li a')).first().click(); - browser.sleep(1000); // Not sure why this is needed but it is. The route change works fine. - expect(browser.getCurrentUrl()).toMatch(/\/phones\/nexus-s$/); + await element.all(by.css('.phones li a')).first().click(); + await browser.sleep(1000); // Not sure why this is needed but it is. The route change works fine. + expect(await browser.getCurrentUrl()).toMatch(/\/phones\/nexus-s$/); }); }); describe('View: Phone detail', () => { - beforeEach(() => { - browser.get('index.html#!/phones/nexus-s'); - }); + beforeEach(() => browser.get('index.html#!/phones/nexus-s')); - it('should display the `nexus-s` page', () => { - expect(element(by.css('h1')).getText()).toBe('Nexus S'); + it('should display the `nexus-s` page', async () => { + expect(await element(by.css('h1')).getText()).toBe('Nexus S'); }); - it('should display the first phone image as the main phone image', () => { + it('should display the first phone image as the main phone image', async () => { const mainImage = element(by.css('img.phone.selected')); - expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/); + expect(await mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/); }); - it('should swap the main image when clicking on a thumbnail image', () => { + it('should swap the main image when clicking on a thumbnail image', async () => { const mainImage = element(by.css('img.phone.selected')); const thumbnails = element.all(by.css('.phone-thumbs img')); - thumbnails.get(2).click(); - expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/); + await thumbnails.get(2).click(); + expect(await mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/); - thumbnails.get(0).click(); - expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/); + await thumbnails.get(0).click(); + expect(await mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/); }); }); diff --git a/aio/content/examples/upgrade-phonecat-3-final/e2e-spec.ts b/aio/content/examples/upgrade-phonecat-3-final/e2e-spec.ts index 882e38a55b04d..a9ba63978f9c1 100644 --- a/aio/content/examples/upgrade-phonecat-3-final/e2e-spec.ts +++ b/aio/content/examples/upgrade-phonecat-3-final/e2e-spec.ts @@ -6,36 +6,33 @@ import { browser, element, by } from 'protractor'; describe('PhoneCat Application', () => { // #docregion redirect - it('should redirect `index.html` to `index.html#!/phones', () => { - browser.get('index.html'); - browser.waitForAngular(); - browser.getCurrentUrl().then((url: string) => { - expect(url.endsWith('/phones')).toBe(true); - }); + it('should redirect `index.html` to `index.html#!/phones', async () => { + await browser.get('index.html'); + await browser.waitForAngular(); + const url = await browser.getCurrentUrl(); + expect(url.endsWith('/phones')).toBe(true); }); // #enddocregion redirect describe('View: Phone list', () => { - beforeEach(() => { - browser.get('index.html#!/phones'); - }); + beforeEach(() => browser.get('index.html#!/phones')); - it('should filter the phone list as a user types into the search box', () => { + it('should filter the phone list as a user types into the search box', async () => { const phoneList = element.all(by.css('.phones li')); const query = element(by.css('input')); - expect(phoneList.count()).toBe(20); + expect(await phoneList.count()).toBe(20); - query.sendKeys('nexus'); - expect(phoneList.count()).toBe(1); + await query.sendKeys('nexus'); + expect(await phoneList.count()).toBe(1); - query.clear(); - query.sendKeys('motorola'); - expect(phoneList.count()).toBe(8); + await query.clear(); + await query.sendKeys('motorola'); + expect(await phoneList.count()).toBe(8); }); - it('should be possible to control phone order via the drop-down menu', () => { + it('should be possible to control phone order via the drop-down menu', async () => { const queryField = element(by.css('input')); const orderSelect = element(by.css('select')); const nameOption = orderSelect.element(by.css('option[value="name"]')); @@ -45,29 +42,28 @@ describe('PhoneCat Application', () => { return phoneNameColumn.map((elem) => elem.getText()); } - queryField.sendKeys('tablet'); // Let's narrow the dataset to make the assertions shorter + await queryField.sendKeys('tablet'); // Let's narrow the dataset to make the assertions shorter - expect(getNames()).toEqual([ + expect(await getNames()).toEqual([ 'Motorola XOOM\u2122 with Wi-Fi', 'MOTOROLA XOOM\u2122' ]); - nameOption.click(); + await nameOption.click(); - expect(getNames()).toEqual([ + expect(await getNames()).toEqual([ 'MOTOROLA XOOM\u2122', 'Motorola XOOM\u2122 with Wi-Fi' ]); }); // #docregion links - it('should render phone specific links', () => { + it('should render phone specific links', async () => { const query = element(by.css('input')); - query.sendKeys('nexus'); - element.all(by.css('.phones li a')).first().click(); - browser.getCurrentUrl().then((url: string) => { - expect(url.endsWith('/phones/nexus-s')).toBe(true); - }); + await query.sendKeys('nexus'); + await element.all(by.css('.phones li a')).first().click(); + const url = await browser.getCurrentUrl(); + expect(url.endsWith('/phones/nexus-s')).toBe(true); }); // #enddocregion links @@ -75,29 +71,27 @@ describe('PhoneCat Application', () => { describe('View: Phone detail', () => { - beforeEach(() => { - browser.get('index.html#!/phones/nexus-s'); - }); + beforeEach(() => browser.get('index.html#!/phones/nexus-s')); - it('should display the `nexus-s` page', () => { - expect(element(by.css('h1')).getText()).toBe('Nexus S'); + it('should display the `nexus-s` page', async () => { + expect(await element(by.css('h1')).getText()).toBe('Nexus S'); }); - it('should display the first phone image as the main phone image', () => { + it('should display the first phone image as the main phone image', async () => { const mainImage = element(by.css('img.phone.selected')); - expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/); + expect(await mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/); }); - it('should swap the main image when clicking on a thumbnail image', () => { + it('should swap the main image when clicking on a thumbnail image', async () => { const mainImage = element(by.css('img.phone.selected')); const thumbnails = element.all(by.css('.phone-thumbs img')); - thumbnails.get(2).click(); - expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/); + await thumbnails.get(2).click(); + expect(await mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.2.jpg/); - thumbnails.get(0).click(); - expect(mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/); + await thumbnails.get(0).click(); + expect(await mainImage.getAttribute('src')).toMatch(/img\/phones\/nexus-s.0.jpg/); }); }); diff --git a/aio/content/examples/user-input/e2e/src/app.e2e-spec.ts b/aio/content/examples/user-input/e2e/src/app.e2e-spec.ts index 02948e6bb5983..53f4e20c29342 100644 --- a/aio/content/examples/user-input/e2e/src/app.e2e-spec.ts +++ b/aio/content/examples/user-input/e2e/src/app.e2e-spec.ts @@ -2,96 +2,88 @@ import { browser, element, by, protractor } from 'protractor'; describe('User Input Tests', () => { - beforeAll(() => { - browser.get(''); - }); + beforeAll(() => browser.get('')); - it('should support the click event', () => { + it('should support the click event', async () => { const mainEle = element(by.css('app-click-me')); const buttonEle = element(by.css('app-click-me button')); - expect(mainEle.getText()).not.toContain('You are my hero!'); - buttonEle.click().then(() => { - expect(mainEle.getText()).toContain('You are my hero!'); - }); + expect(await mainEle.getText()).not.toContain('You are my hero!'); + await buttonEle.click(); + expect(await mainEle.getText()).toContain('You are my hero!'); }); - it('should support the click event with an event payload', () => { + it('should support the click event with an event payload', async () => { const mainEle = element(by.css('app-click-me2')); const buttonEle = element(by.css('app-click-me2 button')); - expect(mainEle.getText()).not.toContain('Event target is '); - buttonEle.click().then(() => { - expect(mainEle.getText()).toContain('Event target is BUTTON'); - }); + expect(await mainEle.getText()).not.toContain('Event target is '); + await buttonEle.click(); + expect(await mainEle.getText()).toContain('Event target is BUTTON'); }); - it('should support the keyup event ', () => { + it('should support the keyup event ', async () => { const mainEle = element(by.css('app-key-up1')); const inputEle = mainEle.element(by.css('input')); const outputTextEle = mainEle.element(by.css('p')); - expect(outputTextEle.getText()).toEqual(''); - inputEle.sendKeys('abc'); - expect(outputTextEle.getText()).toEqual('a | ab | abc |'); + expect(await outputTextEle.getText()).toEqual(''); + await inputEle.sendKeys('abc'); + expect(await outputTextEle.getText()).toEqual('a | ab | abc |'); }); - it('should support user input from a local template let (loopback)', () => { + it('should support user input from a local template let (loopback)', async () => { const mainEle = element(by.css('app-loop-back')); const inputEle = mainEle.element(by.css('input')); const outputTextEle = mainEle.element(by.css('p')); - expect(outputTextEle.getText()).toEqual(''); - inputEle.sendKeys('abc'); - expect(outputTextEle.getText()).toEqual('abc'); + expect(await outputTextEle.getText()).toEqual(''); + await inputEle.sendKeys('abc'); + expect(await outputTextEle.getText()).toEqual('abc'); }); - it('should be able to combine click event with a local template var', () => { + it('should be able to combine click event with a local template var', async () => { const mainEle = element(by.css('app-key-up2')); const inputEle = mainEle.element(by.css('input')); const outputTextEle = mainEle.element(by.css('p')); - expect(outputTextEle.getText()).toEqual(''); - inputEle.sendKeys('abc'); - expect(outputTextEle.getText()).toEqual('a | ab | abc |'); + expect(await outputTextEle.getText()).toEqual(''); + await inputEle.sendKeys('abc'); + expect(await outputTextEle.getText()).toEqual('a | ab | abc |'); }); - it('should be able to filter key events', () => { + it('should be able to filter key events', async () => { const mainEle = element(by.css('app-key-up3')); const inputEle = mainEle.element(by.css('input')); const outputTextEle = mainEle.element(by.css('p')); - expect(outputTextEle.getText()).toEqual(''); - inputEle.sendKeys('abc'); - expect(outputTextEle.getText()).toEqual('', 'should be blank - have not sent enter yet'); + expect(await outputTextEle.getText()).toEqual(''); + await inputEle.sendKeys('abc'); + expect(await outputTextEle.getText()).toEqual('', 'should be blank - have not sent enter yet'); // broken atm, see https://github.com/angular/angular/issues/9419 - inputEle.sendKeys(protractor.Key.ENTER); - expect(outputTextEle.getText()).toEqual('abc'); + await inputEle.sendKeys(protractor.Key.ENTER); + expect(await outputTextEle.getText()).toEqual('abc'); }); - it('should be able to filter blur events', () => { + it('should be able to filter blur events', async () => { const prevInputEle = element(by.css('app-key-up3 input')); const mainEle = element(by.css('app-key-up4')); const inputEle = mainEle.element(by.css('input')); const outputTextEle = mainEle.element(by.css('p')); - expect(outputTextEle.getText()).toEqual(''); - inputEle.sendKeys('abc'); - expect(outputTextEle.getText()).toEqual('', 'should be blank - have not sent enter yet'); + expect(await outputTextEle.getText()).toEqual(''); + await inputEle.sendKeys('abc'); + expect(await outputTextEle.getText()).toEqual('', 'should be blank - have not sent enter yet'); // change the focus - prevInputEle.click().then(() => { - expect(outputTextEle.getText()).toEqual('abc'); - }); + await prevInputEle.click(); + expect(await outputTextEle.getText()).toEqual('abc'); }); - it('should be able to compose little tour of heroes', () => { + it('should be able to compose little tour of heroes', async () => { const mainEle = element(by.css('app-little-tour')); const inputEle = mainEle.element(by.css('input')); const addButtonEle = mainEle.element(by.css('button')); const heroEles = mainEle.all(by.css('li')); - let numHeroes: number; - expect(heroEles.count()).toBeGreaterThan(0); - heroEles.count().then((count: number) => { - numHeroes = count; - inputEle.sendKeys('abc'); - return addButtonEle.click(); - }).then(() => { - expect(heroEles.count()).toEqual(numHeroes + 1, 'should be one more hero added'); - expect(heroEles.get(numHeroes).getText()).toContain('abc'); - }); + const numHeroes = await heroEles.count(); + expect(numHeroes).toBeGreaterThan(0); + + await inputEle.sendKeys('abc'); + await addButtonEle.click(); + expect(await heroEles.count()).toEqual(numHeroes + 1, 'should be one more hero added'); + expect(await heroEles.get(numHeroes).getText()).toContain('abc'); }); }); diff --git a/aio/tools/examples/shared/boilerplate/cli-ajs/package.json b/aio/tools/examples/shared/boilerplate/cli-ajs/package.json index 5d65eb8f72849..7976895e6f176 100644 --- a/aio/tools/examples/shared/boilerplate/cli-ajs/package.json +++ b/aio/tools/examples/shared/boilerplate/cli-ajs/package.json @@ -35,7 +35,6 @@ "@types/angular": "1.7.3", "@types/angular-route": "1.7.1", "@types/jasmine": "~3.6.0", - "@types/jasminewd2": "~2.0.3", "@types/node": "^12.11.1", "codelyzer": "^6.0.0", "jasmine-core": "~3.6.0", diff --git a/aio/tools/examples/shared/boilerplate/cli/e2e/protractor.conf.js b/aio/tools/examples/shared/boilerplate/cli/e2e/protractor.conf.js index 09a96840f2319..22bd9d953c77f 100644 --- a/aio/tools/examples/shared/boilerplate/cli/e2e/protractor.conf.js +++ b/aio/tools/examples/shared/boilerplate/cli/e2e/protractor.conf.js @@ -16,6 +16,7 @@ exports.config = { browserName: 'chrome' }, directConnect: true, + SELENIUM_PROMISE_MANAGER: false, baseUrl: 'http://localhost:4200/', framework: 'jasmine', jasmineNodeOpts: { diff --git a/aio/tools/examples/shared/boilerplate/cli/e2e/tsconfig.json b/aio/tools/examples/shared/boilerplate/cli/e2e/tsconfig.json index 426058ef0fbe7..0782539c045b9 100644 --- a/aio/tools/examples/shared/boilerplate/cli/e2e/tsconfig.json +++ b/aio/tools/examples/shared/boilerplate/cli/e2e/tsconfig.json @@ -7,7 +7,6 @@ "target": "es2018", "types": [ "jasmine", - "jasminewd2", "node" ] } diff --git a/aio/tools/examples/shared/boilerplate/cli/package.json b/aio/tools/examples/shared/boilerplate/cli/package.json index 73e3930b7c515..650e25fa4596c 100644 --- a/aio/tools/examples/shared/boilerplate/cli/package.json +++ b/aio/tools/examples/shared/boilerplate/cli/package.json @@ -31,7 +31,6 @@ "@angular/cli": "~11.0.2", "@angular/compiler-cli": "~11.0.1", "@types/jasmine": "~3.6.0", - "@types/jasminewd2": "~2.0.3", "@types/node": "^12.11.1", "codelyzer": "^6.0.0", "jasmine-core": "~3.6.0", diff --git a/aio/tools/examples/shared/boilerplate/elements/package.json b/aio/tools/examples/shared/boilerplate/elements/package.json index 0e0ab1465d6cb..9d1f1edd39217 100644 --- a/aio/tools/examples/shared/boilerplate/elements/package.json +++ b/aio/tools/examples/shared/boilerplate/elements/package.json @@ -33,7 +33,6 @@ "@angular/cli": "~11.0.2", "@angular/compiler-cli": "~11.0.1", "@types/jasmine": "~3.6.0", - "@types/jasminewd2": "~2.0.3", "@types/node": "^12.11.1", "codelyzer": "^6.0.0", "jasmine-core": "~3.6.0", diff --git a/aio/tools/examples/shared/boilerplate/i18n/package.json b/aio/tools/examples/shared/boilerplate/i18n/package.json index 251e926eb5346..00d0b723f82b5 100644 --- a/aio/tools/examples/shared/boilerplate/i18n/package.json +++ b/aio/tools/examples/shared/boilerplate/i18n/package.json @@ -35,7 +35,6 @@ "@angular/cli": "~11.0.2", "@angular/compiler-cli": "~11.0.1", "@types/jasmine": "~3.6.0", - "@types/jasminewd2": "~2.0.3", "@types/node": "^12.11.1", "codelyzer": "^6.0.0", "jasmine-core": "~3.6.0", diff --git a/aio/tools/examples/shared/boilerplate/service-worker/package.json b/aio/tools/examples/shared/boilerplate/service-worker/package.json index 883a9a4c42f8b..a2857856f93d2 100644 --- a/aio/tools/examples/shared/boilerplate/service-worker/package.json +++ b/aio/tools/examples/shared/boilerplate/service-worker/package.json @@ -32,7 +32,6 @@ "@angular/cli": "~11.0.2", "@angular/compiler-cli": "~11.0.1", "@types/jasmine": "~3.6.0", - "@types/jasminewd2": "~2.0.3", "@types/node": "^12.11.1", "codelyzer": "^6.0.0", "jasmine-core": "~3.6.0", diff --git a/aio/tools/examples/shared/boilerplate/systemjs/package.json b/aio/tools/examples/shared/boilerplate/systemjs/package.json index 82463380995df..74268723ea7f5 100644 --- a/aio/tools/examples/shared/boilerplate/systemjs/package.json +++ b/aio/tools/examples/shared/boilerplate/systemjs/package.json @@ -49,7 +49,6 @@ "@types/angular-resource": "1.5.16", "@types/angular-route": "1.7.1", "@types/jasmine": "~3.6.0", - "@types/jasminewd2": "~2.0.3", "@types/node": "^12.11.1", "concurrently": "^5.0.1", "http-server": "^0.12.0", diff --git a/aio/tools/examples/shared/boilerplate/universal/package.json b/aio/tools/examples/shared/boilerplate/universal/package.json index 1b328133d8dc2..95d746fcaa906 100644 --- a/aio/tools/examples/shared/boilerplate/universal/package.json +++ b/aio/tools/examples/shared/boilerplate/universal/package.json @@ -40,7 +40,6 @@ "@nguniversal/builders": "^11.0.0", "@types/express": "^4.17.8", "@types/jasmine": "~3.6.0", - "@types/jasminewd2": "~2.0.3", "@types/node": "^12.11.1", "codelyzer": "^6.0.0", "jasmine-core": "~3.6.0", diff --git a/aio/tools/examples/shared/package.json b/aio/tools/examples/shared/package.json index 31640e4dc3a42..e65d24a53cdec 100644 --- a/aio/tools/examples/shared/package.json +++ b/aio/tools/examples/shared/package.json @@ -58,7 +58,6 @@ "@types/angular-route": "1.7.1", "@types/express": "^4.17.8", "@types/jasmine": "~3.6.0", - "@types/jasminewd2": "~2.0.3", "@types/jquery": "3.5.1", "@types/node": "^12.11.1", "canonical-path": "1.0.0", diff --git a/aio/tools/examples/shared/yarn.lock b/aio/tools/examples/shared/yarn.lock index 985a164aec379..49aa795efd9a6 100644 --- a/aio/tools/examples/shared/yarn.lock +++ b/aio/tools/examples/shared/yarn.lock @@ -1696,22 +1696,11 @@ dependencies: "@types/node" "*" -"@types/jasmine@*": - version "2.6.2" - resolved "https://registry.yarnpkg.com/@types/jasmine/-/jasmine-2.6.2.tgz#6e6d4cb183cd55c7a1ad6270bced10fdd5367a3c" - "@types/jasmine@~3.6.0": version "3.6.2" resolved "https://registry.yarnpkg.com/@types/jasmine/-/jasmine-3.6.2.tgz#02f64450016f7de70f145d698be311136d7c6374" integrity sha512-AzfesNFLvOs6Q1mHzIsVJXSeUnqVh4ZHG8ngygKJfbkcSLwzrBVm/LKa+mR8KrOfnWtUL47112gde1MC0IXqpQ== -"@types/jasminewd2@~2.0.3": - version "2.0.8" - resolved "https://registry.yarnpkg.com/@types/jasminewd2/-/jasminewd2-2.0.8.tgz#67afe5098d5ef2386073a7b7384b69a840dfe93b" - integrity sha512-d9p31r7Nxk0ZH0U39PTH0hiDlJ+qNVGjlt1ucOoTUptxb2v+Y5VMnsxfwN+i3hK4yQnqBi3FMmoMFcd1JHDxdg== - dependencies: - "@types/jasmine" "*" - "@types/jquery@3.5.1": version "3.5.1" resolved "https://registry.yarnpkg.com/@types/jquery/-/jquery-3.5.1.tgz#cebb057acf5071c40e439f30e840c57a30d406c3"