javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

test(app): assert that status bar padding is present, refactor app/cordova test

Browse Source
This commit is contained in:
Dan Bucholtz
2018-01-04 16:45:35 -06:00
parent 7f8cf42773
commit e8d7c6751f
13 changed files with 298 additions and 370 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
packages/core/scripts/e2e/utils.js Normal file
View File

@@ -0,0 +1,27 @@
const { By, until } = require('selenium-webdriver');
async function getElement(driver, selector) {
driver.wait(until.elementLocated(By.css(selector)));
const element = driver.findElement(By.css(selector));
await driver.wait(until.elementIsVisible(driver.findElement(By.css(selector))));
return element;
}
async function waitAndGetElementById(driver, selector) {
driver.wait(until.elementLocated(By.id(selector)));
const element = driver.findElement(By.id(selector));
await driver.wait(until.elementIsVisible(driver.findElement(By.id(selector))));
return element;
}
function waitForTransition(duration) {
return new Promise(resolve => {
setTimeout(resolve, duration);
})
}
module.exports = {
getElement: getElement,
waitForTransition: waitForTransition,
waitAndGetElementById: waitAndGetElementById
}

18
packages/core/src/components/app/test/cordova/bootstrap.js vendored
View File

@@ -1,18 +0,0 @@
export async function bootstrap() {
const nav = document.querySelector('ion-nav');
await nav.componentOnReady();
const pageOneModule = await import('./page-one.js');
const pageOne = new pageOneModule.PageOne(nav);
nav.push(pageOne.getElement()).then(() => {
pageOne.initialize();
});
}
// IDK, it errors out sometimes if I bootstrap right away
setTimeout(() => {
bootstrap()
}, 250);

54
packages/core/src/components/app/test/cordova/e2e.js vendored Normal file
View File

@@ -0,0 +1,54 @@
'use strict';
const { register, Page, platforms } = require('../../../../../scripts/e2e');
const { getElement, waitForTransition } = require('../../../../../scripts/e2e/utils');
const expect = require('chai').expect;
class E2ETestPage extends Page {
constructor(driver, platform) {
super(driver, `http://localhost:3333/src/components/app/test/cordova?ionicplatform=${platform}`);
}
}
platforms.forEach(platform => {
describe('app/cordova', () => {
register('should init', driver => {
const page = new E2ETestPage(driver, platform);
return page.navigate();
});
register('should have status bar padding for all pages', async (driver, testContext) => {
testContext.timeout(10000);
const page = new E2ETestPage(driver, platform);
await waitForTransition(200);
const pageOneToolbarSelector = 'page-one ion-toolbar';
const pageOneToolbar = await getElement(driver, pageOneToolbarSelector);
const paddingTopPageOne = await pageOneToolbar.getCssValue('padding-top');
if (platform === 'ios') {
expect(paddingTopPageOne).to.equal('24px');
} else {
expect(paddingTopPageOne).to.equal('24px');
}
// navigate to a second page just to verify it's working and still has padding
const pageOneNextButtonSelector = 'page-one ion-button.next';
const pageOneNextButton = await getElement(driver, pageOneNextButtonSelector);
await pageOneNextButton.click();
await waitForTransition(600);
const pageTwoToolbarSelector = 'page-two ion-toolbar';
const pageTwoToolbar = await getElement(driver, pageTwoToolbarSelector);
const paddingTopPageTwo = await pageTwoToolbar.getCssValue('padding-top');
if (platform === 'ios') {
expect(paddingTopPageTwo).to.equal('24px');
} else {
expect(paddingTopPageTwo).to.equal('24px');
}
});
});
});

166
packages/core/src/components/app/test/cordova/index.html
View File

