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

fix(select): pass click event to popover interface (#17146)

Browse Source 
also updates e2e test so that it will continue to take screenshots after mismatches and adds the popover example to avoid future regressions

references #16715 fixes #17142
This commit is contained in:
Brandy Carney
2019-01-17 12:16:31 -05:00
committed by GitHub
parent ceae5d20d7
commit 3ff9fafe8e
3 changed files with 52 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
core/src/components/select/select.tsx
View File

@ -139,8 +139,8 @@ export class Select implements ComponentInterface {
} }
@Listen('click') @Listen('click')
onClick() { onClick(ev: UIEvent) {
this.open(); this.open(ev);
} }
async componentDidLoad() { async componentDidLoad() {

58
core/src/components/select/test/basic/e2e.ts
View File

@ -5,28 +5,68 @@ test('select: basic', async () => {
url: '/src/components/select/test/basic?ionic:_testing=true' url: '/src/components/select/test/basic?ionic:_testing=true'
}); });
let compare = await page.compareScreenshot(); const compares = [];
expect(compare).toMatchScreenshot(); compares.push(await page.compareScreenshot());
// Gender Alert Select
let select = await page.find('#gender'); let select = await page.find('#gender');
await select.click(); await select.click();
const alert = await page.find('ion-alert'); let alert = await page.find('ion-alert');
await alert.waitForVisible(); await alert.waitForVisible();
await page.waitFor(250); await page.waitFor(250);
compare = await page.compareScreenshot('should open gender single select'); compares.push(await page.compareScreenshot('should open gender single select'));
expect(compare).toMatchScreenshot();
await alert.callMethod('dismiss'); await alert.callMethod('dismiss');
select = await page.find('#customSelect'); // Skittles Action Sheet Select
select = await page.find('#skittles');
await select.click(); await select.click();
const actionSheet = await page.find('ion-action-sheet'); let actionSheet = await page.find('ion-action-sheet');
await actionSheet.waitForVisible(); await actionSheet.waitForVisible();
await page.waitFor(250); await page.waitFor(250);
compare = await page.compareScreenshot('should open custom action sheet select'); compares.push(await page.compareScreenshot('should open skittles action sheet select'));
expect(compare).toMatchScreenshot();
await actionSheet.callMethod('dismiss');
// Custom Alert Select
select = await page.find('#customAlertSelect');
await select.click();
alert = await page.find('ion-alert');
await alert.waitForVisible();
await page.waitFor(250);
compares.push(await page.compareScreenshot('should open custom alert select'));
await alert.callMethod('dismiss');
// Custom Popover Select
select = await page.find('#customPopoverSelect');
await select.click();
const popover = await page.find('ion-popover');
await popover.waitForVisible();
await page.waitFor(250);
compares.push(await page.compareScreenshot('should open custom popover select'));
// Custom Action Sheet Select
select = await page.find('#customActionSheetSelect');
await select.click();
actionSheet = await page.find('ion-action-sheet');
await actionSheet.waitForVisible();
await page.waitFor(250);
compares.push(await page.compareScreenshot('should open custom action sheet select'));
await actionSheet.callMethod('dismiss');
for (const compare of compares) {
expect(compare).toMatchScreenshot();
}
}); });

2
core/src/components/select/test/basic/index.html
View File

@ -44,7 +44,7 @@
<ion-item> <ion-item>
<ion-label>Skittles</ion-label> <ion-label>Skittles</ion-label>
<ion-select id="customSelect" interface="action-sheet" name="skittles"> <ion-select id="skittles" interface="action-sheet" name="skittles">
<ion-select-option value="red">Red</ion-select-option> <ion-select-option value="red">Red</ion-select-option>
<ion-select-option value="purple">Purple</ion-select-option> <ion-select-option value="purple">Purple</ion-select-option>
<ion-select-option value="yellow">Yellow</ion-select-option> <ion-select-option value="yellow">Yellow</ion-select-option>