Skip to content
This repository was archived by the owner on Dec 4, 2017. It is now read-only.

Commit 557200b

Browse files
chalinfilipesilva
authored andcommitted
e2e(router): fix test for canceling of crisis detail change (#3379)
- Await for alert dialog and use it in test for canceling crisis detail change. - Tests now use async/await. It makes them easier to read. - Remove "money patch" alerter comment.
1 parent c2bb6ad commit 557200b

File tree

2 files changed

+110
-119
lines changed

2 files changed

+110
-119
lines changed
Lines changed: 107 additions & 111 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,34 @@
11
'use strict'; // necessary for es6 output in node
22

3-
import { browser, element, by, ElementFinder } from 'protractor';
3+
import { browser, element, by, ExpectedConditions } from 'protractor';
44

5-
describe('Router', function () {
5+
const numDashboardTabs = 5;
6+
const numCrises = 4;
7+
const numHeroes = 6;
8+
const EC = ExpectedConditions;
69

7-
beforeAll(function () {
8-
browser.get('');
9-
});
10+
describe('Router', () => {
11+
12+
beforeAll(() => browser.get(''));
1013

1114
function getPageStruct() {
12-
let hrefEles = element.all(by.css('my-app a'));
15+
const hrefEles = element.all(by.css('my-app a'));
16+
const crisisDetail = element.all(by.css('my-app > ng-component > ng-component > ng-component > div')).first();
17+
const heroDetail = element(by.css('my-app > ng-component > div'));
1318

1419
return {
1520
hrefs: hrefEles,
16-
routerParent: element(by.css('my-app > ng-component')),
17-
routerTitle: element(by.css('my-app > ng-component > h2')),
21+
activeHref: element(by.css('my-app a.active')),
1822

1923
crisisHref: hrefEles.get(0),
2024
crisisList: element.all(by.css('my-app > ng-component > ng-component li')),
21-
crisisDetail: element(by.css('my-app > ng-component > ng-component > ng-component > div')),
22-
crisisDetailTitle: element(by.css('my-app > ng-component > ng-component > ng-component > div > h3')),
25+
crisisDetail: crisisDetail,
26+
crisisDetailTitle: crisisDetail.element(by.xpath('*[1]')),
2327

2428
heroesHref: hrefEles.get(1),
2529
heroesList: element.all(by.css('my-app > ng-component li')),
26-
heroDetail: element(by.css('my-app > ng-component > div')),
27-
heroDetailTitle: element(by.css('my-app > ng-component > div > h3')),
30+
heroDetail: heroDetail,
31+
heroDetailTitle: heroDetail.element(by.xpath('*[1]')),
2832

2933
adminHref: hrefEles.get(2),
3034
adminPreloadList: element.all(by.css('my-app > ng-component > ng-component > ul > li')),
@@ -39,128 +43,120 @@ describe('Router', function () {
3943
};
4044
}
4145

42-
it('should be able to see the start screen', function () {
43-
let page = getPageStruct();
44-
expect(page.hrefs.count()).toEqual(5, 'should be 5 dashboard choices');
46+
it('has expected dashboard tabs', () => {
47+
const page = getPageStruct();
48+
expect(page.hrefs.count()).toEqual(numDashboardTabs, 'dashboard tab count');
4549
expect(page.crisisHref.getText()).toEqual('Crisis Center');
4650
expect(page.heroesHref.getText()).toEqual('Heroes');
4751
expect(page.adminHref.getText()).toEqual('Admin');
4852
expect(page.loginHref.getText()).toEqual('Login');
4953
expect(page.contactHref.getText()).toEqual('Contact');
5054
});
5155

52-
it('should be able to see crises center items', function () {
53-
let page = getPageStruct();
54-
page.crisisHref.click().then(function() {
55-
expect(page.crisisList.count()).toBe(4, 'should be 4 crisis center entries at start');
56-
});
56+
it('has heroes selected as opening tab', () => {
57+
const page = getPageStruct();
58+
expect(page.activeHref.getText()).toEqual('Heroes');
59+
});
60+
61+
it('has crises center items', async () => {
62+
const page = getPageStruct();
63+
await page.crisisHref.click();
64+
expect(page.activeHref.getText()).toEqual('Crisis Center');
65+
expect(page.crisisList.count()).toBe(numCrises, 'crisis list count');
5766
});
5867

59-
it('should be able to see hero items', function () {
60-
let page = getPageStruct();
61-
page.heroesHref.click().then(function() {
62-
expect(page.routerTitle.getText()).toContain('HEROES');
63-
expect(page.heroesList.count()).toBe(6, 'should be 6 heroes');
64-
});
68+
it('has hero items', async () => {
69+
const page = getPageStruct();
70+
await page.heroesHref.click();
71+
expect(page.activeHref.getText()).toEqual('Heroes');
72+
expect(page.heroesList.count()).toBe(numHeroes, 'hero list count');
6573
});
6674

67-
it('should be able to toggle the views', function () {
68-
let page = getPageStruct();
69-
page.crisisHref.click().then(function() {
70-
expect(page.crisisList.count()).toBe(4, 'should be 4 crisis center entries');
71-
return page.heroesHref.click();
72-
}).then(function() {
73-
expect(page.heroesList.count()).toBe(6, 'should be 6 heroes');
74-
});
75+
it('toggles views', async () => {
76+
const page = getPageStruct();
77+
await page.crisisHref.click();
78+
expect(page.activeHref.getText()).toEqual('Crisis Center');
79+
expect(page.crisisList.count()).toBe(numCrises, 'crisis list count');
80+
await page.heroesHref.click();
81+
expect(page.activeHref.getText()).toEqual('Heroes');
82+
expect(page.heroesList.count()).toBe(numHeroes, 'hero list count');
7583
});
7684

77-
it('should be able to edit and save details from the crisis center view', function () {
78-
let page = getPageStruct();
79-
page.crisisHref.click().then(function() {
80-
crisisCenterEdit(2, true);
81-
});
85+
it('saves changed crisis details', async () => {
86+
const page = getPageStruct();
87+
await page.crisisHref.click();
88+
await crisisCenterEdit(2, true);
8289
});
8390

84-
xit('should be able to edit and cancel details from the crisis center view', function () {
85-
let page = getPageStruct();
86-
page.crisisHref.click().then(function() {
87-
crisisCenterEdit(3, false);
88-
});
91+
it('can cancel changed crisis details', async () => {
92+
const page = getPageStruct();
93+
await page.crisisHref.click();
94+
await crisisCenterEdit(3, false);
8995
});
9096

91-
it('should be able to edit and save details from the heroes view', function () {
92-
let page = getPageStruct();
93-
let heroEle: ElementFinder;
94-
let heroText: string;
95-
page.heroesHref.click().then(function() {
96-
heroEle = page.heroesList.get(4);
97-
return heroEle.getText();
98-
}).then(function(text: string) {
99-
expect(text.length).toBeGreaterThan(0, 'should have some text');
100-
// remove leading id from text
101-
heroText = text.substr(text.indexOf(' ')).trim();
102-
return heroEle.click();
103-
}).then(function() {
104-
expect(page.heroesList.count()).toBe(0, 'should no longer see crisis center entries');
105-
expect(page.heroDetail.isPresent()).toBe(true, 'should be able to see crisis detail');
106-
expect(page.heroDetailTitle.getText()).toContain(heroText);
107-
let inputEle = page.heroDetail.element(by.css('input'));
108-
inputEle.sendKeys('-foo');
109-
expect(page.heroDetailTitle.getText()).toContain(heroText + '-foo');
110-
let buttonEle = page.heroDetail.element(by.css('button'));
111-
return buttonEle.click();
112-
}).then(function() {
113-
expect(heroEle.getText()).toContain(heroText + '-foo');
114-
});
97+
it('saves changed hero details', async () => {
98+
const page = getPageStruct();
99+
await page.heroesHref.click();
100+
const heroEle = page.heroesList.get(4);
101+
let text = await heroEle.getText();
102+
expect(text.length).toBeGreaterThan(0, 'hero item text length');
103+
// remove leading id from text
104+
const heroText = text.substr(text.indexOf(' ')).trim();
105+
106+
await heroEle.click();
107+
expect(page.heroesList.count()).toBe(0, 'hero list count');
108+
expect(page.heroDetail.isPresent()).toBe(true, 'hero detail');
109+
expect(page.heroDetailTitle.getText()).toContain(heroText);
110+
let inputEle = page.heroDetail.element(by.css('input'));
111+
await inputEle.sendKeys('-foo');
112+
expect(page.heroDetailTitle.getText()).toContain(heroText + '-foo');
113+
114+
let buttonEle = page.heroDetail.element(by.css('button'));
115+
await buttonEle.click();
116+
expect(heroEle.getText()).toContain(heroText + '-foo');
115117
});
116118

117-
it('should be able to see the preloaded modules', function () {
118-
let page = getPageStruct();
119-
page.loginHref.click().then(function() {
120-
return page.loginButton.click();
121-
}).then(function() {
122-
expect(page.adminPreloadList.count()).toBe(1, 'should be 1 preloaded module');
123-
expect(page.adminPreloadList.first().getText()).toBe('crisis-center', 'first preload should be crisis center');
124-
});
119+
it('sees preloaded modules', async () => {
120+
const page = getPageStruct();
121+
await page.loginHref.click();
122+
await page.loginButton.click();
123+
const list = page.adminPreloadList;
124+
expect(list.count()).toBe(1, 'preloaded module');
125+
expect(await list.first().getText()).toBe('crisis-center', 'first preloaded module');
125126
});
126127

127-
it('should be able to see the secondary route', function () {
128-
let page = getPageStruct();
129-
page.heroesHref.click().then(function() {
130-
return page.contactHref.click();
131-
}).then(function() {
132-
expect(page.outletComponents.count()).toBe(2, 'should be 2 displayed routes');
133-
});
128+
it('sees the secondary route', async () => {
129+
const page = getPageStruct();
130+
await page.heroesHref.click();
131+
await page.contactHref.click();
132+
expect(page.outletComponents.count()).toBe(2, 'route count');
134133
});
135134

136-
function crisisCenterEdit(index: number, shouldSave: boolean) {
137-
let page = getPageStruct();
138-
let crisisEle: ElementFinder;
139-
let crisisText: string;
140-
page.crisisHref.click()
141-
.then(function () {
142-
crisisEle = page.crisisList.get(index);
143-
return crisisEle.getText();
144-
}).then(function(text: string) {
145-
expect(text.length).toBeGreaterThan(0, 'should have some text');
146-
// remove leading id from text
147-
crisisText = text.substr(text.indexOf(' ')).trim();
148-
return crisisEle.click();
149-
}).then(function () {
150-
expect(page.crisisDetail.isPresent()).toBe(true, 'should be able to see crisis detail');
151-
expect(page.crisisDetailTitle.getText()).toContain(crisisText);
152-
let inputEle = page.crisisDetail.element(by.css('input'));
153-
inputEle.sendKeys('-foo');
154-
expect(page.crisisDetailTitle.getText()).toContain(crisisText + '-foo');
155-
let buttonEle = page.crisisDetail.element(by.cssContainingText('button', shouldSave ? 'Save' : 'Cancel'));
156-
return buttonEle.click();
157-
}).then(function () {
158-
if (shouldSave) {
159-
expect(crisisEle.getText()).toContain(crisisText + '-foo');
160-
} else {
161-
expect(crisisEle.getText()).not.toContain(crisisText + '-foo');
162-
}
163-
});
135+
async function crisisCenterEdit(index: number, save: boolean) {
136+
const page = getPageStruct();
137+
await page.crisisHref.click();
138+
let crisisEle = page.crisisList.get(index);
139+
let text = await crisisEle.getText();
140+
expect(text.length).toBeGreaterThan(0, 'crisis item text length');
141+
// remove leading id from text
142+
const crisisText = text.substr(text.indexOf(' ')).trim();
143+
144+
await crisisEle.click();
145+
expect(page.crisisDetail.isPresent()).toBe(true, 'crisis detail present');
146+
expect(page.crisisDetailTitle.getText()).toContain(crisisText);
147+
let inputEle = page.crisisDetail.element(by.css('input'));
148+
await inputEle.sendKeys('-foo');
149+
150+
let buttonEle = page.crisisDetail.element(by.buttonText(save ? 'Save' : 'Cancel'));
151+
await buttonEle.click();
152+
crisisEle = page.crisisList.get(index);
153+
if (save) {
154+
expect(crisisEle.getText()).toEqual(crisisText + '-foo');
155+
} else {
156+
await browser.wait(EC.alertIsPresent(), 4000);
157+
await browser.switchTo().alert().accept();
158+
expect(crisisEle.getText()).toEqual(crisisText);
159+
}
164160
}
165161

166162
});

public/docs/_examples/template-syntax/ts/src/app/app.component.ts

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,6 @@ import { AfterViewInit, Component, ElementRef, OnInit, QueryList, ViewChildren }
55

66
import { Hero } from './hero';
77

8-
// Alerter fn: monkey patch during test
9-
export function alerter(msg?: string) {
10-
window.alert(msg);
11-
}
12-
138
export enum Color {Red, Green, Blue};
149

1510
/**
@@ -38,13 +33,13 @@ export class AppComponent implements AfterViewInit, OnInit {
3833
@ViewChildren('withTrackBy') heroesWithTrackBy: QueryList<ElementRef>;
3934

4035
actionName = 'Go for it';
41-
alert = alerter;
4236
badCurly = 'bad curly';
4337
classes = 'special';
4438
help = '';
4539

46-
callFax(value: string) {this.alert(`Faxing ${value} ...`); }
47-
callPhone(value: string) {this.alert(`Calling ${value} ...`); }
40+
alert(msg?: string) { window.alert(msg); }
41+
callFax(value: string) { this.alert(`Faxing ${value} ...`); }
42+
callPhone(value: string) { this.alert(`Calling ${value} ...`); }
4843
canSave = true;
4944

5045
changeIds() {

0 commit comments

Comments
 (0)