@@ -9,7 +9,7 @@
window.Ionic.config = { statusbarPadding: true };
</script>
</head>
<body>
<body onload="initialize()">
<ion-app>
<ion-menu side="left">
@@ -53,12 +53,170 @@
</ion-menu>
<ion-nav main></ion-nav>
<ion-nav></ion-nav>
<ion-nav-controller></ion-nav-controller>
</ion-app>
<ion-menu-controller></ion-menu-controller>
<script>
<script type="module" src="cordova/bootstrap.js"></script>
async function initialize() {
const nav = document.querySelector('ion-nav');
await nav.componentOnReady();
await nav.setRoot('page-one');
}
class PageOne extends HTMLElement {
async connectedCallback() {
this.innerHTML = `
<ion-header>
<ion-toolbar color='primary'>
<ion-buttons slot='start'>
<ion-button><ion-icon slot='icon-only' name='menu'></ion-icon></ion-button>
</ion-buttons>
<ion-segment color='light'>
<ion-segment-button checked>All</ion-segment-button>
<ion-segment-button>Favorites</ion-segment-button>
</ion-segment>
<ion-buttons slot='end'>
<ion-button><ion-icon slot='icon-only' name='search'></ion-icon></ion-button>
<ion-button><ion-icon slot='icon-only' name='menu'></ion-icon></ion-button>
</ion-buttons>
</ion-toolbar>
<ion-toolbar>
<ion-title>I'm a toolbar</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
<ion-button expand='block' class='e2eCordovaPage2 next'>Go to Page Two</ion-button>
<ion-button color='secondary' expand='block' class='e2eCordovaPage2 tabs'>Go to Tabs</ion-button>
<div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
<div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
<div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
</ion-content>`;
const pageTwoButton = this.querySelector('ion-button.next');
pageTwoButton.addEventListener('click', async () => {
// okay, go to page two
await this.closest('ion-nav').push('page-two');
});
const tabsButton = this.querySelector('ion-button.tabs');
tabsButton.addEventListener('click', async () => {
await this.closest('ion-nav').setRoot('tabs-page');
});
}
}
class PageTwo extends HTMLElement {
async connectedCallback() {
this.innerHTML = `
<ion-header>
<ion-toolbar>
<ion-title>Page Two</ion-title>
<ion-buttons slot='end'>
<ion-button><ion-icon slot='icon-only' name='filter'></ion-icon></ion-button>
</ion-buttons>
</ion-toolbar>
<ion-toolbar>
Hello I am a sub header, with no border on top
</ion-toolbar>
</ion-header>
<ion-content>
<div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
<ion-button expand='block' class="back">Go Back</ion-button>
<ion-button expand='block' class='next e2eCordovaPage3'>Go to Page Three</ion-button>
<ion-button expand='block' color='secondary' class='e2eCordovaOpenModal modal'>Open Modal</ion-button>
</ion-content>
`;
const backButton = this.querySelector('ion-button.back');
backButton.addEventListener('click', async () => {
await this.closest('ion-nav').pop();
});
const nextButton = this.querySelector('ion-button.next');
nextButton.addEventListener('click', async () => {
await this.closest('ion-nav').push('page-three');
});
const modalButton = this.querySelector('ion-button.modal');
modalButton.addEventListener('click', () => {
alert('This is a problem for future Ionic team, let\'s let those comrades deal with it.');
});
}
}
class PageThree extends HTMLElement {
async connectedCallback() {
this.innerHTML = `
<ion-content>
<h2>Page 3</h2>
<div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
<ion-button class='e2eCordovaGoBack back'>Go Back</ion-button>
</ion-content>
<ion-footer>
<ion-toolbar>
<ion-title>I'm a bottom toolbar</ion-title>
</ion-toolbar>
</ion-footer>
`;
const backButton = this.querySelector('ion-button.back');
backButton.addEventListener('click', async () => {
await this.closest('ion-nav').pop();
});
}
}
class TabsPage extends HTMLElement {
async connectedCallback() {
this.innerHTML = `
<ion-tabs>
<ion-tab title='Page 1' icon='chatboxes' class='tab-one'>
<ion-nav class="tab-one-nav"></ion-nav>
</ion-tab>
<ion-tab title='Page 2' icon='map' class='tab-two'>
<ion-nav class="tab-two-nav"></ion-nav>
</ion-tab>
<ion-tab title='Page 3' icon='person' class='tab-three'>
<ion-nav class="tab-three-nav"></ion-nav>
</ion-tab>
</ion-tabs>
`;
const navOne = this.querySelector('ion-tab.tab-one ion-nav');
await navOne.componentOnReady();
await navOne.setRoot('page-one');
const navTwo = this.querySelector('ion-tab.tab-two ion-nav');
await navTwo.componentOnReady();
await navTwo.setRoot('page-two');
const navThree = this.querySelector('ion-tab.tab-three ion-nav');
await navThree.componentOnReady();
await navThree.setRoot('page-three');
}
}
customElements.define('page-one', PageOne);
customElements.define('page-two', PageTwo);
customElements.define('page-three', PageThree);
customElements.define('tabs-page', TabsPage);
</script>
</body>
</html>

69
packages/core/src/components/app/test/cordova/page-one.js vendored
View File

@@ -1,69 +0,0 @@
export class PageOne {
constructor(nav) {
this.nav = nav;
}
getElement() {
const element = document.createElement('div');
element.innerHTML = `
<ion-header>
<ion-toolbar color='primary'>
<ion-buttons slot='start'>
<ion-button><ion-icon slot='icon-only' name='menu'></ion-icon></ion-button>
</ion-buttons>
<ion-segment color='light'>
<ion-segment-button checked>All</ion-segment-button>
<ion-segment-button>Favorites</ion-segment-button>
</ion-segment>
<ion-buttons slot='end'>
<ion-button><ion-icon slot='icon-only' name='search'></ion-icon></ion-button>
<ion-button><ion-icon slot='icon-only' name='menu'></ion-icon></ion-button>
</ion-buttons>
</ion-toolbar>
<ion-toolbar>
<ion-title>I'm a toolbar</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
<ion-button expand='block' class='e2eCordovaPage2 next'>Go to Page Two</ion-button>
<ion-button color='secondary' expand='block' class='e2eCordovaPage2 tabs'>Go to Tabs</ion-button>
<div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
<div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
<div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
</ion-content>
`;
this.element = element;
return element;
}
initialize() {
const pageTwoButton = this.element.querySelector('ion-button .next');
pageTwoButton.addEventListener('click', async () => {
// okay, go to page two
const pageTwoModule = await import('./page-two.js');
const pageTwo = new pageTwoModule.PageTwo(this.nav);
await this.nav.push(pageTwo.getElement());
// okay, the page is pushed, initialize it
pageTwo.initialize();
});
const tabsButton = this.element.querySelector('ion-button .tabs');
tabsButton.addEventListener('click', async () => {
// okay, go to page two
const tabsPageModule = await import('./tabs-page.js');
const tabsPage = new tabsPageModule.TabsPage(this.nav);
await this.nav.setRoot(tabsPage.getElement());
// okay, the page is pushed, initialize it
await tabsPage.initialize();
});
}
}

