From d29f721949bd91ef1cb1e9229f31f5db8dbe4c1c Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Mon, 23 Jan 2023 14:23:02 +0000 Subject: [PATCH 1/3] test(picker-column): add failing test --- .../picker-column/test/picker-column.spec.tsx | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) create mode 100644 core/src/components/picker-column/test/picker-column.spec.tsx diff --git a/core/src/components/picker-column/test/picker-column.spec.tsx b/core/src/components/picker-column/test/picker-column.spec.tsx new file mode 100644 index 00000000000..f9d8006b3a0 --- /dev/null +++ b/core/src/components/picker-column/test/picker-column.spec.tsx @@ -0,0 +1,18 @@ +import { h } from '@stencil/core'; +import { newSpecPage } from '@stencil/core/testing'; +import { PickerColumnCmp } from '../picker-column'; + +describe('picker-column', () => { + it('should add class to host of component', async () => { + const col = { cssClass: 'test-class', options: [] }; + + const page = await newSpecPage({ + components: [PickerColumnCmp], + template: () => () + }); + + const pickerCol = page.body.querySelector('ion-picker-column'); + expect(pickerCol.classList.contains('test-class')).toBe(true) + }); +}); + From 978274b1c93e8a1bd974caaaa80509fef907fa21 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Mon, 23 Jan 2023 14:23:27 +0000 Subject: [PATCH 2/3] fix(picker-column): cssClass is set on column --- core/src/components/picker-column/picker-column.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/core/src/components/picker-column/picker-column.tsx b/core/src/components/picker-column/picker-column.tsx index 5c20f7c1a8e..f75ce92ad6d 100644 --- a/core/src/components/picker-column/picker-column.tsx +++ b/core/src/components/picker-column/picker-column.tsx @@ -5,6 +5,7 @@ import { getIonMode } from '../../global/ionic-global'; import type { Gesture, GestureDetail, PickerColumn } from '../../interface'; import { clamp } from '../../utils/helpers'; import { hapticSelectionChanged, hapticSelectionEnd, hapticSelectionStart } from '../../utils/native/haptic'; +import { getClassMap } from '../../utils/theme'; /** * @internal @@ -368,6 +369,7 @@ export class PickerColumnCmp implements ComponentInterface { 'picker-col': true, 'picker-opts-left': this.col.align === 'left', 'picker-opts-right': this.col.align === 'right', + ...getClassMap(col.cssClass), }} style={{ 'max-width': this.col.columnWidth, From 3869de8e48ab42f22f34e98d3d088eab8e84850c Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Mon, 23 Jan 2023 09:24:01 -0500 Subject: [PATCH 3/3] chore(): lint --- .../src/components/picker-column/test/picker-column.spec.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/core/src/components/picker-column/test/picker-column.spec.tsx b/core/src/components/picker-column/test/picker-column.spec.tsx index f9d8006b3a0..f072f92c2c1 100644 --- a/core/src/components/picker-column/test/picker-column.spec.tsx +++ b/core/src/components/picker-column/test/picker-column.spec.tsx @@ -8,11 +8,10 @@ describe('picker-column', () => { const page = await newSpecPage({ components: [PickerColumnCmp], - template: () => () + template: () => , }); const pickerCol = page.body.querySelector('ion-picker-column'); - expect(pickerCol.classList.contains('test-class')).toBe(true) + expect(pickerCol.classList.contains('test-class')).toBe(true); }); }); -