mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-17 02:31:34 +08:00
test(e2e): port e2e tests to @ionic/core (#13438)
* feat(e2e-tests) simplify e2e test structure * test(badge) add basic e2e test * test(button) update e2e test to new structure * test(card) add basic e2e test * test(checkbox) add basic e2e test * chore(e2e-test) update path to e2e module in run-e2e * fix(button) update toolbar e2e deps * fix(e2e-test) update path in snapshot script * feat(e2e-test) move e2e scripts into scripts/e2e * test(chip) add basic e2e test * test(content) add basic e2e test * test(datetime) add basic e2e test * style(e2e-test) use consistent title/header in e2e test pages * test(fab) add basic e2e test * fix(e2e-test) don't run e2e script when required * test(grid) add basic e2e test * test(icon) add basic e2e test * test(input) add basic e2e test * style(e2e-test) use consistent e2e test header titles * test(list) add basic e2e test * test(menu) add basic e2e test * test(modal) add basic e2e test * feat(e2e-test) add navigate export to e2e module * feat(e2e-test) add present method to Page class * test(popover) add basic e2e test * test(menu) add present left menu e2e test * test(radio) add basic e2e test * test(range) add basic e2e test * test(searchbar) add basic e2e test * test(segment) add basic e2e test * test(select) add basic e2e test * test(modal) add shows modal e2e test * test(slides) add basic e2e test * test(spinner) add basic/color e2e tests * test(tabs) add basic e2e test * test(toast) add basic e2e test * test(toggle) add basic e2e test * test(toolbar) add basic e2e test * docs(e2e-test) update e2e readme to reflect simplest test * test(card) update basic e2e test * chore(e2e-test) remove run-e2e script * test(components): move remaining component tests to index files * chore(package): add mocha to devDependencies * test(infinite-scroll) add basic e2e test * test(item-sliding) add basic e2e test * test(item) add basic/buttons e2e tests * test(nav) add basic e2e test * test(reorder) add basic e2e test * test(split-pane) add basic e2e test * chore() update declarations file * refactor(toast): reduce border-radius * chore(components): update components.d.ts
This commit is contained in:
Cam Wiegert
committed by
Brandy Carney
Brandy Carney
parent
90b6e01a38
commit
db475cd153
@ -16,6 +16,7 @@
|
||||
"@types/jest": "^21.1.0",
|
||||
"ionicons": "^4.0.0-6",
|
||||
"jest": "^21.1.0",
|
||||
"mocha": "^4.0.1",
|
||||
"np": "^2.16.1",
|
||||
"sass-lint": "^1.11.1",
|
||||
"selenium-webdriver": "^3.6.0",
|
||||
@ -26,8 +27,8 @@
|
||||
"build": "stencil build",
|
||||
"tsc": "./node_modules/.bin/tsc -p .",
|
||||
"dev": "sd concurrent \"stencil build --dev --watch\" \"stencil-dev-server\"",
|
||||
"e2e": "node ./scripts/run-e2e.js",
|
||||
"snapshot": "node ./scripts/e2e.js --snapshot",
|
||||
"e2e": "node ./scripts/e2e",
|
||||
"snapshot": "node ./scripts/e2e --snapshot",
|
||||
"test": "jest --no-cache",
|
||||
"test.watch": "jest --watch --no-cache",
|
||||
"clean": "rm -rf dist",
|
||||
|
||||
@ -20,13 +20,10 @@ In general, writing an end-to-end tests consists of the following steps:
|
||||
The most basic end-to-end test just navigates to the page in order to verify that it draws properly. In this case, it is not necessary to extend the E2ETestPage class. The base class contains a navigate method that goes to the page and waits for it to load. The test just needs to instantiate the page with the proper URL and call the navigate. Such a test looks like this:
|
||||
|
||||
```ts
|
||||
const { register, Page } = require('../../../../scripts/e2e');
|
||||
const { register, navigate } = require('../../../../scripts/e2e');
|
||||
|
||||
describe('button: basic', () => {
|
||||
register('navigates', driver => {
|
||||
const page = new Page(driver, 'http://localhost:3333/src/components/button/test/basic/index.html');
|
||||
return page.navigate();
|
||||
});
|
||||
register('navigates', navigate('http://localhost:3333/src/components/button/test/basic'));
|
||||
});
|
||||
```
|
||||
|
||||
@ -38,7 +35,7 @@ const { register, Page } = require('../../../../scripts/e2e');;
|
||||
|
||||
class ActionSheetE2ETestPage extends Page {
|
||||
constructor(driver) {
|
||||
super(driver, 'http://localhost:3333/src/components/action-sheet/test/basic/index.html');
|
||||
super(driver, 'http://localhost:3333/src/components/action-sheet/test/basic');
|
||||
}
|
||||
|
||||
present(buttonId) {
|
||||
@ -13,4 +13,11 @@ module.exports = class E2ETestPage {
|
||||
this.driver.wait(until.elementLocated(By.css('.hydrated')));
|
||||
return this.driver.wait(until.elementIsVisible(this.driver.findElement(By.css('.hydrated'))));
|
||||
}
|
||||
|
||||
present(clickTarget, options) {
|
||||
this.navigate();
|
||||
this.driver.findElement(By.css(clickTarget)).click();
|
||||
this.driver.wait(until.elementLocated(By.css(options.waitFor)));
|
||||
return this.driver.wait(until.elementIsVisible(this.driver.findElement(By.css(options.waitFor))));
|
||||
}
|
||||
}
|
||||
@ -6,8 +6,8 @@ const Mocha = require('mocha');
|
||||
const path = require('path');
|
||||
const webdriver = require('selenium-webdriver');
|
||||
|
||||
const Page = require('./E2ETestPage');
|
||||
const Snapshot = require('./Snapshot');
|
||||
const Page = require('./e2e-test-page');
|
||||
const Snapshot = require('./snapshot');
|
||||
|
||||
let driver;
|
||||
let snapshot;
|
||||
@ -33,7 +33,7 @@ function generateTestId() {
|
||||
|
||||
function getTestFiles() {
|
||||
return new Promise((resolve, reject) => {
|
||||
const src = path.join(__dirname, '../src/**/e2e.js');
|
||||
const src = path.join(__dirname, '../../src/**/e2e.js');
|
||||
glob(src, (err, files) => {
|
||||
if (err) {
|
||||
reject(err);
|
||||
@ -124,8 +124,16 @@ async function run() {
|
||||
});
|
||||
}
|
||||
|
||||
const navigate = url => driver => new Page(driver, url).navigate();
|
||||
|
||||
// Invoke run() only if executed directly i.e. `node ./scripts/e2e`
|
||||
if (require.main === module) {
|
||||
run();
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
Page,
|
||||
navigate,
|
||||
register: registerE2ETest,
|
||||
run: run
|
||||
};
|
||||
@ -1,3 +0,0 @@
|
||||
'use strict';
|
||||
|
||||
require('./e2e').run();
|
||||
@ -3,7 +3,7 @@
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Action Sheet Basic</title>
|
||||
<title>Action Sheet - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -13,7 +13,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Action Sheet</ion-title>
|
||||
<ion-title>Action Sheet - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Alert Basic</title>
|
||||
<title>Alert - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -13,7 +13,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Alerts</ion-title>
|
||||
<ion-title>Alert - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
|
||||
7
packages/core/src/components/badge/test/basic/e2e.js
Normal file
7
packages/core/src/components/badge/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('badge: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/badge/test/basic'));
|
||||
|
||||
});
|
||||
63
packages/core/src/components/badge/test/basic/index.html
Normal file
63
packages/core/src/components/badge/test/basic/index.html
Normal file
@ -0,0 +1,63 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Badge - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Badge - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<ion-list>
|
||||
<ion-item>
|
||||
<ion-badge slot="start" color="primary">11</ion-badge>
|
||||
<ion-label>Primary</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-badge slot="start" color="secondary">22</ion-badge>
|
||||
<ion-label>Secondary</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-badge slot="start" color="danger">33</ion-badge>
|
||||
<ion-label>Danger</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-badge slot="start" color="light">44</ion-badge>
|
||||
<ion-label>Light</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-badge slot="start" color="dark">55</ion-badge>
|
||||
<ion-label>Dark</ion-label>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
|
||||
<ion-button onclick="toggleColors()">Toggle Colors</ion-button>
|
||||
</ion-content>
|
||||
|
||||
</ion-page>
|
||||
</ion-app>
|
||||
|
||||
<script>
|
||||
const badges = [...document.querySelectorAll('ion-badge')];
|
||||
const baseColors = badges.map(el => el.getAttribute('color'));
|
||||
|
||||
function toggleColors() {
|
||||
badges.forEach((el, i) => {
|
||||
const prev = el.getAttribute('color');
|
||||
const base = baseColors[i];
|
||||
el.setAttribute('color', prev === base ? null : base);
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,11 +0,0 @@
|
||||
'use strict';
|
||||
|
||||
const register = require('../../../../scripts/e2e-test-runner').register;
|
||||
const E2ETestPage = require('../../../../scripts/E2ETestPage');
|
||||
|
||||
describe('button: basic', () => {
|
||||
register('navigates', driver => {
|
||||
const page = new E2ETestPage(driver, 'http://localhost:3333/src/components/button/test/basic.html');
|
||||
return page.navigate();
|
||||
});
|
||||
});
|
||||
@ -1,82 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Buttons</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-content>
|
||||
<ion-button button-type="bar-button">Test button</ion-button>
|
||||
|
||||
<ion-button button-type="test-button">Test button</ion-button>
|
||||
|
||||
<ion-button button-type="test-button" class="my-test-button">Test button w/ class</ion-button>
|
||||
|
||||
<ion-button button-type="alert-radio-button">
|
||||
Alert button
|
||||
</ion-button>
|
||||
|
||||
<ion-button button-type="alert-radio-button" class="alert-tappable alert-radio" role="radio">
|
||||
Alert button w/ class & role
|
||||
</ion-button>
|
||||
|
||||
<ion-button href="#">Anchor Button</ion-button>
|
||||
<a href="#">Anchor Link</a>
|
||||
|
||||
<h4>Colors</h4>
|
||||
<ion-button>Default</ion-button>
|
||||
<ion-button color="secondary">Secondary</ion-button>
|
||||
<ion-button color="danger">Danger</ion-button>
|
||||
<ion-button color="light">Light</ion-button>
|
||||
<ion-button color="dark">Dark</ion-button>
|
||||
|
||||
<h4>Shapes</h4>
|
||||
<ion-button full>Full Button</ion-button>
|
||||
<ion-button block>Block Button</ion-button>
|
||||
<ion-button round>Round Button</ion-button>
|
||||
|
||||
<h4>Outlines</h4>
|
||||
<ion-button full outline>Outline + Full + No Color</ion-button>
|
||||
<ion-button color="secondary" full outline>Outline + Full</ion-button>
|
||||
<ion-button color="secondary" block outline>Outline + Block</ion-button>
|
||||
<ion-button color="secondary" round outline>Outline + Round</ion-button>
|
||||
|
||||
<h4>Clear</h4>
|
||||
<ion-button full clear>Clear + Full + No Color</ion-button>
|
||||
<ion-button color="danger" full clear>Clear + Full</ion-button>
|
||||
<ion-button color="danger" block clear>Clear + Block</ion-button>
|
||||
<ion-button color="danger" round clear>Clear + Round</ion-button>
|
||||
|
||||
<h4>Icons</h4>
|
||||
|
||||
<ion-button color="dark">
|
||||
<ion-icon slot="start" name="star"></ion-icon>
|
||||
Left Icon
|
||||
</ion-button>
|
||||
|
||||
<ion-button color="dark">
|
||||
Right Icon
|
||||
<ion-icon slot="end" name="star"></ion-icon>
|
||||
</ion-button>
|
||||
|
||||
<ion-button color="dark">
|
||||
<ion-icon slot="icon-only" name="star"></ion-icon>
|
||||
</ion-button>
|
||||
|
||||
<h4>Sizes</h4>
|
||||
<ion-button color="light" large>Large</ion-button>
|
||||
<ion-button color="light">Default</ion-button>
|
||||
<ion-button color="light" small>Small</ion-button>
|
||||
|
||||
<h4>States</h4>
|
||||
<ion-button disabled>Large</ion-button>
|
||||
<ion-button color="secondary" disabled clear>Large</ion-button>
|
||||
</ion-content>
|
||||
</ion-page>
|
||||
</ion-app>
|
||||
</body>
|
||||
</html>
|
||||
7
packages/core/src/components/button/test/basic/e2e.js
Normal file
7
packages/core/src/components/button/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('button: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/button/test/basic'));
|
||||
|
||||
});
|
||||
30
packages/core/src/components/button/test/basic/index.html
Normal file
30
packages/core/src/components/button/test/basic/index.html
Normal file
@ -0,0 +1,30 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Button - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Button - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content padding no-bounce>
|
||||
<p><ion-button>Default</ion-button></p>
|
||||
<p><ion-button color="primary">Primary</ion-button></p>
|
||||
<p><ion-button color="secondary">Secondary</ion-button></p>
|
||||
<p><ion-button color="danger">Danger</ion-button></p>
|
||||
<p><ion-button color="light">Light</ion-button></p>
|
||||
<p><ion-button color="dark">Dark</ion-button></p>
|
||||
<p><ion-button disabled>Disabled</ion-button></p>
|
||||
</ion-content>
|
||||
</ion-page>
|
||||
</ion-app>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,27 +0,0 @@
|
||||
import { flush, render } from '@stencil/core/testing';
|
||||
import { Button } from '../button';
|
||||
|
||||
|
||||
describe('button', () => {
|
||||
|
||||
it('should render button inner text', async () => {
|
||||
const root = await render({
|
||||
components: [Button],
|
||||
html: '<ion-button>Button Inner Text</ion-button>'
|
||||
});
|
||||
|
||||
expect(root.textContent).toBe('Button Inner Text');
|
||||
expect(root.querySelector('button').hasAttribute('disabled')).toBe(false);
|
||||
|
||||
root.disabled = true;
|
||||
await flush(root);
|
||||
|
||||
expect(root.querySelector('button').hasAttribute('disabled')).toBe(true);
|
||||
});
|
||||
|
||||
it('should default itemButton to false', () => {
|
||||
const btn = new Button();
|
||||
expect(btn.itemButton).toBe(false);
|
||||
});
|
||||
|
||||
});
|
||||
@ -1,11 +0,0 @@
|
||||
'use strict';
|
||||
|
||||
const register = require('../../../../scripts/e2e-test-runner').register;
|
||||
const E2ETestPage = require('../../../../scripts/E2ETestPage');
|
||||
|
||||
describe('button: toolbar', () => {
|
||||
register('navigates', (driver) => {
|
||||
const page = new E2ETestPage(driver, 'http://localhost:3333/src/components/button/test/toolbar.html');
|
||||
return page.navigate();
|
||||
});
|
||||
});
|
||||
5
packages/core/src/components/button/test/toolbar/e2e.js
Normal file
5
packages/core/src/components/button/test/toolbar/e2e.js
Normal file
@ -0,0 +1,5 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('button: toolbar', () => {
|
||||
register('navigates', navigate('http://localhost:3333/src/components/button/test/toolbar'));
|
||||
});
|
||||
@ -2,13 +2,19 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Toolbar Buttons</title>
|
||||
<title>Button - Toolbar</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Button - Toolbar</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<ion-toolbar no-padding>
|
||||
<ion-title>This should have no padding</ion-title>
|
||||
@ -204,7 +210,7 @@
|
||||
|
||||
<ion-toolbar>
|
||||
<ion-buttons slot="mode-end">
|
||||
<ion-button #button1 (click)="buttonClick(button1)">
|
||||
<ion-button>
|
||||
<ion-icon slot="icon-only" name="star"></ion-icon>
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
@ -216,7 +222,7 @@
|
||||
|
||||
<ion-toolbar>
|
||||
<ion-buttons slot="mode-end">
|
||||
<ion-button #button2 (click)="buttonClick(button2)">
|
||||
<ion-button>
|
||||
<ion-icon slot="icon-only" name="search"></ion-icon>
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
7
packages/core/src/components/card/test/basic/e2e.js
Normal file
7
packages/core/src/components/card/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('card: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/card/test/basic'));
|
||||
|
||||
});
|
||||
@ -3,7 +3,7 @@
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Cards</title>
|
||||
<title>Card - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,12 +11,18 @@
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Card - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<!-- <ion-card>
|
||||
<ion-card>
|
||||
<ion-card-content>
|
||||
This is just your basic card with some text to boot. Like it? Keep scrolling...
|
||||
</ion-card-content>
|
||||
</ion-card> -->
|
||||
</ion-card>
|
||||
|
||||
<ion-card>
|
||||
<ion-card-header>
|
||||
@ -1,128 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Checkbox</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Checkboxes</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content>
|
||||
|
||||
<ion-list>
|
||||
<ion-item>
|
||||
<ion-label>Apple</ion-label>
|
||||
<ion-checkbox slot="start" name="apple" checked></ion-checkbox>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Banana</ion-label>
|
||||
<ion-checkbox slot="start" name="banana" checked></ion-checkbox>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Cherry, disabled</ion-label>
|
||||
<ion-checkbox slot="start" color="danger" name="cherry" disabled></ion-checkbox>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Grape, checked, disabled</ion-label>
|
||||
<ion-checkbox slot="start" id="grapeChecked" name="grape" checked disabled></ion-checkbox>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Kiwi, (ionChange) Secondary color</ion-label>
|
||||
<ion-checkbox slot="start" color="secondary" (ionChange)="kiwiChange($event)"></ion-checkbox>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Strawberry, (ionChange) checked="true"</ion-label>
|
||||
<ion-checkbox slot="start" color="light" (ionChange)="strawberryChange($event)" checked="true"></ion-checkbox>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Checkbox right, checked, really long text that should ellipsis</ion-label>
|
||||
<ion-checkbox slot="end" color="danger" checked></ion-checkbox>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Checkbox right side</ion-label>
|
||||
<ion-checkbox slot="end" checked></ion-checkbox>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Button w/ right side default icon, really long text that should ellipsis</ion-label>
|
||||
<ion-icon name="information-circle" slot="end"></ion-icon>
|
||||
</ion-item>
|
||||
|
||||
</ion-list>
|
||||
|
||||
|
||||
<p aria-hidden="true" text-center>
|
||||
<ion-button onClick="toggleBoolean('grapeChecked', 'checked')" outline small>Grape Checked</ion-button>
|
||||
<ion-button onClick="toggleBoolean('grapeChecked', 'disabled')" outline small>Grape Disabled</ion-button>
|
||||
<ion-button onClick="printForm()" outline small>Print Form</ion-button>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<ion-checkbox id="standAloneChecked"></ion-checkbox>
|
||||
Stand-alone checkbox: <span id="standAloneCheckedSpan"></span>
|
||||
</p>
|
||||
|
||||
<p aria-hidden="true" padding>
|
||||
<code>appleCtrl.value: <span id="appleCtrlValue"></span></code><br>
|
||||
<code>bananaCtrl.value: <span id="bananaCtrlValue"></span></code><br>
|
||||
<code>cherry.value: <span id="cherryCtrlValue"></span></code><br>
|
||||
<code>grape.value: <span id="grapeCtrlValue"></span></code><br>
|
||||
<code>kiwiValue: <spa id="kiwiValue"></span></code><br>
|
||||
<code>strawberryValue: <span id="strawberryValue">y</span></code><br>
|
||||
</p>
|
||||
|
||||
<pre aria-hidden="true" padding id="formResults"></pre>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Checkbox / Toggle</ion-label>
|
||||
<ion-checkbox slot="start" id="checked"></ion-checkbox>
|
||||
<ion-toggle id="checked"></ion-toggle>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Checked</ion-label>
|
||||
<ion-checkbox slot="start" checked></ion-checkbox>
|
||||
<ion-toggle checked></ion-toggle>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Disabled</ion-label>
|
||||
<ion-checkbox slot="start" disabled></ion-checkbox>
|
||||
<ion-toggle disabled></ion-toggle>
|
||||
</ion-item>
|
||||
|
||||
</ion-content>
|
||||
</ion-page>
|
||||
|
||||
<script>
|
||||
function printForm(ev) {
|
||||
console.log('TODO get working with forms');
|
||||
}
|
||||
|
||||
function toggleBoolean(id, prop) {
|
||||
var el = document.getElementById(id);
|
||||
|
||||
var isTrue = el[prop] ? false : true;
|
||||
el[prop] = isTrue;
|
||||
console.log('in toggleBoolean, setting', prop, 'to', isTrue);
|
||||
}
|
||||
</script>
|
||||
|
||||
</ion-app>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
7
packages/core/src/components/checkbox/test/basic/e2e.js
Normal file
7
packages/core/src/components/checkbox/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('checkbox: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/checkbox/test/basic'));
|
||||
|
||||
});
|
||||
55
packages/core/src/components/checkbox/test/basic/index.html
Normal file
55
packages/core/src/components/checkbox/test/basic/index.html
Normal file
@ -0,0 +1,55 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Checkbox - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Checkbox - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<ion-item>
|
||||
<ion-label>Default</ion-label>
|
||||
<ion-checkbox checked></ion-checkbox>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Primary</ion-label>
|
||||
<ion-checkbox color="primary" checked></ion-checkbox>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Secondary</ion-label>
|
||||
<ion-checkbox color="secondary" checked></ion-checkbox>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Danger</ion-label>
|
||||
<ion-checkbox color="danger" checked></ion-checkbox>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Light</ion-label>
|
||||
<ion-checkbox color="light" checked></ion-checkbox>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Dark</ion-label>
|
||||
<ion-checkbox color="dark" checked></ion-checkbox>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Disabled</ion-label>
|
||||
<ion-checkbox disabled></ion-checkbox>
|
||||
</ion-item>
|
||||
</ion-content>
|
||||
|
||||
</ion-page>
|
||||
</ion-app>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
7
packages/core/src/components/chip/test/basic/e2e.js
Normal file
7
packages/core/src/components/chip/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('chip: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/chip/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Chips</title>
|
||||
<title>Chip - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,7 +11,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Header</ion-title>
|
||||
<ion-title>Chip - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
7
packages/core/src/components/content/test/basic/e2e.js
Normal file
7
packages/core/src/components/content/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('content: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/content/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Chips</title>
|
||||
<title>Content - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,10 +11,10 @@
|
||||
<ion-page>
|
||||
<ion-header id="header">
|
||||
<ion-toolbar style="display: none" id="toolbar2">
|
||||
<ion-title>hidden toolbar</ion-title>
|
||||
<ion-title>Hidden Toolbar</ion-title>
|
||||
</ion-toolbar>
|
||||
<ion-toolbar>
|
||||
<ion-title>Header</ion-title>
|
||||
<ion-title>Content - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
7
packages/core/src/components/datetime/test/basic/e2e.js
Normal file
7
packages/core/src/components/datetime/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('datetime: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/datetime/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Datetime</title>
|
||||
<title>Datetime - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,7 +11,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Datetime</ion-title>
|
||||
<ion-title>Datetime - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
7
packages/core/src/components/fab/test/basic/e2e.js
Normal file
7
packages/core/src/components/fab/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('fab: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/fab/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic FAB</title>
|
||||
<title>Floating Action Button - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,7 +11,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Floating Action Buttons</ion-title>
|
||||
<ion-title>Floating Action Button - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
7
packages/core/src/components/grid/test/basic/e2e.js
Normal file
7
packages/core/src/components/grid/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('grid: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/grid/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,13 +2,19 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Grid</title>
|
||||
<title>Grid - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Grid - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content class="grid-demo">
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
@ -1,91 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Icons</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-navbar>
|
||||
<ion-title>Icon</ion-title>
|
||||
</ion-navbar>
|
||||
</ion-header>
|
||||
|
||||
|
||||
<ion-content text-center class="icon-demo">
|
||||
|
||||
<ion-row>
|
||||
<ion-col><ion-icon name="ionic" color="primary"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="logo-angular"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="heart" color="danger"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="ionitron" color="primary"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="happy" color="vibrant"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="people"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="person"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="contact"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="apps"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="lock"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="key" color="bright"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="unlock"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="map" color="secondary"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="navigate"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="pin"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="locate"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="mic"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="musical-notes" color="vibrant"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="volume-up"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="microphone"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="cafe" color="bright"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="calculator"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="bus"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="wine" color="danger"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="camera"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="image" color="secondary"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="star" color="bright"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="pin"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="arrow-dropup-circle" color="vibrant"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="arrow-back"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="arrow-dropdown"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="arrow-forward"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="cloud"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="sunny" color="bright"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="umbrella"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="rainy" color="primary"></ion-icon></ion-col>
|
||||
</ion-row>
|
||||
|
||||
</ion-content>
|
||||
</ion-page>
|
||||
|
||||
<style>
|
||||
.icon-demo ion-icon {
|
||||
font-size: 50px;
|
||||
}
|
||||
|
||||
.icon-demo ion-row {
|
||||
height: 100%;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.icon-demo ion-col {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
text-align: center;
|
||||
padding: 10px 5px;
|
||||
}
|
||||
</style>
|
||||
</ion-app>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
7
packages/core/src/components/icon/test/basic/e2e.js
Normal file
7
packages/core/src/components/icon/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('icon: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/icon/test/basic'));
|
||||
|
||||
});
|
||||
92
packages/core/src/components/icon/test/basic/index.html
Normal file
92
packages/core/src/components/icon/test/basic/index.html
Normal file
@ -0,0 +1,92 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Icon - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Icon - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content text-center class="icon-demo">
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
|
||||
<ion-col><ion-icon name="ionic" color="primary"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="logo-angular"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="heart" color="danger"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="ionitron" color="primary"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="happy" color="vibrant"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="people"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="person"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="contact"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="apps"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="lock"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="key" color="bright"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="unlock"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="map" color="secondary"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="navigate"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="pin"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="locate"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="mic"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="musical-notes" color="vibrant"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="volume-up"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="microphone"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="cafe" color="bright"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="calculator"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="bus"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="wine" color="danger"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="camera"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="image" color="secondary"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="star" color="bright"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="pin"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="arrow-dropup-circle" color="vibrant"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="arrow-back"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="arrow-dropdown"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="arrow-forward"></ion-icon></ion-col>
|
||||
|
||||
<ion-col><ion-icon name="cloud"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="sunny" color="bright"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="umbrella"></ion-icon></ion-col>
|
||||
<ion-col><ion-icon name="rainy" color="primary"></ion-icon></ion-col>
|
||||
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</ion-content>
|
||||
</ion-page>
|
||||
|
||||
<style>
|
||||
.icon-demo ion-icon {
|
||||
font-size: 50px;
|
||||
}
|
||||
|
||||
.icon-demo ion-row {
|
||||
height: 100%;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.icon-demo ion-col {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
text-align: center;
|
||||
padding: 10px 5px;
|
||||
}
|
||||
</style>
|
||||
</ion-app>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
7
packages/core/src/components/icon/test/items/e2e.js
Normal file
7
packages/core/src/components/icon/test/items/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('icon: items', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/icon/test/items'));
|
||||
|
||||
});
|
||||
@ -1,9 +1,8 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic</title>
|
||||
<title>Icon - Items</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
<style>
|
||||
@ -12,25 +11,17 @@
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<ion-app>
|
||||
|
||||
<ion-page>
|
||||
|
||||
|
||||
<ion-header>
|
||||
|
||||
<ion-toolbar>
|
||||
<ion-title>Icons</ion-title>
|
||||
<ion-title>Icon - Items</ion-title>
|
||||
</ion-toolbar>
|
||||
|
||||
</ion-header>
|
||||
|
||||
|
||||
<ion-content>
|
||||
|
||||
<ion-list>
|
||||
|
||||
<ion-item>
|
||||
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('inifinite-scroll: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/infinite-scroll/test/basic'));
|
||||
|
||||
});
|
||||
@ -3,7 +3,7 @@
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Infinite Scroll</title>
|
||||
<title>Infinite Scroll - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -14,7 +14,7 @@
|
||||
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Ionic CDN demo</ion-title>
|
||||
<ion-title>Infinite Scroll - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
7
packages/core/src/components/input/test/basic/e2e.js
Normal file
7
packages/core/src/components/input/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('input: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/input/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Inputs</title>
|
||||
<title>Input - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,7 +11,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Basic Form</ion-title>
|
||||
<ion-title>Input - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content>
|
||||
7
packages/core/src/components/input/test/textarea/e2e.js
Normal file
7
packages/core/src/components/input/test/textarea/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('input: textarea', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/input/test/textarea'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Textareas</title>
|
||||
<title>Input - Textarea</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,7 +11,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Textareas</ion-title>
|
||||
<ion-title>Input - Textarea</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content>
|
||||
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('item-sliding: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/item-sliding/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Item Sliding</title>
|
||||
<title>Item Sliding - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,7 +11,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Sliding Items</ion-title>
|
||||
<ion-title>Item Sliding - Basic</ion-title>
|
||||
<ion-buttons slot="start">
|
||||
<ion-button onclick="changeDynamicText()">Dynamic</ion-button>
|
||||
</ion-buttons>
|
||||
7
packages/core/src/components/item/test/basic/e2e.js
Normal file
7
packages/core/src/components/item/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('item: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/item/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Slides Basic</title>
|
||||
<title>Item - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,7 +11,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Button Icons</ion-title>
|
||||
<ion-title>Item - Basic</ion-title>
|
||||
<ion-buttons slot="end">
|
||||
<ion-button color="secondary">
|
||||
Default
|
||||
7
packages/core/src/components/item/test/buttons/e2e.js
Normal file
7
packages/core/src/components/item/test/buttons/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('item: buttons', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/item/test/buttons'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Slides Basic</title>
|
||||
<title>Item - Buttons</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,7 +11,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Button Icons</ion-title>
|
||||
<ion-title>Item - Buttons</ion-title>
|
||||
<ion-buttons slot="end">
|
||||
<ion-button color="secondary">
|
||||
Default
|
||||
7
packages/core/src/components/list/test/basic/e2e.js
Normal file
7
packages/core/src/components/list/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('list: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/list/test/basic'));
|
||||
|
||||
});
|
||||
45
packages/core/src/components/list/test/basic/index.html
Normal file
45
packages/core/src/components/list/test/basic/index.html
Normal file
@ -0,0 +1,45 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>List - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>List - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<ion-list>
|
||||
<ion-item>Pokémon Yellow</ion-item>
|
||||
<ion-item>Super Metroid</ion-item>
|
||||
<ion-item>Mega Man X</ion-item>
|
||||
<ion-item>The Legend of Zelda</ion-item>
|
||||
<ion-item>Pac-Man</ion-item>
|
||||
<ion-item>Super Mario World</ion-item>
|
||||
<ion-item>Street Fighter II</ion-item>
|
||||
<ion-item>Half Life</ion-item>
|
||||
<ion-item>Portal</ion-item>
|
||||
<ion-item>Final Fantasy VII</ion-item>
|
||||
<ion-item>Star Fox</ion-item>
|
||||
<ion-item>Tetris</ion-item>
|
||||
<ion-item>Donkey Kong III</ion-item>
|
||||
<ion-item>Goldeneye 007</ion-item>
|
||||
<ion-item>Doom</ion-item>
|
||||
<ion-item>Fallout</ion-item>
|
||||
<ion-item>GTA</ion-item>
|
||||
<ion-item>Halo</ion-item>
|
||||
</ion-list>
|
||||
</ion-content>
|
||||
|
||||
</ion-page>
|
||||
</ion-app>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
17
packages/core/src/components/menu/test/basic/e2e.js
Normal file
17
packages/core/src/components/menu/test/basic/e2e.js
Normal file
@ -0,0 +1,17 @@
|
||||
const { register, navigate, Page } = require('../../../../../scripts/e2e');
|
||||
const testPageURL = 'http://localhost:3333/src/components/menu/test/basic';
|
||||
|
||||
describe('menu: basic', () => {
|
||||
|
||||
register('navigates', navigate(testPageURL));
|
||||
|
||||
describe('present', () => {
|
||||
|
||||
register('shows left menu', driver => {
|
||||
const page = new Page(driver, testPageURL);
|
||||
return page.present('.e2eOpenLeftMenu', { waitFor: '.e2eLeftMenu' })
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
@ -3,14 +3,14 @@
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Menu</title>
|
||||
<title>Menu - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-menu side="left">
|
||||
<ion-menu side="left" class="e2eLeftMenu">
|
||||
|
||||
<ion-header>
|
||||
<ion-toolbar color="secondary">
|
||||
@ -59,13 +59,13 @@
|
||||
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Ionic CDN demo</ion-title>
|
||||
<ion-title>Menu - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content padding>
|
||||
<p>
|
||||
<ion-button onclick="openLeft()">Open left menu</ion-button>
|
||||
<ion-button class="e2eOpenLeftMenu" onclick="openLeft()">Open left menu</ion-button>
|
||||
<ion-button onclick="openRight()">Open right menu</ion-button>
|
||||
</p>
|
||||
<p>
|
||||
17
packages/core/src/components/modal/test/basic/e2e.js
Normal file
17
packages/core/src/components/modal/test/basic/e2e.js
Normal file
@ -0,0 +1,17 @@
|
||||
const { register, navigate, Page } = require('../../../../../scripts/e2e');
|
||||
const testPageURL = 'http://localhost:3333/src/components/modal/test/basic';
|
||||
|
||||
describe('modal: basic', () => {
|
||||
|
||||
register('navigates', navigate(testPageURL));
|
||||
|
||||
describe('present', () => {
|
||||
|
||||
register('shows modal', driver => {
|
||||
const page = new Page(driver, testPageURL);
|
||||
return page.present('.e2ePresentModal', { waitFor: 'ion-modal' });
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
42
packages/core/src/components/modal/test/basic/index.html
Normal file
42
packages/core/src/components/modal/test/basic/index.html
Normal file
@ -0,0 +1,42 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Modal - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Modal - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content padding>
|
||||
<ion-modal-controller></ion-modal-controller>
|
||||
<p>
|
||||
<ion-button class="e2ePresentModal" onclick="presentModal()">Present modal</ion-button>
|
||||
</p>
|
||||
</ion-content>
|
||||
</ion-page>
|
||||
</ion-app>
|
||||
|
||||
<script>
|
||||
const controller = document.querySelector('ion-modal-controller');
|
||||
function presentModal() {
|
||||
controller
|
||||
.create({
|
||||
component: 'ion-content'
|
||||
})
|
||||
.then(modal => {
|
||||
modal.present();
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
7
packages/core/src/components/nav/test/basic/e2e.js
Normal file
7
packages/core/src/components/nav/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('nav: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/nav/test/basic'));
|
||||
|
||||
});
|
||||
18
packages/core/src/components/popover/test/basic/e2e.js
Normal file
18
packages/core/src/components/popover/test/basic/e2e.js
Normal file
@ -0,0 +1,18 @@
|
||||
const { register, navigate, Page } = require('../../../../../scripts/e2e');
|
||||
const testPageURL = 'http://localhost:3333/src/components/popover/test/basic';
|
||||
|
||||
|
||||
describe('popover: basic', () => {
|
||||
|
||||
register('navigates', navigate(testPageURL));
|
||||
|
||||
describe('present', () => {
|
||||
|
||||
register('shows modal', driver => {
|
||||
const page = new Page(driver, testPageURL);
|
||||
return page.present('.e2eShowPopover', { waitFor: 'ion-popover' });
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
@ -3,7 +3,7 @@
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Popover</title>
|
||||
<title>Popover - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -18,12 +18,12 @@
|
||||
<ion-icon slot="icon-only" name="person"></ion-icon>
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
<ion-title>Popover</ion-title>
|
||||
<ion-title>Popover - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content padding>
|
||||
<ion-button block onclick="presentPopover('profile-page', event)">Show Popover</ion-button>
|
||||
<ion-button class="e2eShowPopover" block onclick="presentPopover('profile-page', event)">Show Popover</ion-button>
|
||||
<ion-button block onclick="presentPopover('list-page', event)">Show Long List Popover</ion-button>
|
||||
<ion-button block onclick="presentPopover('profile-page')">No Event Popover</ion-button>
|
||||
|
||||
7
packages/core/src/components/radio/test/basic/e2e.js
Normal file
7
packages/core/src/components/radio/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('radio: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/radio/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Radio</title>
|
||||
<title>Radio - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,7 +11,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Radios</ion-title>
|
||||
<ion-title>Radio - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content class="radio-test outer-content">
|
||||
7
packages/core/src/components/range/test/basic/e2e.js
Normal file
7
packages/core/src/components/range/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('range: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/range/test/basic'));
|
||||
|
||||
});
|
||||
@ -3,7 +3,7 @@
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Range</title>
|
||||
<title>Range - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -13,7 +13,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Range</ion-title>
|
||||
<ion-title>Range - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content>
|
||||
7
packages/core/src/components/reorder/test/basic/e2e.js
Normal file
7
packages/core/src/components/reorder/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('reorder: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/reorder/test/basic'));
|
||||
|
||||
});
|
||||
@ -3,7 +3,7 @@
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Reorder</title>
|
||||
<title>Reorder - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -13,7 +13,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Item Reorder</ion-title>
|
||||
<ion-title>Reorder - Basic</ion-title>
|
||||
<ion-buttons slot="end">
|
||||
<ion-button onclick="toggleEdit()">Toggle</ion-button>
|
||||
</ion-buttons>
|
||||
7
packages/core/src/components/searchbar/test/basic/e2e.js
Normal file
7
packages/core/src/components/searchbar/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('searchbar: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/searchbar/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Searchbar</title>
|
||||
<title>Searchbar - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,13 +11,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>
|
||||
Basic Searchbar
|
||||
</ion-title>
|
||||
</ion-toolbar>
|
||||
<ion-toolbar>
|
||||
<ion-searchbar>
|
||||
</ion-searchbar>
|
||||
<ion-title>Searchbar - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
7
packages/core/src/components/segment/test/basic/e2e.js
Normal file
7
packages/core/src/components/segment/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('segment: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/segment/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,13 +2,19 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Segment</title>
|
||||
<title>Segment - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Segment - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<ion-toolbar no-border-top>
|
||||
<ion-segment value="Free">
|
||||
17
packages/core/src/components/select/test/basic/e2e.js
Normal file
17
packages/core/src/components/select/test/basic/e2e.js
Normal file
@ -0,0 +1,17 @@
|
||||
const { register, navigate, Page } = require('../../../../../scripts/e2e');
|
||||
const testPageURL = 'http://localhost:3333/src/components/select/test/basic';
|
||||
|
||||
describe('select: basic', () => {
|
||||
|
||||
register('navigates', navigate(testPageURL));
|
||||
|
||||
describe('present', () => {
|
||||
|
||||
register('shows selector', driver => {
|
||||
const page = new Page(driver, testPageURL);
|
||||
return page.present('.e2eSelectGender > button', { waitFor: 'ion-alert' });
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Select</title>
|
||||
<title>Select - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,7 +11,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Select</ion-title>
|
||||
<ion-title>Select - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Gender</ion-label>
|
||||
<ion-select name="gender" placeholder="Select One">
|
||||
<ion-select class="e2eSelectGender" name="gender" placeholder="Select One">
|
||||
<ion-select-option value="f">Female</ion-select-option>
|
||||
<ion-select-option value="m">Male</ion-select-option>
|
||||
</ion-select>
|
||||
7
packages/core/src/components/slides/test/basic/e2e.js
Normal file
7
packages/core/src/components/slides/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('slides: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/slides/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,18 +2,13 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Slides Basic</title>
|
||||
<title>Slides - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<ion-slides style="background: black"
|
||||
(ionSlideWillChange)="onSlideWillChange($event)"
|
||||
(ionSlideDidChange)="onSlideDidChange($event)"
|
||||
(ionSlideDrag)="onSlideDrag($event)"
|
||||
pager="true"
|
||||
effect="flip">
|
||||
<ion-slides style="background: black" pager="true" effect="flip">
|
||||
|
||||
<ion-slide style="background: red; color: white;">
|
||||
<h1>Slide 1</h1>
|
||||
7
packages/core/src/components/spinner/test/basic/e2e.js
Normal file
7
packages/core/src/components/spinner/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('spinner: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/spinner/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,13 +2,19 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Spinners</title>
|
||||
<title>Spinner - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Spinner - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<ion-list>
|
||||
<ion-list-header>
|
||||
@ -1,59 +0,0 @@
|
||||
<ion-header>
|
||||
|
||||
<ion-toolbar>
|
||||
<ion-title>Spinners</ion-title>
|
||||
</ion-toolbar>
|
||||
|
||||
</ion-header>
|
||||
|
||||
|
||||
<ion-content padding>
|
||||
|
||||
<table style="border-collapse:initial; border-spacing: 20px">
|
||||
<tr>
|
||||
<td>Platform Default</td>
|
||||
<td>
|
||||
<ion-spinner color="primary" [paused]="paused"></ion-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ios</td>
|
||||
<td>
|
||||
<ion-spinner color="secondary" name="ios" duration="1000" [paused]="paused"></ion-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ios-small</td>
|
||||
<td>
|
||||
<ion-spinner color="danger" name="ios-small" duration="1000" [paused]="paused"></ion-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>bubbles</td>
|
||||
<td>
|
||||
<ion-spinner color="light" name="bubbles" [paused]="paused"></ion-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>circles</td>
|
||||
<td>
|
||||
<ion-spinner color="secondary" name="circles" [paused]="paused"></ion-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>crescent</td>
|
||||
<td>
|
||||
<ion-spinner color="primary" name="crescent" [paused]="paused"></ion-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>dots</td>
|
||||
<td>
|
||||
<ion-spinner color="danger" name="dots" [paused]="paused"></ion-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<ion-button (click)="toggleState()">Toggle Paused</ion-button>
|
||||
|
||||
</ion-content>
|
||||
7
packages/core/src/components/spinner/test/color/e2e.js
Normal file
7
packages/core/src/components/spinner/test/color/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('spinner: color', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/spinner/test/color'));
|
||||
|
||||
});
|
||||
60
packages/core/src/components/spinner/test/color/index.html
Normal file
60
packages/core/src/components/spinner/test/color/index.html
Normal file
@ -0,0 +1,60 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Spinner - Color</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Spinner - Color</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<ion-list>
|
||||
<ion-list-header>
|
||||
Spinner Loading Indicators
|
||||
</ion-list-header>
|
||||
<ion-item>
|
||||
<ion-spinner slot="start"></ion-spinner>
|
||||
Show Default Spinner
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-spinner color="primary" slot="start" name="lines"></ion-spinner>
|
||||
Show Lines (Primary)
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-spinner color="secondary" slot="start" name="ios-small"></ion-spinner>
|
||||
Show Lines Small (Secondary)
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-spinner color="danger" slot="start" name="dots"></ion-spinner>
|
||||
Show Dots (Danger)
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-spinner color="light" slot="start" name="bubbles"></ion-spinner>
|
||||
Show Bubbles (Light)
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-spinner color="dark" slot="start" name="circles"></ion-spinner>
|
||||
Show Circles (Dark)
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-spinner color="primary" slot="start" name="crescent"></ion-spinner>
|
||||
Show Crescent (Primary)
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-spinner color="secondary" slot="start" paused></ion-spinner>
|
||||
Show Paused Default Spinner (Secondary)
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
</ion-content>
|
||||
</ion-page>
|
||||
</ion-app>
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('split-pane: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/split-pane/test/basic'));
|
||||
|
||||
});
|
||||
@ -3,7 +3,7 @@
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Split Pane</title>
|
||||
<title>Split Pane - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
7
packages/core/src/components/tabs/test/basic/e2e.js
Normal file
7
packages/core/src/components/tabs/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('tabs: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/tabs/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Spinners</title>
|
||||
<title>Tab - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
17
packages/core/src/components/toast/test/basic/e2e.js
Normal file
17
packages/core/src/components/toast/test/basic/e2e.js
Normal file
@ -0,0 +1,17 @@
|
||||
const { register, navigate, Page } = require('../../../../../scripts/e2e');
|
||||
const testPageURL = 'http://localhost:3333/src/components/toast/test/basic';
|
||||
|
||||
describe('toast: basic', () => {
|
||||
|
||||
register('navigates', navigate(testPageURL));
|
||||
|
||||
describe('present', () => {
|
||||
|
||||
register('shows bottom toast', driver => {
|
||||
const page = new Page(driver, testPageURL);
|
||||
return page.present('.e2eShowBottomToast', { waitFor: 'ion-toast' });
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
@ -3,7 +3,7 @@
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Toast</title>
|
||||
<title>Toast - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -12,13 +12,13 @@
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar color="primary">
|
||||
<ion-title>Toast</ion-title>
|
||||
<ion-toolbar>
|
||||
<ion-title>Toast - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content padding>
|
||||
<ion-button block onclick="presentToast('bottom')">Show Toast Bottom</ion-button>
|
||||
<ion-button block class="e2eShowBottomToast" onclick="presentToast('bottom')">Show Toast Bottom</ion-button>
|
||||
<ion-button block onclick="presentToast('top')">Show Toast Top</ion-button>
|
||||
<ion-button block onclick="presentToast('middle')">Show Toast Middle</ion-button>
|
||||
<ion-button block onclick="presentToastWithOptions({message: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ea voluptatibus quibusdam eum nihil optio, ullam accusamus magni, nobis suscipit reprehenderit, sequi quam amet impedit. Accusamus dolorem voluptates laborum dolor obcaecati.', duration: 2000})">Show Toast with long message</ion-button>
|
||||
@ -8,7 +8,7 @@
|
||||
$toast-ios-background: rgba(237, 237, 239, 1) !default;
|
||||
|
||||
/// @prop - Border radius of the toast wrapper
|
||||
$toast-ios-border-radius: 16px !default;
|
||||
$toast-ios-border-radius: 14px !default;
|
||||
|
||||
/// @prop - Color of the toast title
|
||||
$toast-ios-title-color: rgba(71, 71, 71, 1) !default;
|
||||
|
||||
7
packages/core/src/components/toggle/test/basic/e2e.js
Normal file
7
packages/core/src/components/toggle/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('toggle: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/toggle/test/basic'));
|
||||
|
||||
});
|
||||
@ -2,7 +2,7 @@
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic Toggle</title>
|
||||
<title>Toggle - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
@ -11,7 +11,7 @@
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Toggles</ion-title>
|
||||
<ion-title>Toggle - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content>
|
||||
7
packages/core/src/components/toolbar/test/basic/e2e.js
Normal file
7
packages/core/src/components/toolbar/test/basic/e2e.js
Normal file
@ -0,0 +1,7 @@
|
||||
const { register, navigate } = require('../../../../../scripts/e2e');
|
||||
|
||||
describe('toolbar: basic', () => {
|
||||
|
||||
register('navigates', navigate('http://localhost:3333/src/components/toolbar/test/basic'));
|
||||
|
||||
});
|
||||
31
packages/core/src/components/toolbar/test/basic/index.html
Normal file
31
packages/core/src/components/toolbar/test/basic/index.html
Normal file
@ -0,0 +1,31 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Toolbar - Basic</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Toolbar - Basic</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content></ion-content>
|
||||
|
||||
<ion-footer>
|
||||
<ion-toolbar>
|
||||
<ion-title>Footer Toolbar</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-footer>
|
||||
</ion-page>
|
||||
</ion-app>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user