35
packages/core/src/components/app/test/cordova/page-three.js vendored
View File

@@ -1,35 +0,0 @@
export class PageThree {
constructor(nav) {
this.nav = nav;
}
getElement() {
const element = document.createElement('div');
element.innerHTML = `
<ion-content>
<h2>Page 3</h2>
<div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
<ion-button class='e2eCordovaGoBack back'>Go Back</ion-button>
</ion-content>
<ion-footer>
<ion-toolbar>
<ion-title>I'm a bottom toolbar</ion-title>
</ion-toolbar>
</ion-footer>
`;
this.element = element;
return element;
}
initialize() {
const backButton = this.element.querySelector('ion-button .back');
backButton.addEventListener('click', async () => {
await this.nav.pop();
});
}
}

55
packages/core/src/components/app/test/cordova/page-two.js vendored
View File

@@ -1,55 +0,0 @@
export class PageTwo {
constructor(nav) {
this.nav = nav;
}
getElement() {
const element = document.createElement('div');
element.innerHTML = `
<ion-header>
<ion-toolbar>
<ion-title>Page Two</ion-title>
<ion-buttons slot='end'>
<ion-button><ion-icon slot='icon-only' name='filter'></ion-icon></ion-button>
</ion-buttons>
</ion-toolbar>
<ion-toolbar>
Hello I am a sub header, with no border on top
</ion-toolbar>
</ion-header>
<ion-content>
<div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
<ion-button expand='block' class="back">Go Back</ion-button>
<ion-button expand='block' class='next e2eCordovaPage3'>Go to Page Three</ion-button>
<ion-button expand='block' color='secondary' class='e2eCordovaOpenModal modal'>Open Modal</ion-button>
</ion-content>
`;
this.element = element;
return element;
}
initialize() {
const backButton = this.element.querySelector('ion-button .back');
backButton.addEventListener('click', async () => {
await this.nav.pop();
});
const nextButton = this.element.querySelector('ion-button .next');
nextButton.addEventListener('click', async () => {
const pageThreeModule = await import('./page-three.js');
const pageThree = new pageThreeModule.PageThree(this.nav);
await this.nav.push(pageThree.getElement());
// okay, the page is pushed, initialize it
pageThree.initialize();
});
const modalButton = this.element.querySelector('ion-button .modal');
modalButton.addEventListener('click', () => {
alert('This is a problem for future Ionic team, let\'s let those comrades dal with it.');
});
}
}

48
packages/core/src/components/app/test/cordova/tabs-page.js vendored
View File

@@ -1,48 +0,0 @@
export class TabsPage {
constructor(nav) {
this.nav = nav;
}
getElement() {
const element = document.createElement('div');
element.innerHTML = `
<ion-tabs>
<ion-tab title='Page 1' icon='chatboxes' class='tab-one'>
<ion-nav class="tab-one-nav"></ion-nav>
</ion-tab>
<ion-tab title='Page 2' icon='map' class='tab-two'>
<ion-nav class="tab-two-nav"></ion-nav>
</ion-tab>
<ion-tab title='Page 3' icon='person' class='tab-three'>
<ion-nav class="tab-three-nav"></ion-nav>
</ion-tab>
</ion-tabs>
`;
this.element = element;
return element;
}
async initialize() {
const navOne = this.element.querySelector('ion-tab.tab-one ion-nav');
await navOne.componentOnReady();
const pageOneModule = await import('./page-one.js');;
const pageOne = new pageOneModule.PageOne(navOne);
await navOne.setRoot(pageOne.getElement());
const navTwo = this.element.querySelector('ion-tab.tab-two ion-nav');
await navTwo.componentOnReady();
const pageTwoModule = await import('./page-two.js');;
const pageTwo = new pageTwoModule.PageTwo(navTwo);
await navTwo.setRoot(pageTwo.getElement());
const navThree = this.element.querySelector('ion-tab.tab-three ion-nav');
await navThree.componentOnReady();
const pageThreeModule = await import('./page-three.js');;
const pageThree = new pageThreeModule.PageThree(navThree);
await navThree.setRoot(pageThree.getElement());
}
}

15
packages/core/src/components/nav/test/basic/e2e.js
View File

@@ -1,7 +1,7 @@
'use strict';
const { By, until } = require('selenium-webdriver');
const { register, Page, platforms } = require('../../../../../scripts/e2e');
const { getElement, waitForTransition } = require('../../../../../scripts/e2e/utils');
class E2ETestPage extends Page {
constructor(driver, platform) {
@@ -50,16 +50,3 @@ platforms.forEach(platform => {
});
});
});
async function getElement(driver, selector) {
driver.wait(until.elementLocated(By.css(selector)));
const element = driver.findElement(By.css(selector));
await driver.wait(until.elementIsVisible(driver.findElement(By.css(selector))));
return element;
}
function waitForTransition(duration) {
return new Promise(resolve => {
setTimeout(resolve, duration);
})
}

91
packages/core/src/components/nav/test/simple-nested-navs/e2e.js
View File

