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.
This commit is contained in:
parent
c2bb6ad935
commit
557200be4f
|
@ -1,30 +1,34 @@
|
|||
'use strict'; // necessary for es6 output in node
|
||||
|
||||
import { browser, element, by, ElementFinder } from 'protractor';
|
||||
import { browser, element, by, ExpectedConditions } from 'protractor';
|
||||
|
||||
describe('Router', function () {
|
||||
const numDashboardTabs = 5;
|
||||
const numCrises = 4;
|
||||
const numHeroes = 6;
|
||||
const EC = ExpectedConditions;
|
||||
|
||||
beforeAll(function () {
|
||||
browser.get('');
|
||||
});
|
||||
describe('Router', () => {
|
||||
|
||||
beforeAll(() => browser.get(''));
|
||||
|
||||
function getPageStruct() {
|
||||
let hrefEles = element.all(by.css('my-app a'));
|
||||
const hrefEles = element.all(by.css('my-app a'));
|
||||
const crisisDetail = element.all(by.css('my-app > ng-component > ng-component > ng-component > div')).first();
|
||||
const heroDetail = element(by.css('my-app > ng-component > div'));
|
||||
|
||||
return {
|
||||
hrefs: hrefEles,
|
||||
routerParent: element(by.css('my-app > ng-component')),
|
||||
routerTitle: element(by.css('my-app > ng-component > h2')),
|
||||
activeHref: element(by.css('my-app a.active')),
|
||||
|
||||
crisisHref: hrefEles.get(0),
|
||||
crisisList: element.all(by.css('my-app > ng-component > ng-component li')),
|
||||
crisisDetail: element(by.css('my-app > ng-component > ng-component > ng-component > div')),
|
||||
crisisDetailTitle: element(by.css('my-app > ng-component > ng-component > ng-component > div > h3')),
|
||||
crisisDetail: crisisDetail,
|
||||
crisisDetailTitle: crisisDetail.element(by.xpath('*[1]')),
|
||||
|
||||
heroesHref: hrefEles.get(1),
|
||||
heroesList: element.all(by.css('my-app > ng-component li')),
|
||||
heroDetail: element(by.css('my-app > ng-component > div')),
|
||||
heroDetailTitle: element(by.css('my-app > ng-component > div > h3')),
|
||||
heroDetail: heroDetail,
|
||||
heroDetailTitle: heroDetail.element(by.xpath('*[1]')),
|
||||
|
||||
adminHref: hrefEles.get(2),
|
||||
adminPreloadList: element.all(by.css('my-app > ng-component > ng-component > ul > li')),
|
||||
|
@ -39,9 +43,9 @@ describe('Router', function () {
|
|||
};
|
||||
}
|
||||
|
||||
it('should be able to see the start screen', function () {
|
||||
let page = getPageStruct();
|
||||
expect(page.hrefs.count()).toEqual(5, 'should be 5 dashboard choices');
|
||||
it('has expected dashboard tabs', () => {
|
||||
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');
|
||||
|
@ -49,118 +53,110 @@ describe('Router', function () {
|
|||
expect(page.contactHref.getText()).toEqual('Contact');
|
||||
});
|
||||
|
||||
it('should be able to see crises center items', function () {
|
||||
let page = getPageStruct();
|
||||
page.crisisHref.click().then(function() {
|
||||
expect(page.crisisList.count()).toBe(4, 'should be 4 crisis center entries at start');
|
||||
});
|
||||
it('has heroes selected as opening tab', () => {
|
||||
const page = getPageStruct();
|
||||
expect(page.activeHref.getText()).toEqual('Heroes');
|
||||
});
|
||||
|
||||
it('should be able to see hero items', function () {
|
||||
let page = getPageStruct();
|
||||
page.heroesHref.click().then(function() {
|
||||
expect(page.routerTitle.getText()).toContain('HEROES');
|
||||
expect(page.heroesList.count()).toBe(6, 'should be 6 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');
|
||||
});
|
||||
|
||||
it('should be able to toggle the views', function () {
|
||||
let page = getPageStruct();
|
||||
page.crisisHref.click().then(function() {
|
||||
expect(page.crisisList.count()).toBe(4, 'should be 4 crisis center entries');
|
||||
return page.heroesHref.click();
|
||||
}).then(function() {
|
||||
expect(page.heroesList.count()).toBe(6, 'should be 6 heroes');
|
||||
});
|
||||
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');
|
||||
});
|
||||
|
||||
it('should be able to edit and save details from the crisis center view', function () {
|
||||
let page = getPageStruct();
|
||||
page.crisisHref.click().then(function() {
|
||||
crisisCenterEdit(2, true);
|
||||
});
|
||||
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');
|
||||
await page.heroesHref.click();
|
||||
expect(page.activeHref.getText()).toEqual('Heroes');
|
||||
expect(page.heroesList.count()).toBe(numHeroes, 'hero list count');
|
||||
});
|
||||
|
||||
xit('should be able to edit and cancel details from the crisis center view', function () {
|
||||
let page = getPageStruct();
|
||||
page.crisisHref.click().then(function() {
|
||||
crisisCenterEdit(3, false);
|
||||
});
|
||||
it('saves changed crisis details', async () => {
|
||||
const page = getPageStruct();
|
||||
await page.crisisHref.click();
|
||||
await crisisCenterEdit(2, true);
|
||||
});
|
||||
|
||||
it('should be able to edit and save details from the heroes view', function () {
|
||||
let page = getPageStruct();
|
||||
let heroEle: ElementFinder;
|
||||
let heroText: string;
|
||||
page.heroesHref.click().then(function() {
|
||||
heroEle = page.heroesList.get(4);
|
||||
return heroEle.getText();
|
||||
}).then(function(text: string) {
|
||||
expect(text.length).toBeGreaterThan(0, 'should have some text');
|
||||
it('can cancel changed crisis details', async () => {
|
||||
const page = getPageStruct();
|
||||
await page.crisisHref.click();
|
||||
await crisisCenterEdit(3, false);
|
||||
});
|
||||
|
||||
it('saves changed hero details', async () => {
|
||||
const page = getPageStruct();
|
||||
await page.heroesHref.click();
|
||||
const heroEle = page.heroesList.get(4);
|
||||
let text = await heroEle.getText();
|
||||
expect(text.length).toBeGreaterThan(0, 'hero item text length');
|
||||
// remove leading id from text
|
||||
heroText = text.substr(text.indexOf(' ')).trim();
|
||||
return heroEle.click();
|
||||
}).then(function() {
|
||||
expect(page.heroesList.count()).toBe(0, 'should no longer see crisis center entries');
|
||||
expect(page.heroDetail.isPresent()).toBe(true, 'should be able to see crisis detail');
|
||||
const heroText = text.substr(text.indexOf(' ')).trim();
|
||||
|
||||
await heroEle.click();
|
||||
expect(page.heroesList.count()).toBe(0, 'hero list count');
|
||||
expect(page.heroDetail.isPresent()).toBe(true, 'hero detail');
|
||||
expect(page.heroDetailTitle.getText()).toContain(heroText);
|
||||
let inputEle = page.heroDetail.element(by.css('input'));
|
||||
inputEle.sendKeys('-foo');
|
||||
await inputEle.sendKeys('-foo');
|
||||
expect(page.heroDetailTitle.getText()).toContain(heroText + '-foo');
|
||||
|
||||
let buttonEle = page.heroDetail.element(by.css('button'));
|
||||
return buttonEle.click();
|
||||
}).then(function() {
|
||||
await buttonEle.click();
|
||||
expect(heroEle.getText()).toContain(heroText + '-foo');
|
||||
});
|
||||
|
||||
it('sees preloaded modules', async () => {
|
||||
const page = getPageStruct();
|
||||
await page.loginHref.click();
|
||||
await page.loginButton.click();
|
||||
const list = page.adminPreloadList;
|
||||
expect(list.count()).toBe(1, 'preloaded module');
|
||||
expect(await list.first().getText()).toBe('crisis-center', 'first preloaded module');
|
||||
});
|
||||
|
||||
it('should be able to see the preloaded modules', function () {
|
||||
let page = getPageStruct();
|
||||
page.loginHref.click().then(function() {
|
||||
return page.loginButton.click();
|
||||
}).then(function() {
|
||||
expect(page.adminPreloadList.count()).toBe(1, 'should be 1 preloaded module');
|
||||
expect(page.adminPreloadList.first().getText()).toBe('crisis-center', 'first preload should be crisis center');
|
||||
});
|
||||
it('sees the secondary route', async () => {
|
||||
const page = getPageStruct();
|
||||
await page.heroesHref.click();
|
||||
await page.contactHref.click();
|
||||
expect(page.outletComponents.count()).toBe(2, 'route count');
|
||||
});
|
||||
|
||||
it('should be able to see the secondary route', function () {
|
||||
let page = getPageStruct();
|
||||
page.heroesHref.click().then(function() {
|
||||
return page.contactHref.click();
|
||||
}).then(function() {
|
||||
expect(page.outletComponents.count()).toBe(2, 'should be 2 displayed routes');
|
||||
});
|
||||
});
|
||||
|
||||
function crisisCenterEdit(index: number, shouldSave: boolean) {
|
||||
let page = getPageStruct();
|
||||
let crisisEle: ElementFinder;
|
||||
let crisisText: string;
|
||||
page.crisisHref.click()
|
||||
.then(function () {
|
||||
crisisEle = page.crisisList.get(index);
|
||||
return crisisEle.getText();
|
||||
}).then(function(text: string) {
|
||||
expect(text.length).toBeGreaterThan(0, 'should have some text');
|
||||
async function crisisCenterEdit(index: number, save: boolean) {
|
||||
const page = getPageStruct();
|
||||
await page.crisisHref.click();
|
||||
let crisisEle = page.crisisList.get(index);
|
||||
let text = await crisisEle.getText();
|
||||
expect(text.length).toBeGreaterThan(0, 'crisis item text length');
|
||||
// remove leading id from text
|
||||
crisisText = text.substr(text.indexOf(' ')).trim();
|
||||
return crisisEle.click();
|
||||
}).then(function () {
|
||||
expect(page.crisisDetail.isPresent()).toBe(true, 'should be able to see crisis detail');
|
||||
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);
|
||||
let inputEle = page.crisisDetail.element(by.css('input'));
|
||||
inputEle.sendKeys('-foo');
|
||||
expect(page.crisisDetailTitle.getText()).toContain(crisisText + '-foo');
|
||||
let buttonEle = page.crisisDetail.element(by.cssContainingText('button', shouldSave ? 'Save' : 'Cancel'));
|
||||
return buttonEle.click();
|
||||
}).then(function () {
|
||||
if (shouldSave) {
|
||||
expect(crisisEle.getText()).toContain(crisisText + '-foo');
|
||||
await inputEle.sendKeys('-foo');
|
||||
|
||||
let buttonEle = page.crisisDetail.element(by.buttonText(save ? 'Save' : 'Cancel'));
|
||||
await buttonEle.click();
|
||||
crisisEle = page.crisisList.get(index);
|
||||
if (save) {
|
||||
expect(crisisEle.getText()).toEqual(crisisText + '-foo');
|
||||
} else {
|
||||
expect(crisisEle.getText()).not.toContain(crisisText + '-foo');
|
||||
await browser.wait(EC.alertIsPresent(), 4000);
|
||||
await browser.switchTo().alert().accept();
|
||||
expect(crisisEle.getText()).toEqual(crisisText);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
|
|
|
@ -5,11 +5,6 @@ import { AfterViewInit, Component, ElementRef, OnInit, QueryList, ViewChildren }
|
|||
|
||||
import { Hero } from './hero';
|
||||
|
||||
// Alerter fn: monkey patch during test
|
||||
export function alerter(msg?: string) {
|
||||
window.alert(msg);
|
||||
}
|
||||
|
||||
export enum Color {Red, Green, Blue};
|
||||
|
||||
/**
|
||||
|
@ -38,11 +33,11 @@ export class AppComponent implements AfterViewInit, OnInit {
|
|||
@ViewChildren('withTrackBy') heroesWithTrackBy: QueryList<ElementRef>;
|
||||
|
||||
actionName = 'Go for it';
|
||||
alert = alerter;
|
||||
badCurly = 'bad curly';
|
||||
classes = 'special';
|
||||
help = '';
|
||||
|
||||
alert(msg?: string) { window.alert(msg); }
|
||||
callFax(value: string) { this.alert(`Faxing ${value} ...`); }
|
||||
callPhone(value: string) { this.alert(`Calling ${value} ...`); }
|
||||
canSave = true;
|
||||
|
|
Loading…
Reference in New Issue