@adyen/eslint-plugin-bento 2.23.0 → 2.24.0

package/rules/deprecation-components-aria-label-prop/deprecation-components-aria-label-prop.test.ts

@@ -1,194 +0,0 @@
-import { RuleTester } from 'eslint';
-import vueParser from 'vue-eslint-parser';
-import tsParser from '@typescript-eslint/parser';
-import deprecationComponentsAriaLabelProp from './deprecation-components-aria-label-prop';
-
-const ruleTester = new RuleTester({
-    languageOptions: {
-        ecmaVersion: 'latest',
-        sourceType: 'module',
-        parser: vueParser,
-        parserOptions: {
-            parser: tsParser,
-        },
-    },
-});
-
-describe('@adyen/bento/deprecation-components-aria-label-prop', () => {
-    ruleTester.run('deprecation-components-aria-label-prop', deprecationComponentsAriaLabelProp, {
-        valid: [
-            {
-                name: 'Valid usage for bento-dropdown',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-dropdown aria-label="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-input-field',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-input-field aria-label="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-pagination',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-pagination aria-label="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-popover',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-popover aria-label="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-segmented-control',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-segmented-control aria-label="val" />
-                </template>
-                `,
-            },
-        ],
-        invalid: [
-            // bento-dropdown: Static
-            {
-                name: 'Invalid: Static prop on bento-dropdown',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown ariaLabel="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-dropdown: Shorthand
-            {
-                name: 'Invalid: Dynamic prop on bento-dropdown',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown :ariaLabel="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-input-field: Static
-            {
-                name: 'Invalid: Static prop on bento-input-field',
-                filename: 'test.vue',
-                code: `<template><bento-input-field ariaLabel="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-input-field: Shorthand
-            {
-                name: 'Invalid: Dynamic prop on bento-input-field',
-                filename: 'test.vue',
-                code: `<template><bento-input-field :ariaLabel="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-pagination: Static
-            {
-                name: 'Invalid: Static prop on bento-pagination',
-                filename: 'test.vue',
-                code: `<template><bento-pagination ariaLabel="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-pagination: Shorthand
-            {
-                name: 'Invalid: Dynamic prop on bento-pagination',
-                filename: 'test.vue',
-                code: `<template><bento-pagination :ariaLabel="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-popover: Static
-            {
-                name: 'Invalid: Static prop on bento-popover',
-                filename: 'test.vue',
-                code: `<template><bento-popover ariaLabel="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-popover: Shorthand
-            {
-                name: 'Invalid: Dynamic prop on bento-popover',
-                filename: 'test.vue',
-                code: `<template><bento-popover :ariaLabel="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-segmented-control: Static
-            {
-                name: 'Invalid: Static prop on bento-segmented-control',
-                filename: 'test.vue',
-                code: `<template><bento-segmented-control ariaLabel="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-segmented-control: Shorthand
-            {
-                name: 'Invalid: Dynamic prop on bento-segmented-control',
-                filename: 'test.vue',
-                code: `<template><bento-segmented-control :ariaLabel="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-        ],
-    });
-
-    /* ------------------------------------------------ */
-    /* AUTOFIX TESTS                                    */
-    /* ------------------------------------------------ */
-    ruleTester.run('deprecation-components-aria-label-prop (autofix enabled)', deprecationComponentsAriaLabelProp, {
-        valid: [
-            {
-                name: 'Valid: aria-label (kebab-case) on bento-dropdown (autofix enabled)',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-dropdown aria-label="val" /></template>`,
-            },
-        ],
-        invalid: [
-            {
-                name: 'Autofix: static prop on bento-dropdown',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-dropdown ariaLabel="val" /></template>`,
-                output: `<template><bento-dropdown aria-label="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Autofix: dynamic prop on bento-dropdown',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-dropdown :ariaLabel="val" /></template>`,
-                output: `<template><bento-dropdown :aria-label="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Autofix: static prop on bento-segmented-control',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-segmented-control ariaLabel="val" /></template>`,
-                output: `<template><bento-segmented-control aria-label="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Autofix: v-bind longhand on bento-popover',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-popover v-bind:ariaLabel="val" /></template>`,
-                output: `<template><bento-popover v-bind:aria-label="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Autofix: does not fix when autofix is false',
-                filename: 'test.vue',
-                options: [{ autofix: false }],
-                code: `<template><bento-dropdown ariaLabel="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-        ],
-    });
-});

package/rules/deprecation-components-error-prop/__tests__/deprecation-components-error-prop.vue

@@ -1,17 +0,0 @@
-<template>
-    <div>
-        <bento-dropdown error="value" />
-        <bento-dropdown :error="value" />
-        <bento-dropdown :error="value" />
-
-        <bento-input-field error="value" />
-        <bento-input-field :error="value" />
-        <bento-input-field :error="value" />
-
-        <bento-input-field-phone-number error="value" />
-        <bento-input-field-phone-number :error="value" />
-        <bento-input-field-phone-number :error="value" />
-    </div>
-</template>
-
-<script setup></script>

package/rules/deprecation-components-error-prop/__tests__/eslint.config.js

@@ -1,26 +0,0 @@
-// eslint.config.js
-const { defineConfig } = require('eslint/config');
-const vueParser = require('vue-eslint-parser');
-const tsParser = require('@typescript-eslint/parser');
-const adyenBento = require('@adyen/eslint-plugin-bento');
-
-module.exports = defineConfig([
-    {
-        languageOptions: {
-            ecmaVersion: 'latest',
-            sourceType: 'module',
-            parser: vueParser,
-            parserOptions: {
-                parser: tsParser,
-            },
-        },
-        plugins: {
-            '@adyen/bento': adyenBento,
-        },
-        rules: {
-            // Register the specific rule we are testing
-            '@adyen/bento/deprecation-components-error-prop': 'warn',
-        },
-        files: ['**/*.vue'],
-    },
-]);

package/rules/deprecation-components-error-prop/deprecation-components-error-prop.integration.test.ts

@@ -1,41 +0,0 @@
-import path from 'node:path';
-import { execFileSyncEslintVueFiles } from '../../utils/exec-file-sync-eslint-vue-files';
-
-describe('@adyen/bento/deprecation-components-error-prop', () => {
-    it('should lint with warning', () => {
-        // Load .eslintrc
-        const eslintrc = path.resolve(__dirname, '__tests__', 'eslint.config.js');
-        // Load the test file generated alongside this one
-        const vueFile = path.resolve(__dirname, '__tests__', 'deprecation-components-error-prop.vue');
-
-        // Execute the linter — strip any non-JSON preamble (e.g. pnpm warnings)
-        const rawOutput = execFileSyncEslintVueFiles(eslintrc, vueFile);
-        const jsonStart = rawOutput.indexOf('[{"');
-        const result = JSON.parse(jsonStart >= 0 ? rawOutput.slice(jsonStart) : rawOutput);
-
-        /* ------------------------------------------------ */
-        /* CASE 2: SINGLE REPLACEMENT                       */
-        /* ------------------------------------------------ */
-
-        // For props, we generate 3 examples (static, shorthand, longhand) FOR EACH component.
-        // Total = (Number of Components) * 3
-        const numberOfComponents = 3;
-        expect(result[0].warningCount).toBe(numberOfComponents * 3);
-
-        // Verify the message structure on the first warning found.
-        expect(result[0].messages[0]).toMatchObject({
-            ruleId: '@adyen/bento/deprecation-components-error-prop',
-            severity: 1,
-            messageId: 'deprecation',
-            message: `The "error" prop is deprecated. Use "error-message" instead. Note that "error" accepted a boolean, but "error-message" expects a string, so update the value to an error message.`,
-            suggestions: expect.arrayContaining([
-                expect.objectContaining({
-                    messageId: 'suggestReplace',
-                    fix: expect.objectContaining({
-                        text: expect.stringContaining('error-message'),
-                    }),
-                }),
-            ]),
-        });
-    });
-});

package/rules/deprecation-components-error-prop/deprecation-components-error-prop.test.ts

@@ -1,153 +0,0 @@
-import { RuleTester } from 'eslint';
-import vueParser from 'vue-eslint-parser';
-import tsParser from '@typescript-eslint/parser';
-import deprecationComponentsErrorProp from './deprecation-components-error-prop';
-
-const ruleTester = new RuleTester({
-    languageOptions: {
-        ecmaVersion: 'latest',
-        sourceType: 'module',
-        parser: vueParser,
-        parserOptions: {
-            parser: tsParser,
-        },
-    },
-});
-
-describe('@adyen/bento/deprecation-components-error-prop', () => {
-    ruleTester.run('deprecation-components-error-prop', deprecationComponentsErrorProp, {
-        valid: [
-            {
-                name: 'Valid usage for bento-dropdown',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-dropdown error-message="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-input-field',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-input-field error-message="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-input-field-phone-number',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-input-field-phone-number error-message="val" />
-                </template>
-                `,
-            },
-        ],
-        invalid: [
-            // bento-dropdown: Static
-            {
-                name: 'Invalid: Static prop on bento-dropdown',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown error="val" /></template>`,
-                errors: [
-                    {
-                        messageId: 'deprecation',
-                        suggestions: [
-                            {
-                                messageId: 'suggestReplace',
-                                output: `<template><bento-dropdown error-message="val" /></template>`,
-                            },
-                        ],
-                    },
-                ],
-            },
-            // bento-dropdown: Dynamic
-            {
-                name: 'Invalid: Dynamic prop on bento-dropdown',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown :error="val" /></template>`,
-                errors: [
-                    {
-                        messageId: 'deprecation',
-                        suggestions: [
-                            {
-                                messageId: 'suggestReplace',
-                                output: `<template><bento-dropdown :error-message="val" /></template>`,
-                            },
-                        ],
-                    },
-                ],
-            },
-            // bento-input-field: Static
-            {
-                name: 'Invalid: Static prop on bento-input-field',
-                filename: 'test.vue',
-                code: `<template><bento-input-field error="val" /></template>`,
-                errors: [
-                    {
-                        messageId: 'deprecation',
-                        suggestions: [
-                            {
-                                messageId: 'suggestReplace',
-                                output: `<template><bento-input-field error-message="val" /></template>`,
-                            },
-                        ],
-                    },
-                ],
-            },
-            // bento-input-field: Dynamic
-            {
-                name: 'Invalid: Dynamic prop on bento-input-field',
-                filename: 'test.vue',
-                code: `<template><bento-input-field :error="val" /></template>`,
-                errors: [
-                    {
-                        messageId: 'deprecation',
-                        suggestions: [
-                            {
-                                messageId: 'suggestReplace',
-                                output: `<template><bento-input-field :error-message="val" /></template>`,
-                            },
-                        ],
-                    },
-                ],
-            },
-            // bento-input-field-phone-number: Static
-            {
-                name: 'Invalid: Static prop on bento-input-field-phone-number',
-                filename: 'test.vue',
-                code: `<template><bento-input-field-phone-number error="val" /></template>`,
-                errors: [
-                    {
-                        messageId: 'deprecation',
-                        suggestions: [
-                            {
-                                messageId: 'suggestReplace',
-                                output: `<template><bento-input-field-phone-number error-message="val" /></template>`,
-                            },
-                        ],
-                    },
-                ],
-            },
-            // bento-input-field-phone-number: Dynamic
-            {
-                name: 'Invalid: Dynamic prop on bento-input-field-phone-number',
-                filename: 'test.vue',
-                code: `<template><bento-input-field-phone-number :error="val" /></template>`,
-                errors: [
-                    {
-                        messageId: 'deprecation',
-                        suggestions: [
-                            {
-                                messageId: 'suggestReplace',
-                                output: `<template><bento-input-field-phone-number :error-message="val" /></template>`,
-                            },
-                        ],
-                    },
-                ],
-            },
-        ],
-    });
-});

package/rules/deprecation-components-has-error-prop/__tests__/deprecation-components-has-error-prop.vue

@@ -1,13 +0,0 @@
-<template>
-    <div>
-        <bento-checkbox-group has-error="value" />
-        <bento-checkbox-group :has-error="value" />
-        <bento-checkbox-group :has-error="value" />
-
-        <bento-radio-group has-error="value" />
-        <bento-radio-group :has-error="value" />
-        <bento-radio-group :has-error="value" />
-    </div>
-</template>
-
-<script setup></script>

package/rules/deprecation-components-has-error-prop/__tests__/eslint.config.js

@@ -1,26 +0,0 @@
-// eslint.config.js
-const { defineConfig } = require('eslint/config');
-const vueParser = require('vue-eslint-parser');
-const tsParser = require('@typescript-eslint/parser');
-const adyenBento = require('@adyen/eslint-plugin-bento');
-
-module.exports = defineConfig([
-    {
-        languageOptions: {
-            ecmaVersion: 'latest',
-            sourceType: 'module',
-            parser: vueParser,
-            parserOptions: {
-                parser: tsParser,
-            },
-        },
-        plugins: {
-            '@adyen/bento': adyenBento,
-        },
-        rules: {
-            // Register the specific rule we are testing
-            '@adyen/bento/deprecation-components-has-error-prop': 'warn',
-        },
-        files: ['**/*.vue'],
-    },
-]);

package/rules/deprecation-components-has-error-prop/deprecation-components-has-error-prop.integration.test.ts

@@ -1,37 +0,0 @@
-import path from 'node:path';
-import { execFileSyncEslintVueFiles } from '../../utils/exec-file-sync-eslint-vue-files';
-
-describe('@adyen/bento/deprecation-components-has-error-prop', () => {
-    it('should lint with warning', () => {
-        // Load .eslintrc
-        const eslintrc = path.resolve(__dirname, '__tests__', 'eslint.config.js');
-        // Load the test file generated alongside this one
-        const vueFile = path.resolve(__dirname, '__tests__', 'deprecation-components-has-error-prop.vue');
-
-        // Execute the linter
-        const result = JSON.parse(execFileSyncEslintVueFiles(eslintrc, vueFile));
-
-        // 3 examples (static, shorthand, longhand) FOR EACH component.
-        // Total = 2 components * 3 = 6
-        expect(result[0].warningCount).toBe(6);
-
-        expect(result[0].messages[0]).toMatchObject({
-            ruleId: '@adyen/bento/deprecation-components-has-error-prop',
-            severity: 1,
-
-            messageId: 'deprecation',
-            message: `The "has-error" prop is deprecated. Use "error-message" instead. Note that "has-error" accepted a boolean, but "error-message" expects a string, so update the value to an error message.`,
-            suggestions: expect.arrayContaining([
-                expect.objectContaining({
-                    messageId: 'suggestReplace',
-                    fix: expect.objectContaining({
-                        text: expect.stringContaining('error-message'),
-                    }),
-                }),
-            ]),
-        });
-
-        // The rule should provide a suggestion, not an autofix, because the replacement changes the expected value type.
-        expect(result[0].messages[0].fix).toBeUndefined();
-    });
-});

package/rules/deprecation-components-has-error-prop/deprecation-components-has-error-prop.test.ts

@@ -1,122 +0,0 @@
-import { RuleTester } from 'eslint';
-import vueParser from 'vue-eslint-parser';
-import tsParser from '@typescript-eslint/parser';
-import deprecationComponentsHasErrorProp from './deprecation-components-has-error-prop';
-
-const ruleTester = new RuleTester({
-    languageOptions: {
-        ecmaVersion: 'latest',
-        sourceType: 'module',
-        parser: vueParser,
-        parserOptions: {
-            parser: tsParser,
-        },
-    },
-});
-
-describe('@adyen/bento/deprecation-components-has-error-prop', () => {
-    ruleTester.run('deprecation-components-has-error-prop', deprecationComponentsHasErrorProp, {
-        valid: [
-            {
-                name: 'Valid usage for bento-checkbox-group',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-checkbox-group errorMessage="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-radio-group',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-radio-group errorMessage="val" />
-                </template>
-                `,
-            },
-        ],
-        invalid: [
-            {
-                name: 'Invalid: Static prop on bento-checkbox-group',
-                filename: 'test.vue',
-                code: `<template><bento-checkbox-group has-error="val" /></template>`,
-                errors: [
-                    {
-                        messageId: 'deprecation',
-                        suggestions: [
-                            {
-                                messageId: 'suggestReplace',
-                                output: `<template><bento-checkbox-group error-message="val" /></template>`,
-                            },
-                        ],
-                    },
-                ],
-            },
-            {
-                name: 'Invalid: Dynamic shorthand prop on bento-checkbox-group',
-                filename: 'test.vue',
-                code: `<template><bento-checkbox-group :has-error="val" /></template>`,
-                errors: [
-                    {
-                        messageId: 'deprecation',
-                        suggestions: [
-                            {
-                                messageId: 'suggestReplace',
-                                output: `<template><bento-checkbox-group :error-message="val" /></template>`,
-                            },
-                        ],
-                    },
-                ],
-            },
-            {
-                name: 'Invalid: Static prop on bento-radio-group',
-                filename: 'test.vue',
-                code: `<template><bento-radio-group has-error="val" /></template>`,
-                errors: [
-                    {
-                        messageId: 'deprecation',
-                        suggestions: [
-                            {
-                                messageId: 'suggestReplace',
-                                output: `<template><bento-radio-group error-message="val" /></template>`,
-                            },
-                        ],
-                    },
-                ],
-            },
-            {
-                name: 'Invalid: Dynamic shorthand prop on bento-radio-group',
-                filename: 'test.vue',
-                code: `<template><bento-radio-group :has-error="val" /></template>`,
-                errors: [
-                    {
-                        messageId: 'deprecation',
-                        suggestions: [
-                            {
-                                messageId: 'suggestReplace',
-                                output: `<template><bento-radio-group :error-message="val" /></template>`,
-                            },
-                        ],
-                    },
-                ],
-            },
-            {
-                name: 'Invalid: Dynamic longhand prop on bento-radio-group',
-                filename: 'test.vue',
-                code: `<template><bento-radio-group v-bind:has-error="val" /></template>`,
-                errors: [
-                    {
-                        messageId: 'deprecation',
-                        suggestions: [
-                            {
-                                messageId: 'suggestReplace',
-                                output: `<template><bento-radio-group v-bind:error-message="val" /></template>`,
-                            },
-                        ],
-                    },
-                ],
-            },
-        ],
-    });
-});

package/rules/deprecation-components-input-emit/__tests__/deprecation-components-input-emit.vue

@@ -1,22 +0,0 @@
-<template>
-    <div>
-        <bento-date-picker @input="handler" />
-        <bento-date-range-picker @input="handler" />
-        <bento-dropdown @input="handler" />
-        <bento-dropdown-avatar @input="handler" />
-        <bento-dropdown-country @input="handler" />
-        <bento-dropdown-currency @input="handler" />
-        <bento-dropdown-payment-method @input="handler" />
-        <bento-dropdown-tag @input="handler" />
-        <bento-file-uploader @input="handler" />
-        <bento-input-field @input="handler" />
-        <bento-input-field-password @input="handler" />
-        <bento-input-field-phone-number @input="handler" />
-        <bento-checkbox-group @input="handler" />
-        <bento-radio-group @input="handler" />
-        <bento-selection-card-group @input="handler" />
-        <bento-textarea @input="handler" />
-    </div>
-</template>
-
-<script setup></script>