@@ -1,8 +1,8 @@
'use strict';
const { By, until } = require('selenium-webdriver');
const expect = require('chai').expect;
const { register, Page, platforms } = require('../../../../../scripts/e2e');
const { getElement, waitForTransition } = require('../../../../../scripts/e2e/utils');
class E2ETestPage extends Page {
constructor(driver, platform) {
@@ -26,44 +26,44 @@ platforms.forEach(platform => {
console.log('On Nav One Page One');
const navOnePageOneNextButtonSelector = '.nav-one-page-one ion-button.next.hydrated';
const navOnePageOneNextButton = await waitAndGetElement(driver, navOnePageOneNextButtonSelector);
const navOnePageOneNextButton = await getElement(driver, navOnePageOneNextButtonSelector);
navOnePageOneNextButton.click();
await waitForTransition(600);
console.log('On Nav One Page Two');
const navOnePageTwoNextButtonSelector = '.nav-one-page-two ion-button.next.hydrated';
const navOnePageTwoNextButton = await waitAndGetElement(driver, navOnePageTwoNextButtonSelector);
const navOnePageTwoNextButton = await getElement(driver, navOnePageTwoNextButtonSelector);
navOnePageTwoNextButton.click();
await waitForTransition(600);
console.log('On Nav Two Page One');
const navTwoPageOneNextButtonSelector = '.nav-two-page-one ion-button.next.nav-one.hydrated';
const navTwoPageOneNextButton = await waitAndGetElement(driver, navTwoPageOneNextButtonSelector);
const navTwoPageOneNextButton = await getElement(driver, navTwoPageOneNextButtonSelector);
navTwoPageOneNextButton.click();
await waitForTransition(600);
console.log('On Nav One Page Three');
const navOnePageThreePreviousButtonSelector = '.nav-one-page-three ion-button.previous.hydrated';
const navOnePageThreePreviousButton = await waitAndGetElement(driver, navOnePageThreePreviousButtonSelector);
const navOnePageThreePreviousButton = await getElement(driver, navOnePageThreePreviousButtonSelector);
navOnePageThreePreviousButton.click();
await waitForTransition(600);
console.log('On Nav Two Page One');
const navTwoPageOnePreviousButtonSelector = '.nav-two-page-one ion-button.previous.nav-one.hydrated';
const navTwoPageOnePreviousButton = await waitAndGetElement(driver, navTwoPageOnePreviousButtonSelector);
const navTwoPageOnePreviousButton = await getElement(driver, navTwoPageOnePreviousButtonSelector);
navTwoPageOnePreviousButton.click();
await waitForTransition(600);
console.log('On Nav One Page Two');
const navOnePageTwoPreviousButtonSelector = '.nav-one-page-two ion-button.previous.hydrated';
const navOnePageTwoPreviousButton = await waitAndGetElement(driver, navOnePageTwoPreviousButtonSelector);
const navOnePageTwoPreviousButton = await getElement(driver, navOnePageTwoPreviousButtonSelector);
navOnePageTwoPreviousButton.click();
await waitForTransition(600);
console.log('On Nav One Page One');
const navOnePageOneSelector = '.nav-one-page-one';
const navOnePageOne = await waitAndGetElement(driver, navOnePageOneSelector);
const navOnePageOne = await getElement(driver, navOnePageOneSelector);
});
@@ -76,68 +76,68 @@ platforms.forEach(platform => {
console.log('On Nav One Page One');
const navOnePageOneNextButtonSelector = '.nav-one-page-one ion-button.next.hydrated';
const navOnePageOneNextButton = await waitAndGetElement(driver, navOnePageOneNextButtonSelector);
const navOnePageOneNextButton = await getElement(driver, navOnePageOneNextButtonSelector);
navOnePageOneNextButton.click();
await waitForTransition(600);
console.log('On Nav One Page Two');
const navOnePageTwoNextButtonSelector = '.nav-one-page-two ion-button.next.hydrated';
const navOnePageTwoNextButton = await waitAndGetElement(driver, navOnePageTwoNextButtonSelector);
const navOnePageTwoNextButton = await getElement(driver, navOnePageTwoNextButtonSelector);
navOnePageTwoNextButton.click();
await waitForTransition(600);
console.log('On Nav Two Page One');
const navTwoPageOneNextButtonSelector = '.nav-two-page-one ion-button.next.nav-two.hydrated';
const navTwoPageOneNextButton = await waitAndGetElement(driver, navTwoPageOneNextButtonSelector);
const navTwoPageOneNextButton = await getElement(driver, navTwoPageOneNextButtonSelector);
navTwoPageOneNextButton.click();
await waitForTransition(600);
console.log('On Nav Two Page Two');
const navTwoPageTwoNextButtonSelector = '.nav-two-page-two ion-button.next.hydrated';
const navTwoPageTwoNextButton = await waitAndGetElement(driver, navTwoPageTwoNextButtonSelector);
const navTwoPageTwoNextButton = await getElement(driver, navTwoPageTwoNextButtonSelector);
navTwoPageTwoNextButton.click();
await waitForTransition(600);
console.log('On Nav Three Page One');
const navThreePageOneNextButtonSelector = '.nav-three-page-one ion-button.next.nav-two.hydrated';
const navThreePageOneNextButton = await waitAndGetElement(driver, navThreePageOneNextButtonSelector);
const navThreePageOneNextButton = await getElement(driver, navThreePageOneNextButtonSelector);
navThreePageOneNextButton.click();
await waitForTransition(600);
console.log('On Nav Two Page Three');
const navTwoPageThreePreviousButtonSelector = '.nav-two-page-three ion-button.previous.hydrated';
const navTwoPageThreePreviousButton = await waitAndGetElement(driver, navTwoPageThreePreviousButtonSelector);
const navTwoPageThreePreviousButton = await getElement(driver, navTwoPageThreePreviousButtonSelector);
navTwoPageThreePreviousButton.click();
await waitForTransition(600);
console.log('On Nav Three Page One');
const navThreePageOnePreviousButtonSelector = '.nav-three-page-one ion-button.previous.nav-two.hydrated';
const navThreePageOnePreviousButton = await waitAndGetElement(driver, navThreePageOnePreviousButtonSelector);
const navThreePageOnePreviousButton = await getElement(driver, navThreePageOnePreviousButtonSelector);
navThreePageOnePreviousButton.click();
await waitForTransition(600);
console.log('On Nav Two Page Two');
const navTwoPageTwoPreviousButtonSelector = '.nav-two-page-two ion-button.previous.hydrated';
const navTwoPageTwoPreviousButton = await waitAndGetElement(driver, navTwoPageTwoPreviousButtonSelector);
const navTwoPageTwoPreviousButton = await getElement(driver, navTwoPageTwoPreviousButtonSelector);
navTwoPageTwoPreviousButton.click();
await waitForTransition(600);
console.log('On Nav Two Page One');
const navTwoPageOnePreviousButtonSelector = '.nav-two-page-one ion-button.previous.nav-one.hydrated';
const navTwoPageOnePreviousButton = await waitAndGetElement(driver, navTwoPageOnePreviousButtonSelector);
const navTwoPageOnePreviousButton = await getElement(driver, navTwoPageOnePreviousButtonSelector);
navTwoPageOnePreviousButton.click();
await waitForTransition(600);
console.log('On Nav One Page Two');
const navOnePageTwoPreviousButtonSelector = '.nav-one-page-two ion-button.previous.hydrated';
const navOnePageTwoPreviousButton = await waitAndGetElement(driver, navOnePageTwoPreviousButtonSelector);
const navOnePageTwoPreviousButton = await getElement(driver, navOnePageTwoPreviousButtonSelector);
navOnePageTwoPreviousButton.click();
await waitForTransition(600);
console.log('On Nav One Page One');
const navOnePageOneSelector = '.nav-one-page-one';
const navOnePageOne = await waitAndGetElement(driver, navOnePageOneSelector);
const navOnePageOne = await getElement(driver, navOnePageOneSelector);
});
@@ -150,43 +150,43 @@ platforms.forEach(platform => {
console.log('On Nav One Page One');
const navOnePageOneNextButtonSelector = '.nav-one-page-one ion-button.next.hydrated';
const navOnePageOneNextButton = await waitAndGetElement(driver, navOnePageOneNextButtonSelector);
const navOnePageOneNextButton = await getElement(driver, navOnePageOneNextButtonSelector);
navOnePageOneNextButton.click();
await waitForTransition(600);
console.log('On Nav One Page Two');
const navOnePageTwoNextButtonSelector = '.nav-one-page-two ion-button.next.hydrated';
const navOnePageTwoNextButton = await waitAndGetElement(driver, navOnePageTwoNextButtonSelector);
const navOnePageTwoNextButton = await getElement(driver, navOnePageTwoNextButtonSelector);
navOnePageTwoNextButton.click();
await waitForTransition(600);
console.log('On Nav Two Page One');
const navTwoPageOneNextButtonSelector = '.nav-two-page-one ion-button.next.nav-two.hydrated';
const navTwoPageOneNextButton = await waitAndGetElement(driver, navTwoPageOneNextButtonSelector);
const navTwoPageOneNextButton = await getElement(driver, navTwoPageOneNextButtonSelector);
navTwoPageOneNextButton.click();
await waitForTransition(600);
console.log('On Nav Two Page Two');
const navTwoPageTwoNextButtonSelector = '.nav-two-page-two ion-button.next.hydrated';
const navTwoPageTwoNextButton = await waitAndGetElement(driver, navTwoPageTwoNextButtonSelector);
const navTwoPageTwoNextButton = await getElement(driver, navTwoPageTwoNextButtonSelector);
navTwoPageTwoNextButton.click();
await waitForTransition(600);
console.log('On Nav Three Page One');
const navThreePageOnePreviousButtonSelector = '.nav-three-page-one ion-button.previous.nav-one.hydrated';
const navThreePageOnePreviousButton = await waitAndGetElement(driver, navThreePageOnePreviousButtonSelector);
const navThreePageOnePreviousButton = await getElement(driver, navThreePageOnePreviousButtonSelector);
navThreePageOnePreviousButton.click();
await waitForTransition(600);
console.log('On Nav One Page Two');
const navOnePageTwoPreviousButtonSelector = '.nav-one-page-two ion-button.previous.hydrated';
const navOnePageTwoPreviousButton = await waitAndGetElement(driver, navOnePageTwoPreviousButtonSelector);
const navOnePageTwoPreviousButton = await getElement(driver, navOnePageTwoPreviousButtonSelector);
navOnePageTwoPreviousButton.click();
await waitForTransition(600);
console.log('On Nav One Page One');
const navOnePageOneSelector = '.nav-one-page-one';
const navOnePageOne = await waitAndGetElement(driver, navOnePageOneSelector);
const navOnePageOne = await getElement(driver, navOnePageOneSelector);
});
register('should go from nav-one-page-one, nav-one-page-two, nav-two-page-one, nav-two-page-two, nav-three-page-one, nav-three-page-two, nav-three-page-three, nav-three-page-two, nav-three-page-one, nav-two-page-two, nav-two-page-one, nav-one-page-two, nav-one-page-one', async (driver, testContext) => {
@@ -198,92 +198,79 @@ platforms.forEach(platform => {
console.log('On Nav One Page One');
const navOnePageOneNextButtonSelector = '.nav-one-page-one ion-button.next.hydrated';
const navOnePageOneNextButton = await waitAndGetElement(driver, navOnePageOneNextButtonSelector);
const navOnePageOneNextButton = await getElement(driver, navOnePageOneNextButtonSelector);
navOnePageOneNextButton.click();
await waitForTransition(600);
console.log('On Nav One Page Two');
const navOnePageTwoNextButtonSelector = '.nav-one-page-two ion-button.next.hydrated';
const navOnePageTwoNextButton = await waitAndGetElement(driver, navOnePageTwoNextButtonSelector);
const navOnePageTwoNextButton = await getElement(driver, navOnePageTwoNextButtonSelector);
navOnePageTwoNextButton.click();
await waitForTransition(600);
console.log('On Nav Two Page One');
const navTwoPageOneNextButtonSelector = '.nav-two-page-one ion-button.next.nav-two.hydrated';
const navTwoPageOneNextButton = await waitAndGetElement(driver, navTwoPageOneNextButtonSelector);
const navTwoPageOneNextButton = await getElement(driver, navTwoPageOneNextButtonSelector);
navTwoPageOneNextButton.click();
await waitForTransition(600);
console.log('On Nav Two Page Two');
const navTwoPageTwoNextButtonSelector = '.nav-two-page-two ion-button.next.hydrated';
const navTwoPageTwoNextButton = await waitAndGetElement(driver, navTwoPageTwoNextButtonSelector);
const navTwoPageTwoNextButton = await getElement(driver, navTwoPageTwoNextButtonSelector);
navTwoPageTwoNextButton.click();
await waitForTransition(600);
console.log('On Nav Three Page One');
const navThreePageOneNextButtonSelector = '.nav-three-page-one ion-button.next.nav-three.hydrated';
const navThreePageOneNextButton = await waitAndGetElement(driver, navThreePageOneNextButtonSelector);
const navThreePageOneNextButton = await getElement(driver, navThreePageOneNextButtonSelector);
navThreePageOneNextButton.click();
await waitForTransition(600);
console.log('On Nav Three Page Two');
const navThreePageTwoNextButtonSelector = '.nav-three-page-two ion-button.next.hydrated';
const navThreePageTwoNextButton = await waitAndGetElement(driver, navThreePageTwoNextButtonSelector);
const navThreePageTwoNextButton = await getElement(driver, navThreePageTwoNextButtonSelector);
navThreePageTwoNextButton.click();
await waitForTransition(600);
console.log('On Nav Three Page Three');
const navThreePageThreePreviousButtonSelector = '.nav-three-page-three ion-button.previous.hydrated';
const navThreePageThreePreviousButton = await waitAndGetElement(driver, navThreePageThreePreviousButtonSelector);
const navThreePageThreePreviousButton = await getElement(driver, navThreePageThreePreviousButtonSelector);
navThreePageThreePreviousButton.click();
await waitForTransition(600);
console.log('On Nav Three Page Two');
const navThreePageTwoPreviousButtonSelector = '.nav-three-page-two ion-button.previous.hydrated';
const navThreePageTwoPreviousButton = await waitAndGetElement(driver, navThreePageTwoPreviousButtonSelector);
const navThreePageTwoPreviousButton = await getElement(driver, navThreePageTwoPreviousButtonSelector);
navThreePageTwoPreviousButton.click();
await waitForTransition(600);
console.log('On Nav Three Page One');
const navThreePageOnePreviousButtonSelector = '.nav-three-page-one ion-button.nav-two.previous.hydrated';
const navThreePageOnePreviousButton = await waitAndGetElement(driver, navThreePageOnePreviousButtonSelector);
const navThreePageOnePreviousButton = await getElement(driver, navThreePageOnePreviousButtonSelector);
navThreePageOnePreviousButton.click();
await waitForTransition(600);
console.log('On Nav Two Page Two');
const navTwoPageTwoPreviousButtonSelector = '.nav-two-page-two ion-button.previous.hydrated';
const navTwoPageTwoPreviousButton = await waitAndGetElement(driver, navTwoPageTwoPreviousButtonSelector);
const navTwoPageTwoPreviousButton = await getElement(driver, navTwoPageTwoPreviousButtonSelector);
navTwoPageTwoPreviousButton.click();
await waitForTransition(600);
console.log('On Nav Two Page One');
const navTwoPageOnePreviousButtonSelector = '.nav-two-page-one ion-button.previous.nav-one.hydrated';
const navTwoPageOnePreviousButton = await waitAndGetElement(driver, navTwoPageOnePreviousButtonSelector);
const navTwoPageOnePreviousButton = await getElement(driver, navTwoPageOnePreviousButtonSelector);
navTwoPageOnePreviousButton.click();
await waitForTransition(600);
console.log('On Nav One Page Two');
const navOnePageTwoPreviousButtonSelector = '.nav-one-page-two ion-button.previous.hydrated';
const navOnePageTwoPreviousButton = await waitAndGetElement(driver, navOnePageTwoPreviousButtonSelector);
const navOnePageTwoPreviousButton = await getElement(driver, navOnePageTwoPreviousButtonSelector);
navOnePageTwoPreviousButton.click();
await waitForTransition(600);
console.log('On Nav One Page One');
const navOnePageTwoSelector = '.nav-one-page-one';
const navOnePageTwo = await waitAndGetElement(driver, navOnePageTwoSelector);
const navOnePageTwo = await getElement(driver, navOnePageTwoSelector);
});
});
});
async function waitAndGetElement(driver, selector) {
driver.wait(until.elementLocated(By.css(selector)));
const element = driver.findElement(By.css(selector));
await driver.wait(until.elementIsVisible(driver.findElement(By.css(selector))));
return element;
}
function waitForTransition(duration) {
return new Promise(resolve => {
setTimeout(resolve, duration);
})
}

