From 7d5df9b364c5040a7c63ced2673a78c676abe98d Mon Sep 17 00:00:00 2001 From: Anton Lazarev Date: Thu, 14 Sep 2023 10:33:48 +0100 Subject: [PATCH 01/15] screenshots --- .../specs/visual-regression/visual-regression.spec.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/integration/specs/visual-regression/visual-regression.spec.js b/tests/integration/specs/visual-regression/visual-regression.spec.js index 264f0bfa1..20081e814 100644 --- a/tests/integration/specs/visual-regression/visual-regression.spec.js +++ b/tests/integration/specs/visual-regression/visual-regression.spec.js @@ -33,7 +33,7 @@ describe('Visual regression tests', () => { await storybookStore.cacheAllCSFFiles(); let stories = Object.values(storybookStore.getStoriesJsonData().stories); - const storyIdFilter = Cypress.env('storyIdFilter'); + const storyIdFilter = 'input-field'; if (storyIdFilter) { stories = stories.filter(story => story.id.match(storyIdFilter)); } From 4539a52686323c90a8d83f75d2e31b2ea0bc95ba Mon Sep 17 00:00:00 2001 From: Anton Lazarev Date: Thu, 14 Sep 2023 14:40:36 +0100 Subject: [PATCH 02/15] remove tw from html --- src/components/ec-input-field/ec-input-field.vue | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/components/ec-input-field/ec-input-field.vue b/src/components/ec-input-field/ec-input-field.vue index a0c6231a5..d55ebc058 100644 --- a/src/components/ec-input-field/ec-input-field.vue +++ b/src/components/ec-input-field/ec-input-field.vue @@ -106,8 +106,6 @@ import { import type { Maybe } from '../../../global'; import useConfig from '../../composables/use-ec-config'; -// eslint-disable-next-line @typescript-eslint/ban-ts-comment -// @ts-ignore import vEcTooltip from '../../directives/ec-tooltip'; import { getUid } from '../../utils/uid'; import EcIcon from '../ec-icon'; From 428a1f517dd1de9fc512fa65a111213028c4e265 Mon Sep 17 00:00:00 2001 From: Anton Lazarev Date: Fri, 15 Sep 2023 09:47:29 +0100 Subject: [PATCH 03/15] [ONL-7786] EcTextFilter --- .../ec-table-filter/ec-table-filter.story.js | 4 ++ .../ec-text-filter/ec-text-filter.story.ts | 46 +++++++++++++++++++ .../ec-text-filter/ec-text-filter.vue | 46 +++++++++++++++++++ src/components/ec-text-filter/index.ts | 3 ++ src/components/ec-text-filter/types.ts | 14 ++++++ src/main.js | 1 + 6 files changed, 114 insertions(+) create mode 100644 src/components/ec-text-filter/ec-text-filter.story.ts create mode 100644 src/components/ec-text-filter/ec-text-filter.vue create mode 100644 src/components/ec-text-filter/index.ts create mode 100644 src/components/ec-text-filter/types.ts diff --git a/src/components/ec-table-filter/ec-table-filter.story.js b/src/components/ec-table-filter/ec-table-filter.story.js index 5d63dac46..9a742c374 100644 --- a/src/components/ec-table-filter/ec-table-filter.story.js +++ b/src/components/ec-table-filter/ec-table-filter.story.js @@ -3,6 +3,7 @@ import { ref, watchEffect } from 'vue'; import EcCurrencyFilter from '../ec-currency-filter'; import EcDateRangeFilter from '../ec-date-range-filter'; import EcSyncMultipleValuesFilter from '../ec-sync-multiple-values-filter'; +import EcTextFilter from '../ec-text-filter'; import EcTableFilter from './ec-table-filter.vue'; export default { @@ -85,5 +86,8 @@ basic.args = { component: EcCurrencyFilter, comparisonSymbolItems, currencyItems, + }, { + name: 'Text search', + component: EcTextFilter, }], }; diff --git a/src/components/ec-text-filter/ec-text-filter.story.ts b/src/components/ec-text-filter/ec-text-filter.story.ts new file mode 100644 index 000000000..e2aa4bad2 --- /dev/null +++ b/src/components/ec-text-filter/ec-text-filter.story.ts @@ -0,0 +1,46 @@ +import type { Meta, StoryObj } from '@storybook/vue3'; +import { ref } from 'vue'; + +import EcTextFilter from './ec-text-filter.vue'; + +const meta: Meta = { + title: 'Filters/Text filter', + component: EcTextFilter, + argTypes: { + onChange: { action: 'change' }, + }, +}; + +export default meta; + +type Story = StoryObj; + +export const Basic: Story = { + render: args => ({ + setup() { + const modelValue = ref(args.modelValue); + + function handleChange(event) { + modelValue.value = event; + } + + return { + args, + modelValue, + handleChange, + }; + }, + components: { EcTextFilter }, + template: ` +
+ +
`, + }), + args: { + modelValue: 'Some text', + }, +}; diff --git a/src/components/ec-text-filter/ec-text-filter.vue b/src/components/ec-text-filter/ec-text-filter.vue new file mode 100644 index 000000000..361443d59 --- /dev/null +++ b/src/components/ec-text-filter/ec-text-filter.vue @@ -0,0 +1,46 @@ + + + diff --git a/src/components/ec-text-filter/index.ts b/src/components/ec-text-filter/index.ts new file mode 100644 index 000000000..85f834fa6 --- /dev/null +++ b/src/components/ec-text-filter/index.ts @@ -0,0 +1,3 @@ +export { default } from './ec-text-filter.vue'; +export * as types from './types'; + diff --git a/src/components/ec-text-filter/types.ts b/src/components/ec-text-filter/types.ts new file mode 100644 index 000000000..0ea5f5644 --- /dev/null +++ b/src/components/ec-text-filter/types.ts @@ -0,0 +1,14 @@ +import type { InputFieldProps } from '../ec-input-field/types'; + +export interface TextFilterProps { + modelValue?: InputFieldProps['modelValue'] + inputProps?: InputFieldProps +} + +export enum TextFilterEvent { + CHANGE = 'change', +} + +export interface TextFilterEvents { + [TextFilterEvent.CHANGE]: InputFieldProps['modelValue'] +} diff --git a/src/main.js b/src/main.js index 9b822a337..7b8c991f5 100644 --- a/src/main.js +++ b/src/main.js @@ -56,6 +56,7 @@ export { default as EcSyncMultipleValuesFilter } from './components/ec-sync-mult export { default as EcTable } from './components/ec-table'; export { default as EcTableFilter } from './components/ec-table-filter'; export { default as EcTag, types as EcTagTypes } from './components/ec-tag'; +export { default as EcTextFilter, types as EcTextFilterTypes } from './components/ec-text-filter'; export { default as EcTextarea } from './components/ec-textarea'; export { default as EcTimer } from './components/ec-timer'; export { default as EcToaster } from './components/ec-toaster'; From 8c9e44bef81039dcdfbabe7eeae5c9b89bbfb70f Mon Sep 17 00:00:00 2001 From: Anton Lazarev Date: Mon, 18 Sep 2023 11:11:14 +0100 Subject: [PATCH 04/15] main functionality --- src/components/ec-table-filter/ec-table-filter.story.js | 4 ---- src/components/ec-text-filter/ec-text-filter.story.ts | 3 ++- src/components/ec-text-filter/ec-text-filter.vue | 2 +- 3 files changed, 3 insertions(+), 6 deletions(-) diff --git a/src/components/ec-table-filter/ec-table-filter.story.js b/src/components/ec-table-filter/ec-table-filter.story.js index 9a742c374..5d63dac46 100644 --- a/src/components/ec-table-filter/ec-table-filter.story.js +++ b/src/components/ec-table-filter/ec-table-filter.story.js @@ -3,7 +3,6 @@ import { ref, watchEffect } from 'vue'; import EcCurrencyFilter from '../ec-currency-filter'; import EcDateRangeFilter from '../ec-date-range-filter'; import EcSyncMultipleValuesFilter from '../ec-sync-multiple-values-filter'; -import EcTextFilter from '../ec-text-filter'; import EcTableFilter from './ec-table-filter.vue'; export default { @@ -86,8 +85,5 @@ basic.args = { component: EcCurrencyFilter, comparisonSymbolItems, currencyItems, - }, { - name: 'Text search', - component: EcTextFilter, }], }; diff --git a/src/components/ec-text-filter/ec-text-filter.story.ts b/src/components/ec-text-filter/ec-text-filter.story.ts index e2aa4bad2..95e0195c1 100644 --- a/src/components/ec-text-filter/ec-text-filter.story.ts +++ b/src/components/ec-text-filter/ec-text-filter.story.ts @@ -2,6 +2,7 @@ import type { Meta, StoryObj } from '@storybook/vue3'; import { ref } from 'vue'; import EcTextFilter from './ec-text-filter.vue'; +import type { TextFilterEvent, TextFilterEvents } from './types'; const meta: Meta = { title: 'Filters/Text filter', @@ -20,7 +21,7 @@ export const Basic: Story = { setup() { const modelValue = ref(args.modelValue); - function handleChange(event) { + function handleChange(event: TextFilterEvents[TextFilterEvent.CHANGE]) { modelValue.value = event; } diff --git a/src/components/ec-text-filter/ec-text-filter.vue b/src/components/ec-text-filter/ec-text-filter.vue index 361443d59..c5af087f8 100644 --- a/src/components/ec-text-filter/ec-text-filter.vue +++ b/src/components/ec-text-filter/ec-text-filter.vue @@ -8,7 +8,7 @@ v-bind="inputProps" :left-icon="IconName.SimpleSearch" :icon="rightIcon" - @iconClick="emit(TextFilterEvent.CHANGE, '')" + @icon-click="emit(TextFilterEvent.CHANGE, '')" /> From 90e38add1bc1b646223ea66620177060cba6ca2d Mon Sep 17 00:00:00 2001 From: Anton Lazarev Date: Mon, 18 Sep 2023 12:04:41 +0100 Subject: [PATCH 05/15] unit tests --- .../__snapshots__/ec-text-filter.spec.ts.snap | 182 ++++++++++++++++++ .../ec-text-filter/ec-text-filter.spec.ts | 120 ++++++++++++ .../ec-text-filter/ec-text-filter.vue | 2 + 3 files changed, 304 insertions(+) create mode 100644 src/components/ec-text-filter/__snapshots__/ec-text-filter.spec.ts.snap create mode 100644 src/components/ec-text-filter/ec-text-filter.spec.ts diff --git a/src/components/ec-text-filter/__snapshots__/ec-text-filter.spec.ts.snap b/src/components/ec-text-filter/__snapshots__/ec-text-filter.spec.ts.snap new file mode 100644 index 000000000..ddf91b992 --- /dev/null +++ b/src/components/ec-text-filter/__snapshots__/ec-text-filter.spec.ts.snap @@ -0,0 +1,182 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`EcTextFilter should display properly with the given props 1`] = ` +
+
+ + +
+ + + +
+
+ + + +
+ +
+
+`; + +exports[`EcTextFilter should render close icon depends on modelValue 1`] = ` +DOMWrapper { + "isDisabled": [Function], + "wrapperElement":
+ + + +
, +} +`; + +exports[`EcTextFilter should render correct icon when modelValue is not undefined 1`] = ` +DOMWrapper { + "isDisabled": [Function], + "wrapperElement":
+ + + +
, +} +`; + +exports[`EcTextFilter should render correct icon when typing 1`] = ` +
+
+ + +
+ + + +
+ + +
+
+`; + +exports[`EcTextFilter should render with a sensitive class when isSensitive prop is set to true 1`] = ` +
+
+ + +
+ + + +
+
+ + + +
+ +
+
+`; diff --git a/src/components/ec-text-filter/ec-text-filter.spec.ts b/src/components/ec-text-filter/ec-text-filter.spec.ts new file mode 100644 index 000000000..e265602b8 --- /dev/null +++ b/src/components/ec-text-filter/ec-text-filter.spec.ts @@ -0,0 +1,120 @@ +import type { ComponentMountingOptions } from '@vue/test-utils'; +import { mount } from '@vue/test-utils'; +import { defineComponent } from 'vue'; + +import type { CVueWrapper } from '../../../tests/utils/global'; +import EcTextFilter from './ec-text-filter.vue'; +import type { TextFilterProps } from './types'; +import { TextFilterEvent } from './types'; + +describe('EcTextFilter', () => { + function mountComponent(props?: TextFilterProps, mountOpts?: ComponentMountingOptions): CVueWrapper { + return mount( + // eslint-disable-next-line @typescript-eslint/no-explicit-any + EcTextFilter as any, + { + props: { + modelValue: 'Text test', + ...props, + }, + ...mountOpts, + }, + ) as unknown as CVueWrapper; + } + + function mountInputFieldAsTemplate( + template: string, + props: TextFilterProps, + wrapperComponentOpts: Record, + mountOpts?: ComponentMountingOptions, + ) { + const Component = defineComponent({ + components: { EcTextFilter }, + template, + ...wrapperComponentOpts, + }); + + // eslint-disable-next-line @typescript-eslint/no-explicit-any + return mount>(Component as any, { + props, + ...mountOpts, + }) as unknown as CVueWrapper; + } + + it('should display properly with the given props', () => { + const wrapper = mountComponent(); + expect(wrapper.element).toMatchSnapshot(); + }); + + it('should set the v-model on the value of the input and change when it changes', async () => { + const wrapper = mountInputFieldAsTemplate( + '', + {}, + { + data() { + return { text: '' }; + }, + }, + ); + + expect((wrapper.findByDataTest('ec-input-field__input').element as HTMLInputElement).value).toBe(''); + await wrapper.setData({ text: 'some text' }); + expect((wrapper.findByDataTest('ec-input-field__input').element as HTMLInputElement).value).toBe('some text'); + }); + + it('should render close icon depends on modelValue', async () => { + const wrapper = mountInputFieldAsTemplate( + '', + {}, + { + data() { + return { text: '' }; + }, + }, + ); + + expect((wrapper.findByDataTest('ec-input-field__input').element as HTMLInputElement).value).toBe(''); + expect(wrapper.findByDataTest('ec-input-field__icon-wrapper').exists()).toBe(false); + + await wrapper.setData({ text: 'some text' }); + + expect(wrapper.findByDataTest('ec-input-field__icon-wrapper')).toMatchSnapshot(); + }); + + it('should emit the value when you write on the input', async () => { + const wrapper = mountInputFieldAsTemplate( + '', + {}, + { + data() { + return { text: '' }; + }, + }, + ); + + expect((wrapper.findByDataTest('ec-input-field__input').element as HTMLInputElement).value).toBe(''); + await wrapper.findByDataTest('ec-input-field__input').setValue('some text'); + expect(wrapper.findComponent(EcTextFilter).emitted()[TextFilterEvent.CHANGE]?.[0]).toEqual(['some text']); + }); + + it('should emit the empty value when you click on close icon', async () => { + const wrapper = mountInputFieldAsTemplate( + '', + {}, + { + data() { + return { text: 'some text' }; + }, + }, + ); + + await wrapper.findByDataTest('ec-input-field__icon').trigger('click'); + expect(wrapper.findComponent(EcTextFilter).emitted()[TextFilterEvent.CHANGE]?.[0]).toEqual(['']); + }); + + it('should render with a sensitive class when isSensitive prop is set to true', () => { + const wrapper = mountComponent({ inputProps: { isSensitive: true } }); + + expect(wrapper.element).toMatchSnapshot(); + }); +}); diff --git a/src/components/ec-text-filter/ec-text-filter.vue b/src/components/ec-text-filter/ec-text-filter.vue index c5af087f8..270e93303 100644 --- a/src/components/ec-text-filter/ec-text-filter.vue +++ b/src/components/ec-text-filter/ec-text-filter.vue @@ -7,6 +7,7 @@ v-model="inputModel" v-bind="inputProps" :left-icon="IconName.SimpleSearch" + :type="InputFieldType.TEXT" :icon="rightIcon" @icon-click="emit(TextFilterEvent.CHANGE, '')" /> @@ -19,6 +20,7 @@ import { computed } from 'vue'; import { IconName } from '../ec-icon/icon-names'; import EcInputField from '../ec-input-field/ec-input-field.vue'; import type { InputFieldProps } from '../ec-input-field/types'; +import { InputFieldType } from '../ec-input-field/types'; import type { TextFilterEvents } from './types'; import { TextFilterEvent } from './types'; From 8cb3a7826691ba2bf838a77b5c617ca033f658c6 Mon Sep 17 00:00:00 2001 From: Anton Lazarev Date: Mon, 18 Sep 2023 12:16:00 +0100 Subject: [PATCH 06/15] screenshotz --- .../filters-text-filter--basic__chrome.snap.png | Bin 0 -> 8420 bytes .../filters-text-filter--basic__firefox.snap.png | Bin 0 -> 8484 bytes 2 files changed, 0 insertions(+), 0 deletions(-) create mode 100644 tests/integration/snapshots/visual-regression.spec.js/filters-text-filter--basic__chrome.snap.png create mode 100644 tests/integration/snapshots/visual-regression.spec.js/filters-text-filter--basic__firefox.snap.png diff --git a/tests/integration/snapshots/visual-regression.spec.js/filters-text-filter--basic__chrome.snap.png b/tests/integration/snapshots/visual-regression.spec.js/filters-text-filter--basic__chrome.snap.png new file mode 100644 index 0000000000000000000000000000000000000000..86cb98c6ca2b84c1be7cd84a4a67f0bc0b90f5fc GIT binary patch literal 8420 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 O#}4}(s`~T!@BSNLc;)2) literal 0 HcmV?d00001 diff --git a/tests/integration/snapshots/visual-regression.spec.js/filters-text-filter--basic__firefox.snap.png b/tests/integration/snapshots/visual-regression.spec.js/filters-text-filter--basic__firefox.snap.png new file mode 100644 index 0000000000000000000000000000000000000000..eb3e2f9733553a79b645c79416b3574f756eefe3 GIT binary patch literal 8484 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 ZrJTdVE{KVzW_X|AI1Ox literal 0 HcmV?d00001 From 4b740eb0aca03f5b70e9996d23ba8fa1e309adc3 Mon Sep 17 00:00:00 2001 From: Anton Lazarev Date: Mon, 18 Sep 2023 12:19:19 +0100 Subject: [PATCH 07/15] fix TS --- src/components/ec-input-field/ec-input-field.vue | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/components/ec-input-field/ec-input-field.vue b/src/components/ec-input-field/ec-input-field.vue index d55ebc058..a0c6231a5 100644 --- a/src/components/ec-input-field/ec-input-field.vue +++ b/src/components/ec-input-field/ec-input-field.vue @@ -106,6 +106,8 @@ import { import type { Maybe } from '../../../global'; import useConfig from '../../composables/use-ec-config'; +// eslint-disable-next-line @typescript-eslint/ban-ts-comment +// @ts-ignore import vEcTooltip from '../../directives/ec-tooltip'; import { getUid } from '../../utils/uid'; import EcIcon from '../ec-icon'; From 202630a268ebe1926ef5a8d78dd70781cd6725d5 Mon Sep 17 00:00:00 2001 From: Anton Lazarev Date: Mon, 18 Sep 2023 12:21:38 +0100 Subject: [PATCH 08/15] revert story isolation --- .../specs/visual-regression/visual-regression.spec.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/integration/specs/visual-regression/visual-regression.spec.js b/tests/integration/specs/visual-regression/visual-regression.spec.js index 20081e814..264f0bfa1 100644 --- a/tests/integration/specs/visual-regression/visual-regression.spec.js +++ b/tests/integration/specs/visual-regression/visual-regression.spec.js @@ -33,7 +33,7 @@ describe('Visual regression tests', () => { await storybookStore.cacheAllCSFFiles(); let stories = Object.values(storybookStore.getStoriesJsonData().stories); - const storyIdFilter = 'input-field'; + const storyIdFilter = Cypress.env('storyIdFilter'); if (storyIdFilter) { stories = stories.filter(story => story.id.match(storyIdFilter)); } From dc6559050657529d9d70c21253d840d688d67afa Mon Sep 17 00:00:00 2001 From: Anton Lazarev Date: Mon, 18 Sep 2023 12:27:32 +0100 Subject: [PATCH 09/15] remove obsolete --- .../__snapshots__/ec-text-filter.spec.ts.snap | 58 ------------------- 1 file changed, 58 deletions(-) diff --git a/src/components/ec-text-filter/__snapshots__/ec-text-filter.spec.ts.snap b/src/components/ec-text-filter/__snapshots__/ec-text-filter.spec.ts.snap index ddf91b992..b131ff84c 100644 --- a/src/components/ec-text-filter/__snapshots__/ec-text-filter.spec.ts.snap +++ b/src/components/ec-text-filter/__snapshots__/ec-text-filter.spec.ts.snap @@ -72,64 +72,6 @@ DOMWrapper { } `; -exports[`EcTextFilter should render correct icon when modelValue is not undefined 1`] = ` -DOMWrapper { - "isDisabled": [Function], - "wrapperElement":
- - - -
, -} -`; - -exports[`EcTextFilter should render correct icon when typing 1`] = ` -
-
- - -
- - - -
- - -
-
-`; - exports[`EcTextFilter should render with a sensitive class when isSensitive prop is set to true 1`] = `
Date: Mon, 18 Sep 2023 13:03:20 +0100 Subject: [PATCH 10/15] update table-filter spec and story --- .../ec-table-filter.spec.js.snap | 184 ++++++++++++++++++ .../ec-table-filter/ec-table-filter.spec.js | 8 +- .../ec-table-filter/ec-table-filter.story.js | 7 +- 3 files changed, 196 insertions(+), 3 deletions(-) diff --git a/src/components/ec-table-filter/__snapshots__/ec-table-filter.spec.js.snap b/src/components/ec-table-filter/__snapshots__/ec-table-filter.spec.js.snap index ca3ee6361..6b3b3addb 100644 --- a/src/components/ec-table-filter/__snapshots__/ec-table-filter.spec.js.snap +++ b/src/components/ec-table-filter/__snapshots__/ec-table-filter.spec.js.snap @@ -486,6 +486,40 @@ exports[`EcTableFilter should hide the clear filters button if there isn't any p
+
+
+ + +
+ + + +
+ + +
+
@@ -978,6 +1012,40 @@ exports[`EcTableFilter should hide the clear filters button when the user desele +
+
+ + +
+ + + +
+ + +
+
@@ -1469,6 +1537,40 @@ exports[`EcTableFilter should render correctly if all the required props are pas +
+
+ + +
+ + + +
+ + +
+
@@ -1961,6 +2063,40 @@ exports[`EcTableFilter should render custom attributes 1`] = ` +
+
+ + +
+ + + +
+ + +
+
@@ -2467,6 +2603,54 @@ exports[`EcTableFilter should render with pre-selected filters if the value prop +
+
+ + +
+ + + +
+
+ + + +
+ +
+