From 6ee7d159ecfff3382fadb524c5c430172d40c267 Mon Sep 17 00:00:00 2001 From: Adam Duren Date: Tue, 8 Feb 2022 21:56:48 -0600 Subject: [PATCH] fix(select): value is selected when given array (#24687) Resolves #24742 --- core/src/components/select/select.tsx | 6 +- .../select/test/compare-with/e2e.ts | 37 ++++++++++ .../select/test/compare-with/index.html | 72 +++++++++++++++++++ 3 files changed, 112 insertions(+), 3 deletions(-) create mode 100644 core/src/components/select/test/compare-with/e2e.ts create mode 100644 core/src/components/select/test/compare-with/index.html diff --git a/core/src/components/select/select.tsx b/core/src/components/select/select.tsx index dadcd45707..ee59664ee5 100644 --- a/core/src/components/select/select.tsx +++ b/core/src/components/select/select.tsx @@ -248,7 +248,7 @@ export class Select implements ComponentInterface { const optClass = `${OPTION_CLASS} ${copyClasses}`; return { - role: (isOptionSelected(value, selectValue, this.compareWith) ? 'selected' : ''), + role: (isOptionSelected(selectValue, value, this.compareWith) ? 'selected' : ''), text: option.textContent, cssClass: optClass, handler: () => { @@ -282,7 +282,7 @@ export class Select implements ComponentInterface { cssClass: optClass, label: option.textContent || '', value, - checked: isOptionSelected(value, selectValue, this.compareWith), + checked: isOptionSelected(selectValue, value, this.compareWith), disabled: option.disabled }; }); @@ -302,7 +302,7 @@ export class Select implements ComponentInterface { text: option.textContent || '', cssClass: optClass, value, - checked: isOptionSelected(value, selectValue, this.compareWith), + checked: isOptionSelected(selectValue, value, this.compareWith), disabled: option.disabled, handler: (selected: any) => { this.value = selected; diff --git a/core/src/components/select/test/compare-with/e2e.ts b/core/src/components/select/test/compare-with/e2e.ts new file mode 100644 index 0000000000..ed9861db89 --- /dev/null +++ b/core/src/components/select/test/compare-with/e2e.ts @@ -0,0 +1,37 @@ +import { newE2EPage } from '@stencil/core/testing'; + +test('select: compareWith', async () => { + const page = await newE2EPage({ + url: '/src/components/select/test/compare-with?ionic:_testing=true' + }); + + const compares = []; + compares.push(await page.compareScreenshot()); + + const selectMultiple = await page.find('#multiple'); + await selectMultiple.click(); + + let alert = await page.find('ion-alert'); + await alert.waitForVisible(); + await page.waitForTimeout(250); + + compares.push(await page.compareScreenshot('should open select[multiple] with option selected')); + + await alert.callMethod('dismiss'); + + const selectSingle = await page.find('#single'); + await selectSingle.click(); + + alert = await page.find('ion-alert'); + await alert.waitForVisible(); + await page.waitForTimeout(250); + + compares.push(await page.compareScreenshot('should open select with option selected')); + + await alert.callMethod('dismiss'); + + for (const compare of compares) { + expect(compare).toMatchScreenshot(); + } + +}); \ No newline at end of file diff --git a/core/src/components/select/test/compare-with/index.html b/core/src/components/select/test/compare-with/index.html new file mode 100644 index 0000000000..026f1808a2 --- /dev/null +++ b/core/src/components/select/test/compare-with/index.html @@ -0,0 +1,72 @@ + + + + + + Select - compareWith + + + + + + + + + + + + + + Select - compareWith + + + + + + + Select multiple using objects and compareWith + + + + Select using objects and compareWith + + + + + + + + + + + \ No newline at end of file