@adyen/eslint-plugin-bento 2.10.0 → 2.12.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +24 -0
- package/configs/vue-recommended.js +3 -0
- package/configs/vue-strict.js +3 -0
- package/index.js +3 -0
- package/package.json +2 -2
- package/rules/deprecation-bento-data-grid-cell-action-menu-item-handler/README.md +48 -0
- package/rules/deprecation-bento-data-grid-cell-action-menu-item-handler/__tests__/deprecation-bento-data-grid-cell-action-menu-item-handler.vue +63 -0
- package/rules/deprecation-bento-data-grid-cell-action-menu-item-handler/__tests__/eslint.config.js +26 -0
- package/rules/deprecation-bento-data-grid-cell-action-menu-item-handler/deprecation-bento-data-grid-cell-action-menu-item-handler.integration.test.ts +24 -0
- package/rules/deprecation-bento-data-grid-cell-action-menu-item-handler/deprecation-bento-data-grid-cell-action-menu-item-handler.js +232 -0
- package/rules/deprecation-bento-data-grid-cell-action-menu-item-handler/deprecation-bento-data-grid-cell-action-menu-item-handler.test.ts +116 -0
- package/rules/deprecation-bento-date-range-picker-has-actions-prop/README.md +50 -0
- package/rules/deprecation-bento-date-range-picker-has-actions-prop/__tests__/deprecation-bento-date-range-picker-has-actions-prop.vue +10 -0
- package/rules/deprecation-bento-date-range-picker-has-actions-prop/__tests__/eslint.config.js +29 -0
- package/rules/deprecation-bento-date-range-picker-has-actions-prop/__tests__/remove/deprecation-bento-date-range-picker-has-actions-prop.vue +11 -0
- package/rules/deprecation-bento-date-range-picker-has-actions-prop/__tests__/remove/eslint.config.js +29 -0
- package/rules/deprecation-bento-date-range-picker-has-actions-prop/deprecation-bento-date-range-picker-has-actions-prop.integration.test.ts +47 -0
- package/rules/deprecation-bento-date-range-picker-has-actions-prop/deprecation-bento-date-range-picker-has-actions-prop.js +205 -0
- package/rules/deprecation-bento-date-range-picker-has-actions-prop/deprecation-bento-date-range-picker-has-actions-prop.test.ts +176 -0
- package/rules/deprecation-country-custom-usage/README.md +151 -0
- package/rules/deprecation-country-custom-usage/__tests__/deprecation-country-custom-usage.vue +93 -0
- package/rules/deprecation-country-custom-usage/__tests__/eslint.config.js +25 -0
- package/rules/deprecation-country-custom-usage/deprecation-country-custom-usage.integration.test.ts +22 -0
- package/rules/deprecation-country-custom-usage/deprecation-country-custom-usage.js +569 -0
- package/rules/deprecation-country-custom-usage/deprecation-country-custom-usage.test.ts +380 -0
|
@@ -0,0 +1,380 @@
|
|
|
1
|
+
import { RuleTester } from 'eslint';
|
|
2
|
+
import vueParser from 'vue-eslint-parser';
|
|
3
|
+
import tsParser from '@typescript-eslint/parser';
|
|
4
|
+
import rule from './deprecation-country-custom-usage';
|
|
5
|
+
|
|
6
|
+
const ruleTester = new RuleTester({
|
|
7
|
+
languageOptions: {
|
|
8
|
+
ecmaVersion: 'latest',
|
|
9
|
+
sourceType: 'module',
|
|
10
|
+
parser: vueParser,
|
|
11
|
+
parserOptions: {
|
|
12
|
+
parser: tsParser,
|
|
13
|
+
},
|
|
14
|
+
},
|
|
15
|
+
});
|
|
16
|
+
|
|
17
|
+
describe('@adyen/bento/deprecation-country-custom-usage', () => {
|
|
18
|
+
/* ------------------------------------------------ */
|
|
19
|
+
/* CASE 1: bento-country */
|
|
20
|
+
/* ------------------------------------------------ */
|
|
21
|
+
ruleTester.run('bento-country', rule, {
|
|
22
|
+
valid: [
|
|
23
|
+
{
|
|
24
|
+
name: 'Valid: variant="name"',
|
|
25
|
+
filename: 'test.vue',
|
|
26
|
+
code: `<template><bento-country code="NL" variant="name" /></template>`,
|
|
27
|
+
},
|
|
28
|
+
{
|
|
29
|
+
name: 'Valid: no variant or label',
|
|
30
|
+
filename: 'test.vue',
|
|
31
|
+
code: `<template><bento-country code="NL" /></template>`,
|
|
32
|
+
},
|
|
33
|
+
{
|
|
34
|
+
name: 'Valid: dynamic non-custom variant',
|
|
35
|
+
filename: 'test.vue',
|
|
36
|
+
code: `<template><bento-country code="NL" :variant="'name'" /></template>`,
|
|
37
|
+
},
|
|
38
|
+
],
|
|
39
|
+
invalid: [
|
|
40
|
+
{
|
|
41
|
+
name: 'Invalid: variant="custom" only',
|
|
42
|
+
filename: 'test.vue',
|
|
43
|
+
code: `<template><bento-country code="NL" variant="custom" /></template>`,
|
|
44
|
+
errors: [{ messageId: 'countryCustomVariant' }],
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
name: 'Invalid: label only (no variant="custom")',
|
|
48
|
+
filename: 'test.vue',
|
|
49
|
+
code: `<template><bento-country code="NL" label="Custom label" /></template>`,
|
|
50
|
+
errors: [{ messageId: 'countryUnusedLabel' }],
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
name: 'Invalid: dynamic label only',
|
|
54
|
+
filename: 'test.vue',
|
|
55
|
+
code: `<template><bento-country code="NL" :label="customLabel" /></template>`,
|
|
56
|
+
errors: [{ messageId: 'countryUnusedLabel' }],
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
name: 'Invalid: variant="custom" + label (both)',
|
|
60
|
+
filename: 'test.vue',
|
|
61
|
+
code: `<template><bento-country code="NL" variant="custom" label="Custom label" /></template>`,
|
|
62
|
+
errors: [{ messageId: 'countryCustomVariant' }],
|
|
63
|
+
},
|
|
64
|
+
{
|
|
65
|
+
name: 'Invalid: dynamic variant + label',
|
|
66
|
+
filename: 'test.vue',
|
|
67
|
+
code: `<template><bento-country code="NL" :variant="'custom'" label="Custom label" /></template>`,
|
|
68
|
+
errors: [{ messageId: 'countryCustomVariant' }],
|
|
69
|
+
},
|
|
70
|
+
{
|
|
71
|
+
name: 'Invalid: BentoCountryVariant.CUSTOM + label',
|
|
72
|
+
filename: 'test.vue',
|
|
73
|
+
code: `<template><bento-country code="NL" :variant="BentoCountryVariant.CUSTOM" label="Custom label" /></template>`,
|
|
74
|
+
errors: [{ messageId: 'countryCustomVariant' }],
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
name: 'Invalid: v-bind:variant longhand',
|
|
78
|
+
filename: 'test.vue',
|
|
79
|
+
code: `<template><bento-country code="NL" v-bind:variant="'custom'" label="Custom label" /></template>`,
|
|
80
|
+
errors: [{ messageId: 'countryCustomVariant' }],
|
|
81
|
+
},
|
|
82
|
+
],
|
|
83
|
+
});
|
|
84
|
+
|
|
85
|
+
/* ------------------------------------------------ */
|
|
86
|
+
/* CASE 2: bento-dropdown-country */
|
|
87
|
+
/* ------------------------------------------------ */
|
|
88
|
+
ruleTester.run('bento-dropdown-country', rule, {
|
|
89
|
+
valid: [
|
|
90
|
+
{
|
|
91
|
+
name: 'Valid: items without labels',
|
|
92
|
+
filename: 'test.vue',
|
|
93
|
+
code: `<template><bento-dropdown-country :items="[{ value: 'NL' }, { value: 'BE' }]" /></template>`,
|
|
94
|
+
},
|
|
95
|
+
{
|
|
96
|
+
name: 'Valid: different component with labels',
|
|
97
|
+
filename: 'test.vue',
|
|
98
|
+
code: `<template><bento-dropdown :items="[{ value: 'NL', label: 'Custom label' }]" /></template>`,
|
|
99
|
+
},
|
|
100
|
+
{
|
|
101
|
+
name: 'Valid: no items prop',
|
|
102
|
+
filename: 'test.vue',
|
|
103
|
+
code: `<template><bento-dropdown-country /></template>`,
|
|
104
|
+
},
|
|
105
|
+
{
|
|
106
|
+
name: 'Valid: variable reference',
|
|
107
|
+
filename: 'test.vue',
|
|
108
|
+
code: `<template><bento-dropdown-country :items="myItems" /></template>`,
|
|
109
|
+
},
|
|
110
|
+
{
|
|
111
|
+
name: 'Valid: spread elements only (no crash)',
|
|
112
|
+
filename: 'test.vue',
|
|
113
|
+
code: `<template><bento-dropdown-country :items="[{ ...obj, value: 'NL' }]" /></template>`,
|
|
114
|
+
},
|
|
115
|
+
{
|
|
116
|
+
name: 'Valid: computed property key',
|
|
117
|
+
filename: 'test.vue',
|
|
118
|
+
code: `<template><bento-dropdown-country :items="[{ value: 'NL', [key]: 'val' }]" /></template>`,
|
|
119
|
+
},
|
|
120
|
+
{
|
|
121
|
+
name: 'Valid: non-object elements',
|
|
122
|
+
filename: 'test.vue',
|
|
123
|
+
code: `<template><bento-dropdown-country :items="['NL', 'BE']" /></template>`,
|
|
124
|
+
},
|
|
125
|
+
],
|
|
126
|
+
invalid: [
|
|
127
|
+
{
|
|
128
|
+
name: 'Invalid: label in items only',
|
|
129
|
+
filename: 'test.vue',
|
|
130
|
+
code: `<template><bento-dropdown-country :items="[{ value: 'NL', label: 'Custom label' }]" /></template>`,
|
|
131
|
+
errors: [{ messageId: 'dropdownCountryCustomLabel' }],
|
|
132
|
+
},
|
|
133
|
+
{
|
|
134
|
+
name: 'Invalid: label in items (internal name)',
|
|
135
|
+
filename: 'test.vue',
|
|
136
|
+
code: `<template><b-dropdown-country :items="[{ value: 'NL', label: 'Custom label' }]" /></template>`,
|
|
137
|
+
errors: [{ messageId: 'dropdownCountryCustomLabel' }],
|
|
138
|
+
},
|
|
139
|
+
{
|
|
140
|
+
name: 'Invalid: string literal key',
|
|
141
|
+
filename: 'test.vue',
|
|
142
|
+
code: `<template><bento-dropdown-country :items="[{ value: 'NL', 'label': 'Custom label' }]" /></template>`,
|
|
143
|
+
errors: [{ messageId: 'dropdownCountryCustomLabel' }],
|
|
144
|
+
},
|
|
145
|
+
{
|
|
146
|
+
name: 'Invalid: spread + label',
|
|
147
|
+
filename: 'test.vue',
|
|
148
|
+
code: `<template><bento-dropdown-country :items="[{ ...obj, label: 'Custom label' }]" /></template>`,
|
|
149
|
+
errors: [{ messageId: 'dropdownCountryCustomLabel' }],
|
|
150
|
+
},
|
|
151
|
+
{
|
|
152
|
+
name: 'Invalid: variant="custom" only (no label in items)',
|
|
153
|
+
filename: 'test.vue',
|
|
154
|
+
code: `<template><bento-dropdown-country :items="[{ value: 'NL' }]" variant="custom" /></template>`,
|
|
155
|
+
errors: [{ messageId: 'dropdownCountryCustomVariant' }],
|
|
156
|
+
},
|
|
157
|
+
{
|
|
158
|
+
name: 'Invalid: label + variant="custom" (both)',
|
|
159
|
+
filename: 'test.vue',
|
|
160
|
+
code: `<template><bento-dropdown-country :items="[{ value: 'NL', label: 'Custom label' }]" variant="custom" /></template>`,
|
|
161
|
+
errors: [{ messageId: 'dropdownCountryCustomLabel' }],
|
|
162
|
+
},
|
|
163
|
+
],
|
|
164
|
+
});
|
|
165
|
+
|
|
166
|
+
/* ------------------------------------------------ */
|
|
167
|
+
/* CASE 3: SELECT_COUNTRY filter config */
|
|
168
|
+
/* ------------------------------------------------ */
|
|
169
|
+
ruleTester.run('SELECT_COUNTRY filter', rule, {
|
|
170
|
+
valid: [
|
|
171
|
+
{
|
|
172
|
+
name: 'Valid: non-custom variant',
|
|
173
|
+
filename: 'test.vue',
|
|
174
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }], variant: 'name' } }]" /></template>`,
|
|
175
|
+
},
|
|
176
|
+
{
|
|
177
|
+
name: 'Valid: SELECT type (not SELECT_COUNTRY)',
|
|
178
|
+
filename: 'test.vue',
|
|
179
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT, options: { listboxItems: [{ value: 'NL', label: 'Custom label' }] } }]" /></template>`,
|
|
180
|
+
},
|
|
181
|
+
{
|
|
182
|
+
name: 'Valid: without options',
|
|
183
|
+
filename: 'test.vue',
|
|
184
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY }]" /></template>`,
|
|
185
|
+
},
|
|
186
|
+
{
|
|
187
|
+
name: 'Valid: no label, non-custom variant',
|
|
188
|
+
filename: 'test.vue',
|
|
189
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }], variant: 'capital' } }]" /></template>`,
|
|
190
|
+
},
|
|
191
|
+
],
|
|
192
|
+
invalid: [
|
|
193
|
+
{
|
|
194
|
+
name: 'Invalid: variant="custom" only',
|
|
195
|
+
filename: 'test.vue',
|
|
196
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }], variant: 'custom' } }]" /></template>`,
|
|
197
|
+
errors: [{ messageId: 'selectCountryCustom', data: { key: 'variant' } }],
|
|
198
|
+
},
|
|
199
|
+
{
|
|
200
|
+
name: 'Invalid: label only',
|
|
201
|
+
filename: 'test.vue',
|
|
202
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL', label: 'Custom label' }] } }]" /></template>`,
|
|
203
|
+
errors: [{ messageId: 'selectCountryCustom', data: { key: 'listboxItems with label' } }],
|
|
204
|
+
},
|
|
205
|
+
{
|
|
206
|
+
name: 'Invalid: both (2 errors)',
|
|
207
|
+
filename: 'test.vue',
|
|
208
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL', label: 'Custom label' }], variant: 'custom' } }]" /></template>`,
|
|
209
|
+
errors: [
|
|
210
|
+
{ messageId: 'selectCountryCustom', data: { key: 'variant' } },
|
|
211
|
+
{ messageId: 'selectCountryCustom', data: { key: 'listboxItems with label' } },
|
|
212
|
+
],
|
|
213
|
+
},
|
|
214
|
+
{
|
|
215
|
+
name: 'Invalid: BentoCountryVariant.CUSTOM enum',
|
|
216
|
+
filename: 'test.vue',
|
|
217
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }], variant: BentoCountryVariant.CUSTOM } }]" /></template>`,
|
|
218
|
+
errors: [{ messageId: 'selectCountryCustom', data: { key: 'variant' } }],
|
|
219
|
+
},
|
|
220
|
+
{
|
|
221
|
+
name: 'Invalid: string literal type',
|
|
222
|
+
filename: 'test.vue',
|
|
223
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: 'BentoSelectCountryFilter', options: { listboxItems: [{ value: 'NL' }], variant: 'custom' } }]" /></template>`,
|
|
224
|
+
errors: [{ messageId: 'selectCountryCustom', data: { key: 'variant' } }],
|
|
225
|
+
},
|
|
226
|
+
{
|
|
227
|
+
name: 'Invalid: script-defined config',
|
|
228
|
+
filename: 'test.vue',
|
|
229
|
+
code: `
|
|
230
|
+
<script setup>
|
|
231
|
+
const config = [{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }], variant: 'custom' } }];
|
|
232
|
+
</script>
|
|
233
|
+
<template><bento-filter-bar :config="config" /></template>
|
|
234
|
+
`,
|
|
235
|
+
errors: [{ messageId: 'selectCountryCustom', data: { key: 'variant' } }],
|
|
236
|
+
},
|
|
237
|
+
],
|
|
238
|
+
});
|
|
239
|
+
|
|
240
|
+
/* ------------------------------------------------ */
|
|
241
|
+
/* AUTOFIX TESTS */
|
|
242
|
+
/* ------------------------------------------------ */
|
|
243
|
+
ruleTester.run('autofix', rule, {
|
|
244
|
+
valid: [],
|
|
245
|
+
invalid: [
|
|
246
|
+
// CASE 1: bento-country
|
|
247
|
+
{
|
|
248
|
+
name: 'Autofix: bento-country both → replace with typography',
|
|
249
|
+
filename: 'test.vue',
|
|
250
|
+
code: `<template><bento-country code="NL" variant="custom" label="Custom label" /></template>`,
|
|
251
|
+
output: `<template><bento-typography el="span">Custom label</bento-typography></template>`,
|
|
252
|
+
options: [{ autofix: true }],
|
|
253
|
+
errors: [{ messageId: 'countryCustomVariant' }],
|
|
254
|
+
},
|
|
255
|
+
{
|
|
256
|
+
name: 'Autofix: bento-country dynamic label both → replace with typography',
|
|
257
|
+
filename: 'test.vue',
|
|
258
|
+
code: `<template><bento-country code="NL" :variant="'custom'" :label="customLabel" /></template>`,
|
|
259
|
+
output: `<template><bento-typography el="span">{{ customLabel }}</bento-typography></template>`,
|
|
260
|
+
options: [{ autofix: true }],
|
|
261
|
+
errors: [{ messageId: 'countryCustomVariant' }],
|
|
262
|
+
},
|
|
263
|
+
{
|
|
264
|
+
name: 'Autofix: bento-country variant only → remove variant',
|
|
265
|
+
filename: 'test.vue',
|
|
266
|
+
code: `<template><bento-country code="NL" variant="custom" /></template>`,
|
|
267
|
+
output: `<template><bento-country code="NL" /></template>`,
|
|
268
|
+
options: [{ autofix: true }],
|
|
269
|
+
errors: [{ messageId: 'countryCustomVariant' }],
|
|
270
|
+
},
|
|
271
|
+
{
|
|
272
|
+
name: 'Autofix: bento-country dynamic variant only → remove variant',
|
|
273
|
+
filename: 'test.vue',
|
|
274
|
+
code: `<template><bento-country code="NL" :variant="BentoCountryVariant.CUSTOM" /></template>`,
|
|
275
|
+
output: `<template><bento-country code="NL" /></template>`,
|
|
276
|
+
options: [{ autofix: true }],
|
|
277
|
+
errors: [{ messageId: 'countryCustomVariant' }],
|
|
278
|
+
},
|
|
279
|
+
{
|
|
280
|
+
name: 'Autofix: bento-country label only → remove label',
|
|
281
|
+
filename: 'test.vue',
|
|
282
|
+
code: `<template><bento-country code="NL" label="Custom label" /></template>`,
|
|
283
|
+
output: `<template><bento-country code="NL" /></template>`,
|
|
284
|
+
options: [{ autofix: true }],
|
|
285
|
+
errors: [{ messageId: 'countryUnusedLabel' }],
|
|
286
|
+
},
|
|
287
|
+
{
|
|
288
|
+
name: 'Autofix: bento-country dynamic label only → remove label',
|
|
289
|
+
filename: 'test.vue',
|
|
290
|
+
code: `<template><bento-country code="NL" :label="customLabel" /></template>`,
|
|
291
|
+
output: `<template><bento-country code="NL" /></template>`,
|
|
292
|
+
options: [{ autofix: true }],
|
|
293
|
+
errors: [{ messageId: 'countryUnusedLabel' }],
|
|
294
|
+
},
|
|
295
|
+
|
|
296
|
+
// CASE 2: bento-dropdown-country
|
|
297
|
+
{
|
|
298
|
+
name: 'Autofix: dropdown-country both → replace tag + remove variant',
|
|
299
|
+
filename: 'test.vue',
|
|
300
|
+
code: `<template><bento-dropdown-country :items="[{ value: 'NL', label: 'Custom label' }]" variant="custom" /></template>`,
|
|
301
|
+
output: `<template><bento-dropdown :items="[{ value: 'NL', label: 'Custom label' }]" /></template>`,
|
|
302
|
+
options: [{ autofix: true }],
|
|
303
|
+
errors: [{ messageId: 'dropdownCountryCustomLabel' }],
|
|
304
|
+
},
|
|
305
|
+
{
|
|
306
|
+
name: 'Autofix: dropdown-country both with closing tag → replace tag + remove variant',
|
|
307
|
+
filename: 'test.vue',
|
|
308
|
+
code: `<template><bento-dropdown-country :items="[{ value: 'NL', label: 'Custom label' }]" variant="custom"></bento-dropdown-country></template>`,
|
|
309
|
+
output: `<template><bento-dropdown :items="[{ value: 'NL', label: 'Custom label' }]"></bento-dropdown></template>`,
|
|
310
|
+
options: [{ autofix: true }],
|
|
311
|
+
errors: [{ messageId: 'dropdownCountryCustomLabel' }],
|
|
312
|
+
},
|
|
313
|
+
{
|
|
314
|
+
name: 'Autofix: dropdown-country label only → remove labels from items',
|
|
315
|
+
filename: 'test.vue',
|
|
316
|
+
code: `<template><bento-dropdown-country :items="[{ value: 'NL', label: 'Custom label' }]" /></template>`,
|
|
317
|
+
output: `<template><bento-dropdown-country :items="[{ value: 'NL' }]" /></template>`,
|
|
318
|
+
options: [{ autofix: true }],
|
|
319
|
+
errors: [{ messageId: 'dropdownCountryCustomLabel' }],
|
|
320
|
+
},
|
|
321
|
+
{
|
|
322
|
+
name: 'Autofix: dropdown-country variant only → remove variant',
|
|
323
|
+
filename: 'test.vue',
|
|
324
|
+
code: `<template><bento-dropdown-country :items="[{ value: 'NL' }]" variant="custom" /></template>`,
|
|
325
|
+
output: `<template><bento-dropdown-country :items="[{ value: 'NL' }]" /></template>`,
|
|
326
|
+
options: [{ autofix: true }],
|
|
327
|
+
errors: [{ messageId: 'dropdownCountryCustomVariant' }],
|
|
328
|
+
},
|
|
329
|
+
|
|
330
|
+
// CASE 3: SELECT_COUNTRY
|
|
331
|
+
{
|
|
332
|
+
name: 'Autofix: SELECT_COUNTRY both → change type + remove variant',
|
|
333
|
+
filename: 'test.vue',
|
|
334
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL', label: 'Custom label' }], variant: 'custom' } }]" /></template>`,
|
|
335
|
+
output: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT, options: { listboxItems: [{ value: 'NL', label: 'Custom label' }] } }]" /></template>`,
|
|
336
|
+
options: [{ autofix: true }],
|
|
337
|
+
errors: [
|
|
338
|
+
{ messageId: 'selectCountryCustom', data: { key: 'variant' } },
|
|
339
|
+
{ messageId: 'selectCountryCustom', data: { key: 'listboxItems with label' } },
|
|
340
|
+
],
|
|
341
|
+
},
|
|
342
|
+
{
|
|
343
|
+
name: 'Autofix: SELECT_COUNTRY string literal both → change type + remove variant',
|
|
344
|
+
filename: 'test.vue',
|
|
345
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: 'BentoSelectCountryFilter', options: { listboxItems: [{ value: 'NL', label: 'Custom label' }], variant: 'custom' } }]" /></template>`,
|
|
346
|
+
output: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: 'BentoSelectFilter', options: { listboxItems: [{ value: 'NL', label: 'Custom label' }] } }]" /></template>`,
|
|
347
|
+
options: [{ autofix: true }],
|
|
348
|
+
errors: [
|
|
349
|
+
{ messageId: 'selectCountryCustom', data: { key: 'variant' } },
|
|
350
|
+
{ messageId: 'selectCountryCustom', data: { key: 'listboxItems with label' } },
|
|
351
|
+
],
|
|
352
|
+
},
|
|
353
|
+
{
|
|
354
|
+
name: 'Autofix: SELECT_COUNTRY variant only → remove variant property',
|
|
355
|
+
filename: 'test.vue',
|
|
356
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }], variant: 'custom' } }]" /></template>`,
|
|
357
|
+
output: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }] } }]" /></template>`,
|
|
358
|
+
options: [{ autofix: true }],
|
|
359
|
+
errors: [{ messageId: 'selectCountryCustom', data: { key: 'variant' } }],
|
|
360
|
+
},
|
|
361
|
+
{
|
|
362
|
+
name: 'Autofix: SELECT_COUNTRY label only → remove labels from listboxItems',
|
|
363
|
+
filename: 'test.vue',
|
|
364
|
+
code: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL', label: 'Custom label' }] } }]" /></template>`,
|
|
365
|
+
output: `<template><bento-filter-bar :config="[{ field: 'c', label: 'C', type: BentoFilterItemType.SELECT_COUNTRY, options: { listboxItems: [{ value: 'NL' }] } }]" /></template>`,
|
|
366
|
+
options: [{ autofix: true }],
|
|
367
|
+
errors: [{ messageId: 'selectCountryCustom', data: { key: 'listboxItems with label' } }],
|
|
368
|
+
},
|
|
369
|
+
|
|
370
|
+
// No autofix when disabled
|
|
371
|
+
{
|
|
372
|
+
name: 'No autofix when autofix is false',
|
|
373
|
+
filename: 'test.vue',
|
|
374
|
+
code: `<template><bento-country code="NL" variant="custom" label="Custom label" /></template>`,
|
|
375
|
+
options: [{ autofix: false }],
|
|
376
|
+
errors: [{ messageId: 'countryCustomVariant' }],
|
|
377
|
+
},
|
|
378
|
+
],
|
|
379
|
+
});
|
|
380
|
+
});
|