chore: support e2e-specs written in TypeScript

Update gulpfile and project to add a tsconfig to protractor test folders
Change all sample e2e-spec.js -> e2e-spec.ts
Split typings between e2e-spec & app code
Use same config for all e2e tests
Only 1/3 e2e specs truly converted.
Most don't pass because they fail TS transpile by Protractor due to missing type annotations
This commit is contained in:
Ward Bell
2016-05-31 22:03:13 -07:00
parent ae2d8f2730
commit 8a5df4cfa9
44 changed files with 954 additions and 693 deletions
+2 -1
View File
@@ -18,7 +18,8 @@ before_script:
install:
- npm install --no-optional
- npm install --prefix public/docs/_examples
- npm run webdriver:update --prefix public/docs/_examples
- npm install --prefix public/docs/_examples/_protractor
- npm run webdriver:update --prefix public/docs/_examples/_protractor
- gulp add-example-boilerplate
script:
- gulp $SCRIPT
+104 -53
View File
File diff suppressed because it is too large Load Diff
+14
View File
@@ -0,0 +1,14 @@
/// <reference path="typings/index.d.ts" />
// Defined in protractor.config.js
declare function setProtractorToNg1Mode(): void;
declare function sendKeys(element: protractor.ElementFinder, str: string): webdriver.promise.Promise<void>;
declare function describeIf(cond: boolean, name: string, func: Function): void;
declare function itIf(cond: boolean, name: string, func: Function): void;
declare namespace protractor {
interface IBrowser {
appIsTs: boolean;
appIsJs: boolean;
}
}
@@ -0,0 +1,19 @@
{
"name": "angular2-examples-protractor",
"version": "1.0.0",
"description": "Manage _protractor folder installations",
"scripts": {
"postinstall": "typings install",
"typings": "typings",
"protractor": "protractor",
"webdriver:update": "webdriver-manager update"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"protractor": "^3.3.0",
"typings": "^1.0.4"
},
"repository": {}
}
@@ -26,10 +26,6 @@ exports.config = {
// Framework to use. Jasmine is recommended.
framework: 'jasmine',
// Spec patterns are relative to this config file
specs: ['**/*e2e-spec.js' ],
// For angular2 tests
useAllAngular2AppRoots: true,
@@ -71,7 +67,7 @@ exports.config = {
global.setProtractorToNg1Mode = function() {
browser.useAllAngular2AppRoots = false;
browser.rootEl = 'body';
var disableNgAnimate = function() {
angular.module('disableNgAnimate', []).run(['$animate', function($animate) {
$animate.enabled(false);
@@ -87,6 +83,11 @@ exports.config = {
defaultTimeoutInterval: 10000,
showTiming: true,
print: function() {}
},
beforeLaunch: function() {
// add TS support for specs
require('ts-node').register();
}
};
@@ -118,7 +119,7 @@ function sendKeys(element, str) {
}
function Reporter(options) {
var _defaultOutputFile = path.resolve(process.cwd(), "../../", 'protractor-results.txt');
var _defaultOutputFile = path.resolve(process.cwd(), "../../../../", 'protractor-results.txt');
options.outputFile = options.outputFile || _defaultOutputFile;
var _root = { appDir: options.appDir, suites: [] };
@@ -142,7 +143,7 @@ function Reporter(options) {
};
this.specStarted = function(spec) {
};
this.specDone = function(spec) {
@@ -0,0 +1,16 @@
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": true,
"suppressImplicitAnyIndexErrors": true
},
"files": [
"e2e-spec.ts"
]
}
@@ -0,0 +1,9 @@
{
"globalDependencies": {
"angular-protractor": "registry:dt/angular-protractor#1.5.0+20160425143459",
"core-js": "registry:dt/core-js#0.0.0+20160317120654",
"jasmine": "registry:dt/jasmine#2.2.0+20160505161446",
"node": "registry:dt/node#4.0.0+20160509154515",
"selenium-webdriver": "registry:dt/selenium-webdriver#2.44.0+20160317120654"
}
}
@@ -1,48 +1,49 @@
/// <reference path='../_protractor/e2e.d.ts' />
describe('Architecture', function () {
var _title = "Hero List";
let title = 'Hero List';
beforeAll(function () {
browser.get('');
});
function itReset(name, func) {
function itReset(name: string, func: (v: void) => any) {
it(name, function() {
browser.get('').then(func);
});
}
it('should display correct title: ' + _title, function () {
expect(element(by.css('h2')).getText()).toEqual(_title);
it('should display correct title: ' + title, function () {
expect(element(by.css('h2')).getText()).toEqual(title);
});
it('should display correct detail after selection', function() {
var detailView = element(by.css('hero-detail'));
let detailView = element(by.css('hero-detail'));
expect(detailView.isPresent()).toBe(false);
// select the 2nd element
var selectEle = element.all(by.css('hero-list > div')).get(1);
let selectEle = element.all(by.css('hero-list > div')).get(1);
selectEle.click().then(function() {
return selectEle.getText();
}).then(function(selectedHeroName) {
// works but too specific if we change the app
// expect(selectedHeroName).toEqual('Mr. Nice');
expect(detailView.isDisplayed()).toBe(true);
var detailTitleEle = element(by.css('hero-detail > h4'));
let detailTitleEle = element(by.css('hero-detail > h4'));
expect(detailTitleEle.getText()).toContain(selectedHeroName);
});
})
});
itReset('should display correct detail after modification', function() {
var detailView = element(by.css('hero-detail'));
let detailView = element(by.css('hero-detail'));
expect(detailView.isPresent()).toBe(false);
// select the 2nd element
var selectEle = element.all(by.css('hero-list > div')).get(1);
let selectEle = element.all(by.css('hero-list > div')).get(1);
selectEle.click().then(function () {
return selectEle.getText();
}).then(function (selectedHeroName) {
var detailTitleEle = element(by.css('hero-detail > h4'));
let detailTitleEle = element(by.css('hero-detail > h4'));
expect(detailTitleEle.getText()).toContain(selectedHeroName);
var heroNameEle = element.all(by.css('hero-detail input')).get(0);
let heroNameEle = element.all(by.css('hero-detail input')).get(0);
// check that both the initial selected item and the detail title reflect changes
// made to the input box.
@@ -56,6 +57,6 @@ describe('Architecture', function () {
// expect(heroNameEle.getText()).toEqual(selectedHeroName);
expect(heroNameEle.getAttribute('value')).toEqual(selectedHeroName + 'foo');
});
})
});
});
@@ -1,6 +1,7 @@
/// <reference path='../_protractor/e2e.d.ts' />
describe('Attribute directives', function () {
var _title = "My First Attribute Directive";
let _title = 'My First Attribute Directive';
beforeAll(function () {
browser.get('');
@@ -11,14 +12,15 @@ describe('Attribute directives', function () {
});
it('should be able to select green highlight', function () {
var highlightedEle = element(by.cssContainingText('p', 'Highlight me'));
var lightGreen = "rgba(144, 238, 144, 1)";
let highlightedEle = element(by.cssContainingText('p', 'Highlight me'));
let lightGreen = 'rgba(144, 238, 144, 1)';
expect(highlightedEle.getCssValue('background-color')).not.toEqual(lightGreen);
// var greenRb = element(by.cssContainingText('input', 'Green'));
var greenRb = element.all(by.css('input')).get(0);
// let greenRb = element(by.cssContainingText('input', 'Green'));
let greenRb = element.all(by.css('input')).get(0);
greenRb.click().then(function() {
browser.actions().mouseMove(highlightedEle).perform();
// TypeScript Todo: find the right type for highlightedEle
browser.actions().mouseMove(highlightedEle as any).perform();
expect(highlightedEle.getCssValue('background-color')).toEqual(lightGreen);
});
@@ -1,3 +1,4 @@
/// <reference path='../_protractor/e2e.d.ts' />
describe('Angular 1 to 2 Quick Reference Tests', function () {
beforeAll(function () {
@@ -10,7 +11,7 @@ describe('Angular 1 to 2 Quick Reference Tests', function () {
it('should display proper movie data', function () {
// We check only a few samples
var expectedSamples = [
let expectedSamples: any[] = [
{row: 0, column: 0, element: 'img', attr: 'src', value: 'images/hero.png', contains: true},
{row: 0, column: 2, value: 'Celeritas'},
{row: 1, column: 3, matches: /Dec 1[678], 2015/}, // absorb timezone dif; we care about date format
@@ -21,18 +22,18 @@ describe('Angular 1 to 2 Quick Reference Tests', function () {
];
// Go through the samples
var movieRows = getMovieRows();
for (var i = 0; i < expectedSamples.length; i++) {
var sample = expectedSamples[i];
var tableCell = movieRows.get(sample.row)
let movieRows = getMovieRows();
for (let i = 0; i < expectedSamples.length; i++) {
let sample = expectedSamples[i];
let tableCell = movieRows.get(sample.row)
.all(by.tagName('td')).get(sample.column);
// Check the cell or its nested element
var elementToCheck = sample.element
let elementToCheck = sample.element
? tableCell.element(by.tagName(sample.element))
: tableCell;
// Check element attribute or text
var valueToCheck = sample.attr
let valueToCheck = sample.attr
? elementToCheck.getAttribute(sample.attr)
: elementToCheck.getText();
@@ -48,38 +49,38 @@ describe('Angular 1 to 2 Quick Reference Tests', function () {
});
it('should display images after Show Poster', function () {
testPosterButtonClick("Show Poster", true);
testPosterButtonClick('Show Poster', true);
});
it('should hide images after Hide Poster', function () {
testPosterButtonClick("Hide Poster", false);
testPosterButtonClick('Hide Poster', false);
});
it('should display no movie when no favorite hero is specified', function () {
testFavoriteHero(null, "Please enter your favorite hero.");
testFavoriteHero(null, 'Please enter your favorite hero.');
});
it('should display no movie for Magneta', function () {
testFavoriteHero("Magneta", "No movie, sorry!");
testFavoriteHero('Magneta', 'No movie, sorry!');
});
it('should display a movie for Mr. Nice', function () {
testFavoriteHero("Mr. Nice", "Excellent choice!");
testFavoriteHero('Mr. Nice', 'Excellent choice!');
});
function testImagesAreDisplayed(isDisplayed) {
var expectedMovieCount = 3;
function testImagesAreDisplayed(isDisplayed: boolean) {
let expectedMovieCount = 3;
var movieRows = getMovieRows();
let movieRows = getMovieRows();
expect(movieRows.count()).toBe(expectedMovieCount);
for (var i = 0; i < expectedMovieCount; i++) {
var movieImage = movieRows.get(i).element(by.css('td > img'));
for (let i = 0; i < expectedMovieCount; i++) {
let movieImage = movieRows.get(i).element(by.css('td > img'));
expect(movieImage.isDisplayed()).toBe(isDisplayed);
}
}
function testPosterButtonClick(expectedButtonText, isDisplayed) {
var posterButton = element(by.css('movie-list tr > th > button'));
function testPosterButtonClick(expectedButtonText: string, isDisplayed: boolean) {
let posterButton = element(by.css('movie-list tr > th > button'));
expect(posterButton.getText()).toBe(expectedButtonText);
posterButton.click().then(function () {
@@ -91,11 +92,11 @@ describe('Angular 1 to 2 Quick Reference Tests', function () {
return element.all(by.css('movie-list tbody > tr'));
}
function testFavoriteHero(heroName, expectedLabel) {
var movieListComp = element(by.tagName('movie-list'));
var heroInput = movieListComp.element(by.tagName('input'));
var favoriteHeroLabel = movieListComp.element(by.tagName('h3'));
var resultLabel = movieListComp.element(by.css('span > p'));
function testFavoriteHero(heroName: string, expectedLabel: string) {
let movieListComp = element(by.tagName('movie-list'));
let heroInput = movieListComp.element(by.tagName('input'));
let favoriteHeroLabel = movieListComp.element(by.tagName('h3'));
let resultLabel = movieListComp.element(by.css('span > p'));
heroInput.clear().then(function () {
sendKeys(heroInput, heroName || '').then(function () {
@@ -1,3 +1,4 @@
/// <reference path='../_protractor/e2e.d.ts' />
describe('Component Communication Cookbook Tests', function () {
// Note: '?e2e' which app can read to know it is running in protractor
@@ -9,16 +10,16 @@ describe('Component Communication Cookbook Tests', function () {
describe('Parent-to-child communication', function() {
// #docregion parent-to-child
// ...
var _heroNames = ['Mr. IQ', 'Magneta', 'Bombasto'];
var _masterName = 'Master';
let _heroNames = ['Mr. IQ', 'Magneta', 'Bombasto'];
let _masterName = 'Master';
it('should pass properties to children properly', function () {
var parent = element.all(by.tagName('hero-parent')).get(0);
var heroes = parent.all(by.tagName('hero-child'));
let parent = element.all(by.tagName('hero-parent')).get(0);
let heroes = parent.all(by.tagName('hero-child'));
for (var i = 0; i < _heroNames.length; i++) {
var childTitle = heroes.get(i).element(by.tagName('h3')).getText();
var childDetail = heroes.get(i).element(by.tagName('p')).getText();
for (let i = 0; i < _heroNames.length; i++) {
let childTitle = heroes.get(i).element(by.tagName('h3')).getText();
let childDetail = heroes.get(i).element(by.tagName('p')).getText();
expect(childTitle).toEqual(_heroNames[i] + ' says:')
expect(childDetail).toContain(_masterName)
}
@@ -31,22 +32,22 @@ describe('Component Communication Cookbook Tests', function () {
// #docregion parent-to-child-setter
// ...
it('should display trimmed, non-empty names', function () {
var _nonEmptyNameIndex = 0;
var _nonEmptyName = '"Mr. IQ"';
var parent = element.all(by.tagName('name-parent')).get(0);
var hero = parent.all(by.tagName('name-child')).get(_nonEmptyNameIndex);
let _nonEmptyNameIndex = 0;
let _nonEmptyName = '"Mr. IQ"';
let parent = element.all(by.tagName('name-parent')).get(0);
let hero = parent.all(by.tagName('name-child')).get(_nonEmptyNameIndex);
var displayName = hero.element(by.tagName('h3')).getText();
let displayName = hero.element(by.tagName('h3')).getText();
expect(displayName).toEqual(_nonEmptyName)
});
it('should replace empty name with default name', function () {
var _emptyNameIndex = 1;
var _defaultName = '"<no name set>"';
var parent = element.all(by.tagName('name-parent')).get(0);
var hero = parent.all(by.tagName('name-child')).get(_emptyNameIndex);
let _emptyNameIndex = 1;
let _defaultName = '"<no name set>"';
let parent = element.all(by.tagName('name-parent')).get(0);
let hero = parent.all(by.tagName('name-child')).get(_emptyNameIndex);
var displayName = hero.element(by.tagName('h3')).getText();
let displayName = hero.element(by.tagName('h3')).getText();
expect(displayName).toEqual(_defaultName)
});
// ...
@@ -58,26 +59,26 @@ describe('Component Communication Cookbook Tests', function () {
// ...
// Test must all execute in this exact order
it('should set expected initial values', function () {
var actual = getActual();
let actual = getActual();
var initialLabel = "Version 1.23";
var initialLog = 'major changed from {} to 1, minor changed from {} to 23';
let initialLabel = 'Version 1.23';
let initialLog = 'major changed from {} to 1, minor changed from {} to 23';
expect(actual.label).toBe(initialLabel);
expect(actual.count).toBe(1);
expect(actual.logs.get(0).getText()).toBe(initialLog);
});
it('should set expected values after clicking "Minor" twice', function () {
var repoTag = element(by.tagName('version-parent'));
var newMinorButton = repoTag.all(by.tagName('button')).get(0);
it('should set expected values after clicking \'Minor\' twice', function () {
let repoTag = element(by.tagName('version-parent'));
let newMinorButton = repoTag.all(by.tagName('button')).get(0);
newMinorButton.click().then(function() {
newMinorButton.click().then(function() {
var actual = getActual();
let actual = getActual();
var labelAfter2Minor = "Version 1.25";
var logAfter2Minor = 'minor changed from 24 to 25';
let labelAfter2Minor = 'Version 1.25';
let logAfter2Minor = 'minor changed from 24 to 25';
expect(actual.label).toBe(labelAfter2Minor);
expect(actual.count).toBe(3);
@@ -86,15 +87,15 @@ describe('Component Communication Cookbook Tests', function () {
});
});
it('should set expected values after clicking "Major" once', function () {
var repoTag = element(by.tagName('version-parent'));
var newMajorButton = repoTag.all(by.tagName('button')).get(1);
it('should set expected values after clicking \'Major\' once', function () {
let repoTag = element(by.tagName('version-parent'));
let newMajorButton = repoTag.all(by.tagName('button')).get(1);
newMajorButton.click().then(function() {
var actual = getActual();
let actual = getActual();
var labelAfterMajor = "Version 2.0";
var logAfterMajor = 'major changed from 1 to 2, minor changed from 25 to 0';
let labelAfterMajor = 'Version 2.0';
let logAfterMajor = 'major changed from 1 to 2, minor changed from 25 to 0';
expect(actual.label).toBe(labelAfterMajor);
expect(actual.count).toBe(4);
@@ -103,10 +104,10 @@ describe('Component Communication Cookbook Tests', function () {
});
function getActual() {
var versionTag = element(by.tagName('version-child'));
var label = versionTag.element(by.tagName('h3')).getText();
var ul = versionTag.element((by.tagName('ul')));
var logs = ul.all(by.tagName('li'));
let versionTag = element(by.tagName('version-child'));
let label = versionTag.element(by.tagName('h3')).getText();
let ul = versionTag.element((by.tagName('ul')));
let logs = ul.all(by.tagName('li'));
return {
label: label,
@@ -123,28 +124,28 @@ describe('Component Communication Cookbook Tests', function () {
// #docregion child-to-parent
// ...
it('should not emit the event initially', function () {
var voteLabel = element(by.tagName('vote-taker'))
let voteLabel = element(by.tagName('vote-taker'))
.element(by.tagName('h3')).getText();
expect(voteLabel).toBe("Agree: 0, Disagree: 0");
expect(voteLabel).toBe('Agree: 0, Disagree: 0');
});
it('should process Agree vote', function () {
var agreeButton1 = element.all(by.tagName('my-voter')).get(0)
let agreeButton1 = element.all(by.tagName('my-voter')).get(0)
.all(by.tagName('button')).get(0);
agreeButton1.click().then(function() {
var voteLabel = element(by.tagName('vote-taker'))
let voteLabel = element(by.tagName('vote-taker'))
.element(by.tagName('h3')).getText();
expect(voteLabel).toBe("Agree: 1, Disagree: 0");
expect(voteLabel).toBe('Agree: 1, Disagree: 0');
});
});
it('should process Disagree vote', function () {
var agreeButton1 = element.all(by.tagName('my-voter')).get(1)
let agreeButton1 = element.all(by.tagName('my-voter')).get(1)
.all(by.tagName('button')).get(1);
agreeButton1.click().then(function() {
var voteLabel = element(by.tagName('vote-taker'))
let voteLabel = element(by.tagName('vote-taker'))
.element(by.tagName('h3')).getText();
expect(voteLabel).toBe("Agree: 1, Disagree: 1");
expect(voteLabel).toBe('Agree: 1, Disagree: 1');
});
});
// ...
@@ -161,23 +162,23 @@ describe('Component Communication Cookbook Tests', function () {
countDownTimerTests('countdown-parent-vc')
});
function countDownTimerTests(parentTag) {
function countDownTimerTests(parentTag: string) {
// #docregion countdown-timer-tests
// ...
it('timer and parent seconds should match', function () {
var parent = element(by.tagName(parentTag));
var message = parent.element(by.tagName('countdown-timer')).getText();
let parent = element(by.tagName(parentTag));
let message = parent.element(by.tagName('countdown-timer')).getText();
browser.sleep(10); // give `seconds` a chance to catchup with `message`
var seconds = parent.element(by.className('seconds')).getText();
let seconds = parent.element(by.className('seconds')).getText();
expect(message).toContain(seconds);
});
it('should stop the countdown', function () {
var parent = element(by.tagName(parentTag));
var stopButton = parent.all(by.tagName('button')).get(1);
let parent = element(by.tagName(parentTag));
let stopButton = parent.all(by.tagName('button')).get(1);
stopButton.click().then(function() {
var message = parent.element(by.tagName('countdown-timer')).getText();
let message = parent.element(by.tagName('countdown-timer')).getText();
expect(message).toContain('Holding');
});
});
@@ -190,10 +191,10 @@ describe('Component Communication Cookbook Tests', function () {
// #docregion bidirectional-service
// ...
it('should announce a mission', function () {
var missionControl = element(by.tagName('mission-control'));
var announceButton = missionControl.all(by.tagName('button')).get(0);
let missionControl = element(by.tagName('mission-control'));
let announceButton = missionControl.all(by.tagName('button')).get(0);
announceButton.click().then(function () {
var history = missionControl.all(by.tagName('li'));
let history = missionControl.all(by.tagName('li'));
expect(history.count()).toBe(1);
expect(history.get(0).getText()).toMatch(/Mission.* announced/);
});
@@ -211,14 +212,14 @@ describe('Component Communication Cookbook Tests', function () {
testConfirmMission(2, 4, 'Swigert');
});
function testConfirmMission(buttonIndex, expectedLogCount, astronaut) {
var _confirmedLog = ' confirmed the mission';
var missionControl = element(by.tagName('mission-control'));
var confirmButton = missionControl.all(by.tagName('button')).get(buttonIndex);
function testConfirmMission(buttonIndex: number, expectedLogCount: number, astronaut: string) {
let _confirmedLog = ' confirmed the mission';
let missionControl = element(by.tagName('mission-control'));
let confirmButton = missionControl.all(by.tagName('button')).get(buttonIndex);
confirmButton.click().then(function () {
var history = missionControl.all(by.tagName('li'));
let history = missionControl.all(by.tagName('li'));
expect(history.count()).toBe(expectedLogCount);
expect(history.get(expectedLogCount-1).getText()).toBe(astronaut + _confirmedLog);
expect(history.get(expectedLogCount - 1).getText()).toBe(astronaut + _confirmedLog);
});
}
// ...
@@ -1,5 +1,12 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('Cookbook: component-relative paths', function () {
interface Page {
title: protractor.ElementFinder;
absComp: protractor.ElementFinder;
relComp: protractor.ElementFinder;
}
function getPageStruct() {
return {
title: element( by.tagName( 'h1' )),
@@ -8,7 +15,7 @@ describe('Cookbook: component-relative paths', function () {
}
}
var page;
let page: Page;
beforeAll(function () {
browser.get('');
page = getPageStruct();
@@ -1,3 +1,4 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('Dependency Injection Cookbook', function () {
beforeAll(function () {
@@ -5,104 +6,104 @@ describe('Dependency Injection Cookbook', function () {
});
it('should render Logged in User example', function () {
var loggedInUser = element.all(by.xpath('//h3[text()="Logged in user"]')).get(0);
let loggedInUser = element.all(by.xpath('//h3[text()="Logged in user"]')).get(0);
expect(loggedInUser).toBeDefined();
});
it('"Bombasto" should be the logged in user', function () {
loggedInUser = element.all(by.xpath('//div[text()="Name: Bombasto"]')).get(0);
it('"Bombasto" should be the logged in user', function () {
let loggedInUser = element.all(by.xpath('//div[text()="Name: Bombasto"]')).get(0);
expect(loggedInUser).toBeDefined();
});
it('should render sorted heroes', function () {
var sortedHeroes = element.all(by.xpath('//h3[text()="Sorted Heroes" and position()=1]')).get(0);
it('should render sorted heroes', function () {
let sortedHeroes = element.all(by.xpath('//h3[text()="Sorted Heroes" and position()=1]')).get(0);
expect(sortedHeroes).toBeDefined();
});
});
it('Mr. Nice should be in sorted heroes', function () {
var sortedHero = element.all(by.xpath('//sorted-heroes/[text()="Mr. Nice" and position()=2]')).get(0);
let sortedHero = element.all(by.xpath('//sorted-heroes/[text()="Mr. Nice" and position()=2]')).get(0);
expect(sortedHero).toBeDefined();
});
it('RubberMan should be in sorted heroes', function () {
sortedHero = element.all(by.xpath('//sorted-heroes/[text()="RubberMan" and position()=3]')).get(0);
it('RubberMan should be in sorted heroes', function () {
let sortedHero = element.all(by.xpath('//sorted-heroes/[text()="RubberMan" and position()=3]')).get(0);
expect(sortedHero).toBeDefined();
});
it('Magma should be in sorted heroes', function () {
sortedHero = element.all(by.xpath('//sorted-heroes/[text()="Magma"]')).get(0);
let sortedHero = element.all(by.xpath('//sorted-heroes/[text()="Magma"]')).get(0);
expect(sortedHero).toBeDefined();
});
it('should render Hero of the Month when DI deps are defined using provide()', function () {
var heroOfTheMonth = element.all(by.xpath('//h3[text()="Hero of the month"]')).get(0);
it('should render Hero of the Month when DI deps are defined using provide()', function () {
let heroOfTheMonth = element.all(by.xpath('//h3[text()="Hero of the month"]')).get(0);
expect(heroOfTheMonth).toBeDefined();
});
it('should render Hero of the Month when DI deps are defined using provide object literal', function () {
var heroOfTheMonth = element.all(by.xpath('//h3[text()="Hero of the month 2"]')).get(0);
it('should render Hero of the Month when DI deps are defined using provide object literal', function () {
let heroOfTheMonth = element.all(by.xpath('//h3[text()="Hero of the month 2"]')).get(0);
expect(heroOfTheMonth).toBeDefined();
});
it('should render Hero Bios', function () {
var heroBios = element.all(by.xpath('//h3[text()="Hero Bios"]')).get(0);
it('should render Hero Bios', function () {
let heroBios = element.all(by.xpath('//h3[text()="Hero Bios"]')).get(0);
expect(heroBios).toBeDefined();
});
it('should render Magma\'s description in Hero Bios', function () {
var magmaText = element.all(by.xpath('//textarea[text()="Hero of all trades"]')).get(0);
it('should render Magma\'s description in Hero Bios', function () {
let magmaText = element.all(by.xpath('//textarea[text()="Hero of all trades"]')).get(0);
expect(magmaText).toBeDefined();
});
it('should render Magma\'s phone in Hero Bios and Contacts', function () {
var magmaPhone = element.all(by.xpath('//div[text()="Phone #: 555-555-5555"]')).get(0);
it('should render Magma\'s phone in Hero Bios and Contacts', function () {
let magmaPhone = element.all(by.xpath('//div[text()="Phone #: 555-555-5555"]')).get(0);
expect(magmaPhone).toBeDefined();
});
it('should render Hero-of-the-Month runner-ups when DI deps are defined using provide()', function () {
var runnersUp = element(by.id('rups1')).getText();
it('should render Hero-of-the-Month runner-ups when DI deps are defined using provide()', function () {
let runnersUp = element(by.id('rups1')).getText();
expect(runnersUp).toContain('RubberMan, Mr. Nice');
});
it('should render Hero-of-the-Month runner-ups when DI deps are defined using provide object literal', function () {
var runnersUp = element(by.id('rups2')).getText();
it('should render Hero-of-the-Month runner-ups when DI deps are defined using provide object literal', function () {
let runnersUp = element(by.id('rups2')).getText();
expect(runnersUp).toContain('RubberMan, Mr. Nice');
});
it('should render DateLogger log entry in Hero-of-the-Month', function () {
var logs = element.all(by.id('logs')).get(0).getText();
it('should render DateLogger log entry in Hero-of-the-Month', function () {
let logs = element.all(by.id('logs')).get(0).getText();
expect(logs).toContain('INFO: starting up at');
});
it('should highlight Hero Bios and Contacts container when mouseover', function () {
var target = element(by.css('div[myHighlight="yellow"]'))
var yellow = "rgba(255, 255, 0, 1)";
let target = element(by.css('div[myHighlight="yellow"]'))
let yellow = 'rgba(255, 255, 0, 1)';
expect(target.getCssValue('background-color')).not.toEqual(yellow);
browser.actions().mouseMove(target).perform();
browser.actions().mouseMove(target as any as webdriver.WebElement).perform();
expect(target.getCssValue('background-color')).toEqual(yellow);
});
describe('in Parent Finder', function () {
var cathy1 = element(by.css('alex cathy'));
var craig1 = element(by.css('alex craig'));
var carol1 = element(by.css('alex carol p'));
var carol2 = element(by.css('barry carol p'));
it('"Cathy" should find "Alex" via the component class', function () {
let cathy1 = element(by.css('alex cathy'));
let craig1 = element(by.css('alex craig'));
let carol1 = element(by.css('alex carol p'));
let carol2 = element(by.css('barry carol p'));
it('"Cathy" should find "Alex" via the component class', function () {
expect(cathy1.getText()).toContain('Found Alex via the component');
});
it('"Craig" should not find "Alex" via the base class', function () {
it('"Craig" should not find "Alex" via the base class', function () {
expect(craig1.getText()).toContain('Did not find Alex via the base');
});
it('"Carol" within "Alex" should have "Alex" parent', function () {
it('"Carol" within "Alex" should have "Alex" parent', function () {
expect(carol1.getText()).toContain('Alex');
});
it('"Carol" within "Barry" should have "Barry" parent', function () {
it('"Carol" within "Barry" should have "Barry" parent', function () {
expect(carol2.getText()).toContain('Barry');
});
})
});
});
@@ -1,3 +1,5 @@
/// <reference path="../_protractor/e2e.d.ts" />
/* tslint:disable:quotemark */
describe('Dynamic Form', function () {
beforeAll(function () {
@@ -5,17 +7,17 @@ describe('Dynamic Form', function () {
});
it('should submit form', function () {
var firstNameElement = element.all(by.css('input[id=firstName]')).get(0);
let firstNameElement = element.all(by.css('input[id=firstName]')).get(0);
expect(firstNameElement.getAttribute('value')).toEqual('Bombasto');
var emailElement = element.all(by.css('input[id=emailAddress]')).get(0);
var email = '[email protected]';
let emailElement = element.all(by.css('input[id=emailAddress]')).get(0);
let email = '[email protected]';
emailElement.sendKeys(email);
expect(emailElement.getAttribute('value')).toEqual(email);
expect(emailElement.getAttribute('value')).toEqual(email);
element(by.css('select option[value="solid"]')).click()
var saveButton = element.all(by.css('button')).get(0);
let saveButton = element.all(by.css('button')).get(0);
saveButton.click().then(function(){
expect(element(by.xpath("//strong[contains(text(),'Saved the following values')]")).isPresent()).toBe(true);
});
@@ -1,3 +1,4 @@
/// <reference path="../_protractor/e2e.d.ts" />
// gulp run-e2e-tests --filter=cb-set-document-title
describe('Set Document Title', function () {
@@ -7,7 +8,7 @@ describe('Set Document Title', function () {
it('should set the document title', function () {
var titles = [
let titles = [
'Good morning!',
'Good afternoon!',
'Good evening!'
@@ -1,3 +1,4 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('TypeScript to Javascript tests', function () {
beforeAll(function () {
@@ -21,9 +22,9 @@ describe('TypeScript to Javascript tests', function () {
});
it('should support optional, attribute, and query injections', function () {
var app = element(by.css('hero-di-inject-additional'));
var h1 = app.element(by.css('h1'));
var okMsg = app.element(by.css('.ok-msg'));
let app = element(by.css('hero-di-inject-additional'));
let h1 = app.element(by.css('h1'));
let okMsg = app.element(by.css('.ok-msg'));
expect(h1.getText()).toBe('Tour of Heroes');
app.element(by.buttonText('OK')).click();
@@ -31,8 +32,8 @@ describe('TypeScript to Javascript tests', function () {
});
it('should support component with inputs and outputs', function () {
var app = element(by.css('hero-io'));
var confirmComponent = app.element(by.css('my-confirm'));
let app = element(by.css('hero-io'));
let confirmComponent = app.element(by.css('my-confirm'));
confirmComponent.element(by.buttonText('OK')).click();
expect(app.element(by.cssContainingText('span', 'OK clicked')).isPresent()).toBe(true);
@@ -42,8 +43,8 @@ describe('TypeScript to Javascript tests', function () {
});
it('should support host bindings and host listeners', function() {
var app = element(by.css('heroes-bindings'));
var h1 = app.element(by.css('h1'));
let app = element(by.css('heroes-bindings'));
let h1 = app.element(by.css('h1'));
expect(app.getAttribute('class')).toBe('heading');
expect(app.getAttribute('title')).toBe('Tooltip content');
@@ -52,21 +53,21 @@ describe('TypeScript to Javascript tests', function () {
expect(h1.getAttribute('class')).toBe('active');
h1.click();
browser.actions().doubleClick(h1).perform();
browser.actions().doubleClick(h1 as any as webdriver.WebElement).perform();
expect(h1.getAttribute('class')).toBe('active');
});
it('should support content and view queries', function() {
var app = element(by.css('heroes-queries'));
var windstorm = app.element(by.css('hero:first-child'));
let app = element(by.css('heroes-queries'));
let windstorm = app.element(by.css('hero:first-child'));
app.element(by.buttonText('Activate')).click();
expect(windstorm.element(by.css('h2')).getAttribute('class')).toBe('active');
expect(windstorm.element(by.css('active-label')).getText()).toBe('Active');
});
function testTag(selector, expectedText) {
var component = element(by.css(selector));
function testTag(selector: string, expectedText: string) {
let component = element(by.css(selector));
expect(component.getText()).toBe(expectedText);
}
@@ -1,3 +1,4 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('Component Style Tests', function () {
beforeAll(function () {
@@ -5,8 +6,8 @@ describe('Component Style Tests', function () {
});
it('scopes component styles to component view', function() {
var componentH1 = element(by.css('hero-app > h1'));
var externalH1 = element(by.css('body > h1'));
let componentH1 = element(by.css('hero-app > h1'));
let externalH1 = element(by.css('body > h1'));
expect(componentH1.getCssValue('fontWeight')).toEqual('normal');
expect(externalH1.getCssValue('fontWeight')).not.toEqual('normal');
@@ -14,55 +15,55 @@ describe('Component Style Tests', function () {
it('allows styling :host element', function() {
var host = element(by.css('hero-details'));
let host = element(by.css('hero-details'));
expect(host.getCssValue('borderWidth')).toEqual('1px');
});
it('supports :host() in function form', function() {
var host = element(by.css('hero-details'));
let host = element(by.css('hero-details'));
host.element(by.buttonText('Activate')).click();
expect(host.getCssValue('borderWidth')).toEqual('3px');
});
it('allows conditional :host-context() styling', function() {
var h2 = element(by.css('hero-details h2'));
let h2 = element(by.css('hero-details h2'));
expect(h2.getCssValue('backgroundColor')).toEqual('rgba(238, 238, 255, 1)'); // #eeeeff
});
it('styles both view and content children with /deep/', function() {
var viewH3 = element(by.css('hero-team h3'));
var contentH3 = element(by.css('hero-controls h3'));
let viewH3 = element(by.css('hero-team h3'));
let contentH3 = element(by.css('hero-controls h3'));
expect(viewH3.getCssValue('fontStyle')).toEqual('italic');
expect(contentH3.getCssValue('fontStyle')).toEqual('italic');
});
it('includes styles loaded with CSS @import', function() {
var host = element(by.css('hero-details'));
let host = element(by.css('hero-details'));
expect(host.getCssValue('padding')).toEqual('10px');
});
it('processes template inline styles', function() {
var button = element(by.css('hero-controls button'));
var externalButton = element(by.css('body > button'));
let button = element(by.css('hero-controls button'));
let 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)');
});
it('processes template <link>s', function() {
var li = element(by.css('hero-team li:first-child'));
var externalLi = element(by.css('body > ul li'));
let li = element(by.css('hero-team li:first-child'));
let externalLi = element(by.css('body > ul li'));
expect(li.getCssValue('listStyleType')).toEqual('square');
expect(externalLi.getCssValue('listStyleType')).not.toEqual('square');
});
it('supports relative loading with moduleId', function() {
var host = element(by.css('quest-summary'));
let host = element(by.css('quest-summary'));
expect(host.getCssValue('color')).toEqual('rgba(255, 255, 255, 1)'); // #ffffff
});
@@ -1,8 +1,9 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('Dependency Injection Tests', function () {
var expectedMsg;
let expectedMsg: string;
let expectedMsgRx: RegExp;
beforeAll(function () {
browser.get('');
@@ -66,8 +67,8 @@ describe('Dependency Injection Tests', function () {
describe('Tests:', function() {
it('Tests display as expected', function () {
expectedMsg = /Tests passed/;
expect(element(by.css('#tests')).getText()).toMatch(expectedMsg);
expectedMsgRx = /Tests passed/;
expect(element(by.css('#tests')).getText()).toMatch(expectedMsgRx);
});
});
@@ -88,7 +89,7 @@ describe('Dependency Injection Tests', function () {
expectedMsg = 'Hello from logger provided with useClass';
expect(element(by.css('#p3')).getText()).toEqual(expectedMsg);
});
it('P3a (provide) displays as expected', function () {
expectedMsg = 'Hello from logger provided with {provide: Logger, useClass: Logger}';
expect(element(by.css('#p3a')).getText()).toEqual(expectedMsg);
@@ -147,22 +148,22 @@ describe('Dependency Injection Tests', function () {
describe('User/Heroes:', function() {
it('User is Bob - unauthorized', function () {
expectedMsg = /Bob, is not authorized/;
expect(element(by.css('#user')).getText()).toMatch(expectedMsg);
expectedMsgRx = /Bob, is not authorized/;
expect(element(by.css('#user')).getText()).toMatch(expectedMsgRx);
});
it('should have button', function () {
expect(element.all(by.cssContainingText('button','Next User'))
.get(0).isDisplayed()).toBe(true, "'Next User' button should be displayed");
expect(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', function () {
var heroes = element.all(by.css('#unauthorized hero-list div'));
let heroes = element.all(by.css('#unauthorized hero-list div'));
expect(heroes.count()).toBeGreaterThan(0);
});
it('unauthorized user should have no secret heroes', function () {
var heroes = element.all(by.css('#unauthorized hero-list div'));
let heroes = element.all(by.css('#unauthorized hero-list div'));
expect(heroes.count()).toBeGreaterThan(0);
heroes.filter(function(elem, index){
@@ -170,7 +171,7 @@ describe('Dependency Injection Tests', function () {
return /secret/.test(text);
});
}).then(function(filteredElements) {
//console.log("******Secret heroes count: "+filteredElements.length);
// console.log("******Secret heroes count: "+filteredElements.length);
expect(filteredElements.length).toEqual(0);
});
});
@@ -182,22 +183,22 @@ describe('Dependency Injection Tests', function () {
describe('after button click', function() {
beforeAll(function (done) {
var buttonEle = element.all(by.cssContainingText('button','Next User')).get(0);
let buttonEle = element.all(by.cssContainingText('button','Next User')).get(0);
buttonEle.click().then(done,done);
});
it('User is Alice - authorized', function () {
expectedMsg = /Alice, is authorized/;
expect(element(by.css('#user')).getText()).toMatch(expectedMsg);
expectedMsgRx = /Alice, is authorized/;
expect(element(by.css('#user')).getText()).toMatch(expectedMsgRx);
});
it('authorized user should have multiple authorized heroes ', function () {
var heroes = element.all(by.css('#authorized hero-list div'));
let heroes = element.all(by.css('#authorized hero-list div'));
expect(heroes.count()).toBeGreaterThan(0);
});
it('authorized user should have secret heroes', function () {
var heroes = element.all(by.css('#authorized hero-list div'));
let heroes = element.all(by.css('#authorized hero-list div'));
expect(heroes.count()).toBeGreaterThan(0);
heroes.filter(function(elem, index){
@@ -205,7 +206,7 @@ describe('Dependency Injection Tests', function () {
return /secret/.test(text);
});
}).then(function(filteredElements) {
//console.log("******Secret heroes count: "+filteredElements.length);
// console.log("******Secret heroes count: "+filteredElements.length);
expect(filteredElements.length).toBeGreaterThan(0);
});
});
@@ -1,6 +1,7 @@
/// <reference path='../_protractor/e2e.d.ts' />
describe('Displaying Data Tests', function () {
var _title = "Tour of Heroes";
var _defaultHero = 'Windstorm'
let _title = 'Tour of Heroes';
let _defaultHero = 'Windstorm';
beforeAll(function () {
browser.get('');
@@ -15,7 +16,7 @@ describe('Displaying Data Tests', function () {
});
it('should have heroes', function () {
var heroEls = element.all(by.css('li'));
let heroEls = element.all(by.css('li'));
expect(heroEls.count()).not.toBe(0, 'should have heroes');
});
@@ -1,3 +1,4 @@
/// <reference path="../_protractor/e2e.d.ts" />
describeIf(browser.appIsTs || browser.appIsJs, 'Forms Tests', function () {
beforeEach(function () {
@@ -10,51 +11,51 @@ describeIf(browser.appIsTs || browser.appIsJs, 'Forms Tests', function () {
it('should not display message before submit', function () {
var ele = element(by.css('h2'));
let ele = element(by.css('h2'));
expect(ele.isDisplayed()).toBe(false);
});
it('should hide form after submit', function () {
var ele = element.all(by.css('h1')).get(0);
let ele = element.all(by.css('h1')).get(0);
expect(ele.isDisplayed()).toBe(true);
var b = element.all(by.css('button[type=submit]')).get(0);
let b = element.all(by.css('button[type=submit]')).get(0);
b.click().then(function() {
expect(ele.isDisplayed()).toBe(false);
});
});
it('should display message after submit', function () {
var b = element.all(by.css('button[type=submit]')).get(0);
let b = element.all(by.css('button[type=submit]')).get(0);
b.click().then(function() {
expect(element(by.css('h2')).getText()).toContain('You submitted the following');
});
});
it('should hide form after submit', function () {
var alterEgoEle = element.all(by.css('input[ngcontrol=alterEgo]')).get(0);
let alterEgoEle = element.all(by.css('input[ngcontrol=alterEgo]')).get(0);
expect(alterEgoEle.isDisplayed()).toBe(true);
var submitButtonEle = element.all(by.css('button[type=submit]')).get(0);
let submitButtonEle = element.all(by.css('button[type=submit]')).get(0);
submitButtonEle.click().then(function() {
expect(alterEgoEle.isDisplayed()).toBe(false);
})
});
});
it('should reflect submitted data after submit', function () {
var test = 'testing 1 2 3';
var newValue;
var alterEgoEle = element.all(by.css('input[ngcontrol=alterEgo]')).get(0);
let test = 'testing 1 2 3';
let newValue: string;
let alterEgoEle = element.all(by.css('input[ngcontrol=alterEgo]')).get(0);
alterEgoEle.getAttribute('value').then(function(value) {
// alterEgoEle.sendKeys(test);
sendKeys(alterEgoEle, test);
newValue = value + test;
expect(alterEgoEle.getAttribute('value')).toEqual(newValue);
}).then(function() {
var b = element.all(by.css('button[type=submit]')).get(0);
let b = element.all(by.css('button[type=submit]')).get(0);
return b.click();
}).then(function() {
var alterEgoTextEle = element(by.cssContainingText('div', 'Alter Ego'));
let alterEgoTextEle = element(by.cssContainingText('div', 'Alter Ego'));
expect(alterEgoTextEle.isPresent()).toBe(true, 'cannot locate "Alter Ego" label');
var divEle = element(by.cssContainingText('div', newValue));
let divEle = element(by.cssContainingText('div', newValue));
expect(divEle.isPresent()).toBe(true, 'cannot locate div with this text: ' + newValue);
});
});
@@ -1,3 +1,4 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('Hierarchical dependency injection', function () {
beforeEach(function () {
@@ -14,7 +15,7 @@ describe('Hierarchical dependency injection', function () {
});
it('should change to editor view after selection', function () {
var editButtonEle = element.all(by.cssContainingText('button','edit')).get(0);
let editButtonEle = element.all(by.cssContainingText('button','edit')).get(0);
editButtonEle.click().then(function() {
expect(editButtonEle.isDisplayed()).toBe(false, "edit button should be hidden after selection");
})
@@ -29,19 +30,19 @@ describe('Hierarchical dependency injection', function () {
});
function testEdit(shouldSave) {
var inputEle;
let inputEle;
// select 2nd ele
var heroEle = element.all(by.css('heroes-list li')).get(1);
let heroEle = element.all(by.css('heroes-list li')).get(1);
// get the 2nd span which is the name of the hero
var heroNameEle = heroEle.all(by.css('hero-card span')).get(1);
var editButtonEle = heroEle.element(by.cssContainingText('button','edit'));
let heroNameEle = heroEle.all(by.css('hero-card span')).get(1);
let editButtonEle = heroEle.element(by.cssContainingText('button','edit'));
editButtonEle.click().then(function() {
inputEle = heroEle.element(by.css('hero-editor input'));
// return inputEle.sendKeys("foo");
return sendKeys(inputEle, "foo");
}).then(function() {
buttonName = shouldSave ? 'save' : 'cancel';
var buttonEle = heroEle.element(by.cssContainingText('button', buttonName));
let buttonEle = heroEle.element(by.cssContainingText('button', buttonName));
return buttonEle.click();
}).then(function() {
if (shouldSave) {
@@ -1,4 +1,4 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('Homepage Hello World', function () {
beforeAll(function () {
@@ -6,15 +6,15 @@ describe('Homepage Hello World', function () {
});
// Does it even launch?
var expectedLabel = 'Name:';
let expectedLabel = 'Name:';
it('should display the label: ' + expectedLabel, function () {
expect(element(by.css('label')).getText()).toEqual(expectedLabel);
});
it('should display entered name', function () {
var testName = 'Bobby Joe';
var newValue;
var nameEle = element.all(by.css('input')).get(0);
let testName = 'Bobby Joe';
let newValue;
let nameEle = element.all(by.css('input')).get(0);
nameEle.getAttribute('value').then(function(value) {
// nameEle.sendKeys(testName); // should work but doesn't
sendKeys(nameEle, testName); // utility that does work
@@ -22,7 +22,7 @@ describe('Homepage Hello World', function () {
expect(nameEle.getAttribute('value')).toEqual(newValue);
}).then(function() {
// Check the interpolated message built from name
var helloEle = element.all(by.css('h1')).get(0);
let helloEle = element.all(by.css('h1')).get(0);
expect(helloEle.getText()).toEqual('Hello ' + testName + '!');
});
});
@@ -1,4 +1,4 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('Homepage Tabs', function () {
beforeAll(function () {
@@ -6,7 +6,7 @@ describe('Homepage Tabs', function () {
});
// Does it even launch?
var expectedAppTitle = 'Tabs Demo';
let expectedAppTitle = 'Tabs Demo';
it('should display app title: ' + expectedAppTitle, function () {
expect(element(by.css('h4')).getText()).toEqual(expectedAppTitle);
});
@@ -1,4 +1,4 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('Homepage Todo', function () {
beforeAll(function () {
@@ -6,7 +6,7 @@ describe('Homepage Todo', function () {
});
// Does it even launch?
var expectedAppTitle = 'Todo';
let expectedAppTitle = 'Todo';
it('should display app title: ' + expectedAppTitle, function () {
expect(element(by.css('h2')).getText()).toEqual(expectedAppTitle);
});
@@ -1,3 +1,4 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('Lifecycle hooks', function () {
beforeAll(function () {
@@ -9,10 +10,10 @@ describe('Lifecycle hooks', function () {
});
it('should support peek-a-boo', function () {
var pabComp = element(by.css('peek-a-boo-parent peek-a-boo'));
let 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");
var pabButton = element.all(by.css('peek-a-boo-parent button')).get(0);
var updateHeroButton = element.all(by.css('peek-a-boo-parent button')).get(1);
let pabButton = element.all(by.css('peek-a-boo-parent button')).get(0);
let updateHeroButton = element.all(by.css('peek-a-boo-parent button')).get(1);
expect(pabButton.getText()).toContain('Create Peek');
pabButton.click().then(function () {
expect(pabButton.getText()).toContain('Destroy Peek');
@@ -30,12 +31,12 @@ describe('Lifecycle hooks', function () {
});
it('should support OnChanges hook', function () {
var onChangesViewEle = element.all(by.css('on-changes div')).get(0);
var inputEles = element.all(by.css('on-changes-parent input'));
var heroNameInputEle = inputEles.get(1);
var powerInputEle = inputEles.get(0);
var titleEle = onChangesViewEle.element(by.css('p'));
var changeLogEles = onChangesViewEle.all(by.css('div'));
let onChangesViewEle = element.all(by.css('on-changes div')).get(0);
let inputEles = element.all(by.css('on-changes-parent input'));
let heroNameInputEle = inputEles.get(1);
let powerInputEle = inputEles.get(0);
let titleEle = onChangesViewEle.element(by.css('p'));
let changeLogEles = onChangesViewEle.all(by.css('div'));
expect(titleEle.getText()).toContain('Windstorm can sing');
expect(changeLogEles.count()).toEqual(2, "should start with 2 messages");
@@ -54,13 +55,13 @@ describe('Lifecycle hooks', function () {
});
it('should support DoCheck hook', function () {
var doCheckViewEle = element.all(by.css('do-check div')).get(0);
var inputEles = element.all(by.css('do-check-parent input'));
var heroNameInputEle = inputEles.get(1);
var powerInputEle = inputEles.get(0);
var titleEle = doCheckViewEle.element(by.css('p'));
var changeLogEles = doCheckViewEle.all(by.css('div'));
var logCount;
let doCheckViewEle = element.all(by.css('do-check div')).get(0);
let inputEles = element.all(by.css('do-check-parent input'));
let heroNameInputEle = inputEles.get(1);
let powerInputEle = inputEles.get(0);
let titleEle = doCheckViewEle.element(by.css('p'));
let changeLogEles = doCheckViewEle.all(by.css('div'));
let logCount;
expect(titleEle.getText()).toContain('Windstorm can sing');
changeLogEles.count().then(function(count) {
@@ -86,12 +87,12 @@ describe('Lifecycle hooks', function () {
});
it('should support AfterView hooks', function () {
var parentEle = element(by.tagName('after-view-parent'));
var buttonEle = parentEle.element(by.tagName('button')); // Reset
var commentEle = parentEle.element(by.className('comment'));
var logEles = parentEle.all(by.css('h4 ~ div'));
var childViewInputEle = parentEle.element(by.css('my-child input'));
var logCount;
let parentEle = element(by.tagName('after-view-parent'));
let buttonEle = parentEle.element(by.tagName('button')); // Reset
let commentEle = parentEle.element(by.className('comment'));
let logEles = parentEle.all(by.css('h4 ~ div'));
let childViewInputEle = parentEle.element(by.css('my-child input'));
let logCount;
expect(childViewInputEle.getAttribute('value')).toContain('Magneta');
expect(commentEle.isPresent()).toBe(false, 'comment should not be in DOM');
@@ -115,12 +116,12 @@ describe('Lifecycle hooks', function () {
it('should support AfterContent hooks', function () {
var parentEle = element(by.tagName('after-content-parent'));
var buttonEle = parentEle.element(by.tagName('button')); // Reset
var commentEle = parentEle.element(by.className('comment'));
var logEles = parentEle.all(by.css('h4 ~ div'));
var childViewInputEle = parentEle.element(by.css('my-child input'));
var logCount;
let parentEle = element(by.tagName('after-content-parent'));
let buttonEle = parentEle.element(by.tagName('button')); // Reset
let commentEle = parentEle.element(by.className('comment'));
let logEles = parentEle.all(by.css('h4 ~ div'));
let childViewInputEle = parentEle.element(by.css('my-child input'));
let logCount;
expect(childViewInputEle.getAttribute('value')).toContain('Magneta');
expect(commentEle.isPresent()).toBe(false, 'comment should not be in DOM');
@@ -143,11 +144,11 @@ describe('Lifecycle hooks', function () {
});
it('should support spy\'s OnInit & OnDestroy hooks', function () {
var inputEle = element(by.css('spy-parent input'));
var addHeroButtonEle = element(by.cssContainingText('spy-parent button','Add Hero'));
var resetHeroesButtonEle = element(by.cssContainingText('spy-parent button','Reset Heroes'));
var heroEles = element.all(by.css('spy-parent div[mySpy'));
var logEles = element.all(by.css('spy-parent h4 ~ div'));
let inputEle = element(by.css('spy-parent input'));
let addHeroButtonEle = element(by.cssContainingText('spy-parent button','Add Hero'));
let resetHeroesButtonEle = element(by.cssContainingText('spy-parent button','Reset Heroes'));
let heroEles = element.all(by.css('spy-parent div[mySpy'));
let 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');
sendKeys(inputEle, "-test-").then(function() {
@@ -164,10 +165,10 @@ describe('Lifecycle hooks', function () {
});
it('should support "spy counter"', function () {
var updateCounterButtonEle = element(by.cssContainingText('counter-parent button','Update'));
var resetCounterButtonEle = element(by.cssContainingText('counter-parent button','Reset'));
var textEle = element(by.css('counter-parent my-counter > div'));
var logEles = element.all(by.css('counter-parent h4 ~ div'));
let updateCounterButtonEle = element(by.cssContainingText('counter-parent button','Update'));
let resetCounterButtonEle = element(by.cssContainingText('counter-parent button','Reset'));
let textEle = element(by.css('counter-parent my-counter > div'));
let 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');
updateCounterButtonEle.click().then(function() {
+1
View File
@@ -69,6 +69,7 @@
"rimraf": "^2.5.2",
"style-loader": "^0.13.1",
"ts-loader": "^0.8.2",
"ts-node": "^0.7.3",
"typescript": "^1.8.10",
"typings": "^1.0.4",
"webpack": "^1.13.0",
@@ -1,3 +1,4 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('Pipes', function () {
beforeAll(function () {
@@ -23,9 +24,9 @@ describe('Pipes', function () {
});
it('should be able to toggle birthday formats', function () {
var birthDayEle = element(by.css('hero-birthday2 > p'));
let birthDayEle = element(by.css('hero-birthday2 > p'));
expect(birthDayEle.getText()).toEqual("The hero's birthday is 4/15/1988");
var buttonEle = element(by.cssContainingText('hero-birthday2 > button', "Toggle Format"));
let buttonEle = element(by.cssContainingText('hero-birthday2 > button', "Toggle Format"));
expect(buttonEle.isDisplayed()).toBe(true);
buttonEle.click().then(function() {
expect(birthDayEle.getText()).toEqual("The hero's birthday is Friday, April 15, 1988");
@@ -33,7 +34,7 @@ describe('Pipes', function () {
});
it('should be able to chain and compose pipes', function () {
var chainedPipeEles = element.all(by.cssContainingText('my-app p', "The chained hero's"));
let chainedPipeEles = element.all(by.cssContainingText('my-app 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');
@@ -41,15 +42,15 @@ describe('Pipes', function () {
});
it('should be able to use ExponentialStrengthPipe pipe', function () {
var ele = element(by.css('power-booster p'));
let ele = element(by.css('power-booster p'));
expect(ele.getText()).toContain('Super power boost: 1024');
});
it('should be able to use the exponential calculator', function () {
var eles = element.all(by.css('power-boost-calculator input'));
var baseInputEle = eles.get(0);
var factorInputEle = eles.get(1);
var outputEle = element(by.css('power-boost-calculator p'));
let eles = element.all(by.css('power-boost-calculator input'));
let baseInputEle = eles.get(0);
let factorInputEle = eles.get(1);
let outputEle = element(by.css('power-boost-calculator p'));
baseInputEle.clear().then(function() {
return sendKeys(baseInputEle, "7");
}).then(function() {
@@ -63,11 +64,11 @@ describe('Pipes', function () {
it('should support flying heroes (pure) ', function () {
var nameEle = element(by.css('flying-heroes input[type="text"]'));
var canFlyCheckEle = element(by.css('flying-heroes #can-fly'));
var mutateCheckEle = element(by.css('flying-heroes #mutate'));
var resetEle = element(by.css('flying-heroes button'));
var flyingHeroesEle = element.all(by.css('flying-heroes #flyers div'));
let nameEle = element(by.css('flying-heroes input[type="text"]'));
let canFlyCheckEle = element(by.css('flying-heroes #can-fly'));
let mutateCheckEle = element(by.css('flying-heroes #mutate'));
let resetEle = element(by.css('flying-heroes button'));
let flyingHeroesEle = element.all(by.css('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');
@@ -94,11 +95,11 @@ describe('Pipes', function () {
it('should support flying heroes (impure) ', function () {
var nameEle = element(by.css('flying-heroes-impure input[type="text"]'));
var canFlyCheckEle = element(by.css('flying-heroes-impure #can-fly'));
var mutateCheckEle = element(by.css('flying-heroes-impure #mutate'));
var resetEle = element(by.css('flying-heroes-impure button'));
var flyingHeroesEle = element.all(by.css('flying-heroes-impure #flyers div'));
let nameEle = element(by.css('flying-heroes-impure input[type="text"]'));
let canFlyCheckEle = element(by.css('flying-heroes-impure #can-fly'));
let mutateCheckEle = element(by.css('flying-heroes-impure #mutate'));
let resetEle = element(by.css('flying-heroes-impure button'));
let flyingHeroesEle = element.all(by.css('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');
@@ -1,7 +1,7 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('QuickStart E2E Tests', function () {
var expectedMsg = 'My First Angular 2 App';
let expectedMsg = 'My First Angular 2 App';
beforeEach(function () {
@@ -1,123 +1,111 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('Router', function () {
beforeAll(function () {
browser.get('');
});
function getPageStruct() {
hrefEles = element.all(by.css('my-app a'));
return {
hrefs: hrefEles,
routerParent: element(by.css('my-app > undefined')),
routerTitle: element(by.css('my-app > undefined > h2')),
crisisHref: hrefEles.get(0),
crisisList: element.all(by.css('my-app > undefined > undefined li')),
crisisDetail: element(by.css('my-app > undefined > undefined > div')),
crisisDetailTitle: element(by.css('my-app > undefined > undefined > div > h3')),
heroesHref: hrefEles.get(1),
heroesList: element.all(by.css('my-app > undefined li')),
heroDetail: element(by.css('my-app > undefined > div')),
heroDetailTitle: element(by.css('my-app > undefined > div > h3')),
beforeAll(function () {
browser.get('');
});
function getPageStruct() {
hrefEles = element.all(by.css('my-app a'));
return {
hrefs: hrefEles,
routerParent: element(by.css('my-app > undefined')),
routerTitle: element(by.css('my-app > undefined > h2')),
crisisHref: hrefEles.get(0),
crisisList: element.all(by.css('my-app > undefined > undefined li')),
crisisDetail: element(by.css('my-app > undefined > undefined > div')),
crisisDetailTitle: element(by.css('my-app > undefined > undefined > div > h3')),
heroesHref: hrefEles.get(1),
heroesList: element.all(by.css('my-app > undefined li')),
heroDetail: element(by.css('my-app > undefined > div')),
heroDetailTitle: element(by.css('my-app > undefined > div > h3')),
};
}
}
it('should be able to see the start screen', function () {
var page = getPageStruct();
expect(page.hrefs.count()).toEqual(2, 'should be two dashboard choices');
expect(page.crisisHref.getText()).toEqual("Crisis Center");
expect(page.heroesHref.getText()).toEqual("Heroes");
});
it('should be able to see crises center items', function () {
var page = getPageStruct();
expect(page.crisisList.count()).toBe(4, "should be 4 crisis center entries at start");
});
it('should be able to see hero items', function () {
var page = getPageStruct();
page.heroesHref.click().then(function() {
expect(page.routerTitle.getText()).toContain('HEROES');
expect(page.heroesList.count()).toBe(6, "should be 6 heroes");
it('should be able to see the start screen', function () {
var page = getPageStruct();
expect(page.hrefs.count()).toEqual(2, 'should be two dashboard choices');
expect(page.crisisHref.getText()).toEqual("Crisis Center");
expect(page.heroesHref.getText()).toEqual("Heroes");
});
});
it('should be able to toggle the views', function () {
var 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('should be able to see crises center items', function () {
var page = getPageStruct();
expect(page.crisisList.count()).toBe(4, "should be 4 crisis center entries at start");
});
});
it('should be able to edit and save details from the crisis center view', function () {
crisisCenterEdit(2, true);
});
it('should be able to edit and cancel details from the crisis center view', function () {
crisisCenterEdit(3, false);
});
it('should be able to edit and save details from the heroes view', function () {
var page = getPageStruct();
var heroEle, heroText;
page.heroesHref.click().then(function() {
heroEle = page.heroesList.get(4);
return heroEle.getText();
}).then(function(text) {
expect(text.length).toBeGreaterThan(0, 'should have some text');
// 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');
expect(page.heroDetailTitle.getText()).toContain(heroText);
var inputEle = page.heroDetail.element(by.css('input'));
return sendKeys(inputEle, '-foo');
}).then(function() {
expect(page.heroDetailTitle.getText()).toContain(heroText + '-foo');
var buttonEle = page.heroDetail.element(by.css('button'));
return buttonEle.click();
}).then(function() {
expect(heroEle.getText()).toContain(heroText + '-foo');
})
});
function crisisCenterEdit(index, shouldSave) {
var page = getPageStruct();
var crisisEle, crisisText;
page.crisisHref.click()
.then(function () {
crisisEle = page.crisisList.get(index);
return crisisEle.getText();
}).then(function (text) {
expect(text.length).toBeGreaterThan(0, 'should have some text');
// remove leading id from text
crisisText = text.substr(text.indexOf(' ')).trim();
return crisisEle.click();
}).then(function () {
expect(page.crisisList.count()).toBe(0, "should no longer see crisis center entries");
expect(page.crisisDetail.isPresent()).toBe(true, 'should be able to see crisis detail');
expect(page.crisisDetailTitle.getText()).toContain(crisisText);
var inputEle = page.crisisDetail.element(by.css('input'));
return sendKeys(inputEle, '-foo');
}).then(function () {
expect(page.crisisDetailTitle.getText()).toContain(crisisText + '-foo');
var buttonEle = page.crisisDetail.element(by.cssContainingText('button', shouldSave ? 'Save' : 'Cancel'));
return buttonEle.click();
}).then(function () {
if (shouldSave) {
expect(crisisEle.getText()).toContain(crisisText + '-foo');
} else {
expect(crisisEle.getText()).not.toContain(crisisText + '-foo');
}
it('should be able to see hero items', function () {
var page = getPageStruct();
page.heroesHref.click().then(function () {
expect(page.routerTitle.getText()).toContain('HEROES');
expect(page.heroesList.count()).toBe(6, "should be 6 heroes");
});
});
}
it('should be able to toggle the views', function () {
var 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('should be able to edit and save details from the crisis center view', function () {
crisisCenterEdit(2, true);
});
it('should be able to edit and cancel details from the crisis center view', function () {
crisisCenterEdit(3, false);
});
it('should be able to edit and save details from the heroes view', function () {
var page = getPageStruct();
var heroEle, heroText;
page.heroesHref.click().then(function () {
heroEle = page.heroesList.get(4);
return heroEle.getText();
}).then(function (text) {
expect(text.length).toBeGreaterThan(0, 'should have some text');
// 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');
expect(page.heroDetailTitle.getText()).toContain(heroText);
var inputEle = page.heroDetail.element(by.css('input'));
return sendKeys(inputEle, '-foo');
}).then(function () {
expect(page.heroDetailTitle.getText()).toContain(heroText + '-foo');
var buttonEle = page.heroDetail.element(by.css('button'));
return buttonEle.click();
}).then(function () {
expect(heroEle.getText()).toContain(heroText + '-foo');
});
});
function crisisCenterEdit(index, shouldSave) {
var page = getPageStruct();
var crisisEle, crisisText;
page.crisisHref.click()
.then(function () {
crisisEle = page.crisisList.get(index);
return crisisEle.getText();
}).then(function (text) {
expect(text.length).toBeGreaterThan(0, 'should have some text');
// remove leading id from text
crisisText = text.substr(text.indexOf(' ')).trim();
return crisisEle.click();
}).then(function () {
expect(page.crisisList.count()).toBe(0, "should no longer see crisis center entries");
expect(page.crisisDetail.isPresent()).toBe(true, 'should be able to see crisis detail');
expect(page.crisisDetailTitle.getText()).toContain(crisisText);
var inputEle = page.crisisDetail.element(by.css('input'));
return sendKeys(inputEle, '-foo');
}).then(function () {
expect(page.crisisDetailTitle.getText()).toContain(crisisText + '-foo');
var buttonEle = page.crisisDetail.element(by.cssContainingText('button', shouldSave ? 'Save' : 'Cancel'));
return buttonEle.click();
}).then(function () {
if (shouldSave) {
expect(crisisEle.getText()).toContain(crisisText + '-foo');
}
else {
expect(crisisEle.getText()).not.toContain(crisisText + '-foo');
}
});
}
});
//# sourceMappingURL=e2e-spec.js.map
@@ -0,0 +1,124 @@
/// <reference path="../_protractor/e2e.d.ts" />
describe('Router', function () {
beforeAll(function () {
browser.get('');
});
function getPageStruct() {
hrefEles = element.all(by.css('my-app a'));
return {
hrefs: hrefEles,
routerParent: element(by.css('my-app > undefined')),
routerTitle: element(by.css('my-app > undefined > h2')),
crisisHref: hrefEles.get(0),
crisisList: element.all(by.css('my-app > undefined > undefined li')),
crisisDetail: element(by.css('my-app > undefined > undefined > div')),
crisisDetailTitle: element(by.css('my-app > undefined > undefined > div > h3')),
heroesHref: hrefEles.get(1),
heroesList: element.all(by.css('my-app > undefined li')),
heroDetail: element(by.css('my-app > undefined > div')),
heroDetailTitle: element(by.css('my-app > undefined > div > h3')),
}
}
it('should be able to see the start screen', function () {
let page = getPageStruct();
expect(page.hrefs.count()).toEqual(2, 'should be two dashboard choices');
expect(page.crisisHref.getText()).toEqual("Crisis Center");
expect(page.heroesHref.getText()).toEqual("Heroes");
});
it('should be able to see crises center items', function () {
let page = getPageStruct();
expect(page.crisisList.count()).toBe(4, "should be 4 crisis center entries at start");
});
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('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('should be able to edit and save details from the crisis center view', function () {
crisisCenterEdit(2, true);
});
it('should be able to edit and cancel details from the crisis center view', function () {
crisisCenterEdit(3, false);
});
it('should be able to edit and save details from the heroes view', function () {
let page = getPageStruct();
let heroEle, heroText;
page.heroesHref.click().then(function() {
heroEle = page.heroesList.get(4);
return heroEle.getText();
}).then(function(text) {
expect(text.length).toBeGreaterThan(0, 'should have some text');
// 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');
expect(page.heroDetailTitle.getText()).toContain(heroText);
let inputEle = page.heroDetail.element(by.css('input'));
return sendKeys(inputEle, '-foo');
}).then(function() {
expect(page.heroDetailTitle.getText()).toContain(heroText + '-foo');
let buttonEle = page.heroDetail.element(by.css('button'));
return buttonEle.click();
}).then(function() {
expect(heroEle.getText()).toContain(heroText + '-foo');
})
});
function crisisCenterEdit(index, shouldSave) {
let page = getPageStruct();
let crisisEle, crisisText;
page.crisisHref.click()
.then(function () {
crisisEle = page.crisisList.get(index);
return crisisEle.getText();
}).then(function (text) {
expect(text.length).toBeGreaterThan(0, 'should have some text');
// remove leading id from text
crisisText = text.substr(text.indexOf(' ')).trim();
return crisisEle.click();
}).then(function () {
expect(page.crisisList.count()).toBe(0, "should no longer see crisis center entries");
expect(page.crisisDetail.isPresent()).toBe(true, 'should be able to see crisis detail');
expect(page.crisisDetailTitle.getText()).toContain(crisisText);
let inputEle = page.crisisDetail.element(by.css('input'));
return sendKeys(inputEle, '-foo');
}).then(function () {
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');
} else {
expect(crisisEle.getText()).not.toContain(crisisText + '-foo');
}
});
}
});

Some files were not shown because too many files have changed in this diff Show More