22
packages/core/src/components/tabs/test/basic/e2e.js
View File

@@ -1,7 +1,7 @@
'use strict';
const { By, until } = require('selenium-webdriver');
const { register, Page, platforms } = require('../../../../../scripts/e2e');
const { getElement, waitAndGetElementById, waitForTransition } = require('../../../../../scripts/e2e/utils');
class E2ETestPage extends Page {
constructor(driver, platform) {
@@ -32,23 +32,3 @@ platforms.forEach(platform => {
});
});
});
async function waitAndGetElement(driver, selector) {
driver.wait(until.elementLocated(By.css(selector)));
const element = driver.findElement(By.css(selector));
await driver.wait(until.elementIsVisible(driver.findElement(By.css(selector))));
return element;
}
async function waitAndGetElementById(driver, selector) {
driver.wait(until.elementLocated(By.id(selector)));
const element = driver.findElement(By.id(selector));
await driver.wait(until.elementIsVisible(driver.findElement(By.id(selector))));
return element;
}
function waitForTransition(duration) {
return new Promise(resolve => {
setTimeout(resolve, duration);
})
}

46
packages/core/src/components/tabs/test/nav/e2e.js
View File

@@ -1,8 +1,8 @@
'use strict';
const { By, until } = require('selenium-webdriver');
const expect = require('chai').expect;
const { register, Page, platforms } = require('../../../../../scripts/e2e');
const { getElement, waitAndGetElementById, waitForTransition } = require('../../../../../scripts/e2e/utils');
class E2ETestPage extends Page {
constructor(driver, platform) {
@@ -26,13 +26,13 @@ platforms.forEach(platform => {
console.log('On Tab One Page One');
const tabOnePageOneNextButtonSelector = 'page-one ion-button.next.hydrated';
const tabOnePageOneNextButton = await waitAndGetElement(driver, tabOnePageOneNextButtonSelector);
const tabOnePageOneNextButton = await getElement(driver, tabOnePageOneNextButtonSelector);
tabOnePageOneNextButton.click();
await waitForTransition(600);
console.log('On Tab One Page Two');
const tabOnePageTwoNextButtonSelector = 'page-two ion-button.next.hydrated';
const tabOnePageTwoNextButton = await waitAndGetElement(driver, tabOnePageTwoNextButtonSelector);
const tabOnePageTwoNextButton = await getElement(driver, tabOnePageTwoNextButtonSelector);
tabOnePageTwoNextButton.click();
await waitForTransition(600);
@@ -45,13 +45,13 @@ platforms.forEach(platform => {
console.log('On Tab Two Page One');
const tabTwoPageOneNextButtonSelector = 'page-four ion-button.next.hydrated';
const tabTwoPageOneNextButton = await waitAndGetElement(driver, tabTwoPageOneNextButtonSelector);
const tabTwoPageOneNextButton = await getElement(driver, tabTwoPageOneNextButtonSelector);
tabTwoPageOneNextButton.click();
await waitForTransition(600);
console.log('On Tab Two Page Two');
const tabTwoPageTwoNextButtonSelector = 'page-five ion-button.next.hydrated';
const tabTwoPageTwoNextButton = await waitAndGetElement(driver, tabTwoPageTwoNextButtonSelector);
const tabTwoPageTwoNextButton = await getElement(driver, tabTwoPageTwoNextButtonSelector);
tabTwoPageTwoNextButton.click();
await waitForTransition(600);
@@ -64,13 +64,13 @@ platforms.forEach(platform => {
console.log('On Tab Three Page One');
const tabThreePageOneNextButtonSelector = 'page-seven ion-button.next.hydrated';
const tabThreePageOneNextButton = await waitAndGetElement(driver, tabThreePageOneNextButtonSelector);
const tabThreePageOneNextButton = await getElement(driver, tabThreePageOneNextButtonSelector);
tabThreePageOneNextButton.click();
await waitForTransition(600);
console.log('On Tab Two Page Two');
const tabThreePageTwoNextButtonSelector = 'page-eight ion-button.next.hydrated';
const tabThreePageTwoNextButton = await waitAndGetElement(driver, tabThreePageTwoNextButtonSelector);
const tabThreePageTwoNextButton = await getElement(driver, tabThreePageTwoNextButtonSelector);
tabThreePageTwoNextButton.click();
await waitForTransition(600);
@@ -83,7 +83,7 @@ platforms.forEach(platform => {
console.log('On Tab One Page Three');
const tabOnePageThreeBackButtonSelector = 'page-three ion-button.back.hydrated';
const tabOnePageThreeBackButton = await waitAndGetElement(driver, tabOnePageThreeBackButtonSelector);
const tabOnePageThreeBackButton = await getElement(driver, tabOnePageThreeBackButtonSelector);
tabOnePageThreeBackButton.click();
await waitForTransition(600);
@@ -93,7 +93,7 @@ platforms.forEach(platform => {
console.log('On Tab Three Page Three');
const tabThreePageThreeBackButtonSelector = 'page-nine ion-button.back.hydrated';
const tabThreePageThreeBackButton = await waitAndGetElement(driver, tabThreePageThreeBackButtonSelector);
const tabThreePageThreeBackButton = await getElement(driver, tabThreePageThreeBackButtonSelector);
tabThreePageThreeBackButton.click();
await waitForTransition(600);
@@ -105,13 +105,13 @@ platforms.forEach(platform => {
console.log('On Tab Two Page Three');
const tabTwoPageThreeBackButtonSelector = 'page-six ion-button.back.hydrated';
const tabTwoPageThreeBackButton = await waitAndGetElement(driver, tabTwoPageThreeBackButtonSelector);
const tabTwoPageThreeBackButton = await getElement(driver, tabTwoPageThreeBackButtonSelector);
tabTwoPageThreeBackButton.click();
await waitForTransition(600);
console.log('On Tab Two Page Two');
const tabTwoPageTwoBackButtonSelector = 'page-five ion-button.back.hydrated';
const tabTwoPageTwoBackButton = await waitAndGetElement(driver, tabTwoPageTwoBackButtonSelector);
const tabTwoPageTwoBackButton = await getElement(driver, tabTwoPageTwoBackButtonSelector);
tabTwoPageTwoBackButton.click();
await waitForTransition(600);
@@ -123,7 +123,7 @@ platforms.forEach(platform => {
console.log('On Tab One Page Two');
const tabOnePageTwoBackButtonSelector = 'page-two ion-button.back.hydrated';
const tabOnePageTwoBackButton = await waitAndGetElement(driver, tabOnePageTwoBackButtonSelector);
const tabOnePageTwoBackButton = await getElement(driver, tabOnePageTwoBackButtonSelector);
tabOnePageTwoBackButton.click();
await waitForTransition(600);
@@ -136,7 +136,7 @@ platforms.forEach(platform => {
console.log('On Tab Three Page Two');
const tabThreePageTwoBackButtonSelector = 'page-eight ion-button.back.hydrated';
const tabThreePageTwoBackButton = await waitAndGetElement(driver, tabThreePageTwoBackButtonSelector);
const tabThreePageTwoBackButton = await getElement(driver, tabThreePageTwoBackButtonSelector);
tabThreePageTwoBackButton.click();
await waitForTransition(600);
@@ -144,23 +144,3 @@ platforms.forEach(platform => {
});
});
});
async function waitAndGetElement(driver, selector) {
driver.wait(until.elementLocated(By.css(selector)));
const element = driver.findElement(By.css(selector));
await driver.wait(until.elementIsVisible(driver.findElement(By.css(selector))));
return element;
}
async function waitAndGetElementById(driver, selector) {
driver.wait(until.elementLocated(By.id(selector)));
const element = driver.findElement(By.id(selector));
await driver.wait(until.elementIsVisible(driver.findElement(By.id(selector))));
return element;
}
function waitForTransition(duration) {
return new Promise(resolve => {
setTimeout(resolve, duration);
})
}

22
packages/core/src/components/tabs/test/vanilla/e2e.js
View File

@@ -1,7 +1,7 @@
'use strict';
const { By, until } = require('selenium-webdriver');
const { register, Page, platforms } = require('../../../../../scripts/e2e');
const { getElement, waitAndGetElementById, waitForTransition } = require('../../../../../scripts/e2e/utils');
class E2ETestPage extends Page {
constructor(driver, platform) {
@@ -32,23 +32,3 @@ platforms.forEach(platform => {
});
});
});
async function waitAndGetElement(driver, selector) {
driver.wait(until.elementLocated(By.css(selector)));
const element = driver.findElement(By.css(selector));
await driver.wait(until.elementIsVisible(driver.findElement(By.css(selector))));
return element;
}
async function waitAndGetElementById(driver, selector) {
driver.wait(until.elementLocated(By.id(selector)));
const element = driver.findElement(By.id(selector));
await driver.wait(until.elementIsVisible(driver.findElement(By.id(selector))));
return element;
}
function waitForTransition(duration) {
return new Promise(resolve => {
setTimeout(resolve, duration);
})
}