@adyen/eslint-plugin-bento 2.22.0 → 2.24.0

package/rules/deprecation-bento-date-range-picker-has-actions-prop/deprecation-bento-date-range-picker-has-actions-prop.test.ts

@@ -1,176 +0,0 @@
-import { RuleTester } from 'eslint';
-import vueParser from 'vue-eslint-parser';
-import tsParser from '@typescript-eslint/parser';
-import deprecationBentoDateRangePickerHasActionsProp from './deprecation-bento-date-range-picker-has-actions-prop';
-
-const ruleTester = new RuleTester({
-    languageOptions: {
-        ecmaVersion: 'latest',
-        sourceType: 'module',
-        parser: vueParser,
-        parserOptions: {
-            parser: tsParser,
-        },
-    },
-});
-
-describe('@adyen/bento/deprecation-bento-date-range-picker-has-actions-prop', () => {
-    describe('action: add (default)', () => {
-        ruleTester.run(
-            'deprecation-bento-date-range-picker-has-actions-prop (add)',
-            deprecationBentoDateRangePickerHasActionsProp,
-            {
-                valid: [
-                    {
-                        name: 'Valid: component already has has-actions (static boolean)',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker has-actions /></template>`,
-                    },
-                    {
-                        name: 'Valid: component already has has-actions (dynamic)',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker :has-actions="true" /></template>`,
-                    },
-                    {
-                        name: 'Valid: unrelated component without has-actions',
-                        filename: 'test.vue',
-                        code: `<template><bento-button label="click" /></template>`,
-                    },
-                ],
-                invalid: [
-                    {
-                        name: 'Invalid: missing has-actions (no autofix)',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker label="Pick" /></template>`,
-                        output: null,
-                        errors: [{ messageId: 'missingProp' }],
-                    },
-                    {
-                        name: 'Invalid: missing has-actions (autofix adds prop)',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker label="Pick" /></template>`,
-                        output: `<template><bento-date-range-picker has-actions label="Pick" /></template>`,
-                        options: [{ action: 'add', autofix: true }],
-                        errors: [{ messageId: 'missingProp' }],
-                    },
-                    {
-                        name: 'Invalid: missing has-actions on self-closing tag without attrs (autofix)',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker /></template>`,
-                        output: `<template><bento-date-range-picker has-actions /></template>`,
-                        options: [{ autofix: true }],
-                        errors: [{ messageId: 'missingProp' }],
-                    },
-                    {
-                        name: 'Invalid: missing has-actions on self-closing tag without space before /> (autofix)',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker/></template>`,
-                        output: `<template><bento-date-range-picker has-actions /></template>`,
-                        options: [{ autofix: true }],
-                        errors: [{ messageId: 'missingProp' }],
-                    },
-                    {
-                        name: 'Invalid: has-actions="false" (static string false, no autofix)',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker has-actions="false" /></template>`,
-                        output: null,
-                        errors: [{ messageId: 'missingProp' }],
-                    },
-                    {
-                        name: 'Invalid: has-actions="false" (static string false, autofix replaces)',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker has-actions="false" label="Pick" /></template>`,
-                        output: `<template><bento-date-range-picker has-actions label="Pick" /></template>`,
-                        options: [{ autofix: true }],
-                        errors: [{ messageId: 'missingProp' }],
-                    },
-                    {
-                        name: 'Invalid: :has-actions="false" (dynamic false, autofix replaces)',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker :has-actions="false" label="Pick" /></template>`,
-                        output: `<template><bento-date-range-picker has-actions label="Pick" /></template>`,
-                        options: [{ autofix: true }],
-                        errors: [{ messageId: 'missingProp' }],
-                    },
-                    {
-                        name: 'Invalid: multi-line component missing has-actions (autofix preserves indentation)',
-                        filename: 'test.vue',
-                        code: `<template>
-                            <bento-date-range-picker
-                                label="Pick"
-                            />
-                            </template>`,
-                        output: `<template>
-                            <bento-date-range-picker
-                                has-actions
-                                label="Pick"
-                            />
-                            </template>`,
-                        options: [{ autofix: true }],
-                        errors: [{ messageId: 'missingProp' }],
-                    },
-                ],
-            }
-        );
-    });
-
-    describe('action: remove', () => {
-        ruleTester.run(
-            'deprecation-bento-date-range-picker-has-actions-prop (remove)',
-            deprecationBentoDateRangePickerHasActionsProp,
-            {
-                valid: [
-                    {
-                        name: 'Valid: component without has-actions',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker label="Pick" /></template>`,
-                        options: [{ action: 'remove' }],
-                    },
-                ],
-                invalid: [
-                    {
-                        name: 'Invalid: has-actions present (static boolean, no autofix)',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker has-actions /></template>`,
-                        output: null,
-                        options: [{ action: 'remove' }],
-                        errors: [{ messageId: 'removeProp' }],
-                    },
-                    {
-                        name: 'Invalid: has-actions present (static boolean, autofix removes)',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker has-actions label="Pick" /></template>`,
-                        output: `<template><bento-date-range-picker  label="Pick" /></template>`,
-                        options: [{ action: 'remove', autofix: true }],
-                        errors: [{ messageId: 'removeProp' }],
-                    },
-                    {
-                        name: 'Invalid: has-actions present (dynamic, autofix removes)',
-                        filename: 'test.vue',
-                        code: `<template><bento-date-range-picker :has-actions="true" /></template>`,
-                        output: `<template><bento-date-range-picker  /></template>`,
-                        options: [{ action: 'remove', autofix: true }],
-                        errors: [{ messageId: 'removeProp' }],
-                    },
-                    {
-                        name: 'Invalid: multi-line has-actions on its own line (autofix removes entire line)',
-                        filename: 'test.vue',
-                        code: `<template>
-                            <bento-date-range-picker
-                                has-actions
-                                label="Pick"
-                            />
-                            </template>`,
-                        output: `<template>
-                            <bento-date-range-picker
-                                label="Pick"
-                            />
-                            </template>`,
-                        options: [{ action: 'remove', autofix: true }],
-                        errors: [{ messageId: 'removeProp' }],
-                    },
-                ],
-            }
-        );
-    });
-});

package/rules/deprecation-bento-dropdown-size-prop/__tests__/deprecation-bento-dropdown-size-prop.vue

@@ -1,9 +0,0 @@
-<template>
-    <div>
-        <bento-dropdown size="value" />
-        <bento-dropdown :size="value" />
-        <bento-dropdown :size="value" />
-    </div>
-</template>
-
-<script setup></script>

package/rules/deprecation-bento-dropdown-size-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-bento-dropdown-size-prop': ['warn', { autofix: true }],
-        },
-        files: ['**/*.vue'],
-    },
-]);

package/rules/deprecation-bento-dropdown-size-prop/deprecation-bento-dropdown-size-prop.integration.test.ts

@@ -1,33 +0,0 @@
-import path from 'node:path';
-import { execFileSyncEslintVueFiles } from '../../utils/exec-file-sync-eslint-vue-files';
-
-describe('@adyen/bento/deprecation-bento-dropdown-size-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-bento-dropdown-size-prop.vue');
-
-        // Execute the linter
-        const result = JSON.parse(execFileSyncEslintVueFiles(eslintrc, vueFile));
-
-        /* ------------------------------------------------ */
-        /* CASE 2: SINGLE REPLACEMENT                       */
-        /* ------------------------------------------------ */
-
-        // For props, we generate 3 examples (static, shorthand, longhand) FOR EACH component.
-        // Total = (Number of Components) * 3
-        const numberOfComponents = 1;
-        expect(result[0].warningCount).toBe(numberOfComponents * 3);
-
-        // Verify the message structure on the first error found.
-        // Since the rule is the same for all components, checking the first one confirms the message is correct.
-        expect(result[0].messages[0]).toMatchObject({
-            ruleId: '@adyen/bento/deprecation-bento-dropdown-size-prop',
-            severity: 1,
-
-            messageId: 'deprecation',
-            message: `The "size" prop is deprecated.`,
-        });
-    });
-});

package/rules/deprecation-bento-dropdown-size-prop/deprecation-bento-dropdown-size-prop.test.ts

@@ -1,101 +0,0 @@
-import { RuleTester } from 'eslint';
-import vueParser from 'vue-eslint-parser';
-import tsParser from '@typescript-eslint/parser';
-import deprecationBentoDropdownSizeProp from './deprecation-bento-dropdown-size-prop';
-
-const ruleTester = new RuleTester({
-    languageOptions: {
-        ecmaVersion: 'latest',
-        sourceType: 'module',
-        parser: vueParser,
-        parserOptions: {
-            parser: tsParser,
-        },
-    },
-});
-
-describe('@adyen/bento/deprecation-bento-dropdown-size-prop', () => {
-    ruleTester.run('deprecation-bento-dropdown-size-prop', deprecationBentoDropdownSizeProp, {
-        valid: [
-            {
-                name: 'Valid usage for bento-dropdown',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-dropdown other-prop="val" />
-                </template>
-                `,
-            },
-        ],
-        invalid: [
-            // bento-dropdown: Static
-            {
-                name: 'Invalid: Static prop on bento-dropdown',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown size="small" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-dropdown: Shorthand
-            {
-                name: 'Invalid: Dynamic prop on bento-dropdown',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown :size="dropdownSize" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-dropdown: v-bind longhand
-            {
-                name: 'Invalid: v-bind longhand prop on bento-dropdown',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown v-bind:size="dropdownSize" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-        ],
-    });
-
-    /* ------------------------------------------------ */
-    /* AUTOFIX TESTS                                    */
-    /* ------------------------------------------------ */
-    ruleTester.run('deprecation-bento-dropdown-size-prop (autofix enabled)', deprecationBentoDropdownSizeProp, {
-        valid: [
-            {
-                name: 'Valid: no size prop (autofix enabled)',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-dropdown :items="items" /></template>`,
-            },
-        ],
-        invalid: [
-            {
-                name: 'Autofix: removes static size prop',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-dropdown size="small" /></template>`,
-                output: `<template><bento-dropdown  /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Autofix: removes dynamic size prop',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-dropdown :size="dropdownSize" /></template>`,
-                output: `<template><bento-dropdown  /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Autofix: removes v-bind longhand size prop',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-dropdown v-bind:size="dropdownSize" /></template>`,
-                output: `<template><bento-dropdown  /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Autofix: does not fix when autofix is false',
-                filename: 'test.vue',
-                options: [{ autofix: false }],
-                code: `<template><bento-dropdown size="small" other="x" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-        ],
-    });
-});

package/rules/deprecation-bento-popover-modifiers-prop/__tests__/deprecation-bento-popover-modifiers-prop.vue

@@ -1,9 +0,0 @@
-<template>
-    <div>
-        <bento-popover modifiers="value" />
-        <bento-popover :modifiers="value" />
-        <bento-popover :modifiers="value" />
-    </div>
-</template>
-
-<script setup></script>

package/rules/deprecation-bento-popover-modifiers-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-bento-popover-modifiers-prop': ['warn', { autofix: true }],
-        },
-        files: ['**/*.vue'],
-    },
-]);

package/rules/deprecation-bento-popover-modifiers-prop/deprecation-bento-popover-modifiers-prop.integration.test.ts

@@ -1,24 +0,0 @@
-import path from 'node:path';
-import { execFileSyncEslintVueFiles } from '../../utils/exec-file-sync-eslint-vue-files';
-
-describe('@adyen/bento/deprecation-bento-popover-modifiers-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-bento-popover-modifiers-prop.vue');
-
-        // Execute the linter
-        const result = JSON.parse(execFileSyncEslintVueFiles(eslintrc, vueFile));
-
-        // 3 examples: static, shorthand, longhand
-        expect(result[0].warningCount).toBe(3);
-        expect(result[0].messages[0]).toMatchObject({
-            ruleId: '@adyen/bento/deprecation-bento-popover-modifiers-prop',
-            severity: 1,
-
-            messageId: 'deprecation',
-            message: `The "modifiers" prop is deprecated.`,
-        });
-    });
-});

package/rules/deprecation-bento-popover-modifiers-prop/deprecation-bento-popover-modifiers-prop.test.ts

@@ -1,109 +0,0 @@
-import { RuleTester } from 'eslint';
-import vueParser from 'vue-eslint-parser';
-import tsParser from '@typescript-eslint/parser';
-import deprecationBentoPopoverModifiersProp from './deprecation-bento-popover-modifiers-prop';
-
-const ruleTester = new RuleTester({
-    languageOptions: {
-        ecmaVersion: 'latest',
-        sourceType: 'module',
-        parser: vueParser,
-        parserOptions: {
-            parser: tsParser,
-        },
-    },
-});
-
-describe('@adyen/bento/deprecation-bento-popover-modifiers-prop', () => {
-    ruleTester.run('deprecation-bento-popover-modifiers-prop', deprecationBentoPopoverModifiersProp, {
-        valid: [
-            {
-                name: 'Valid usage for bento-popover',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-popover other-prop="val" />
-                </template>
-                `,
-            },
-        ],
-        invalid: [
-            {
-                name: 'Invalid: autofix disabled (explicit false)',
-                filename: 'test.vue',
-                code: `<template><bento-popover modifiers="val" /></template>`,
-                output: null,
-                options: [{ autofix: false }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: autofix disabled (no options)',
-                filename: 'test.vue',
-                code: `<template><bento-popover :modifiers="val" /></template>`,
-                output: null,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-popover: Static
-            {
-                name: 'Invalid: Static prop on bento-popover',
-                filename: 'test.vue',
-                code: `<template><bento-popover modifiers="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            // bento-popover: v-bind longhand
-            {
-                name: 'Invalid: v-bind longhand prop on bento-popover',
-                filename: 'test.vue',
-                code: `<template><bento-popover v-bind:modifiers="val" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-        ],
-    });
-
-    /* ------------------------------------------------ */
-    /* AUTOFIX TESTS                                    */
-    /* ------------------------------------------------ */
-    ruleTester.run('deprecation-bento-popover-modifiers-prop (autofix enabled)', deprecationBentoPopoverModifiersProp, {
-        valid: [
-            {
-                name: 'Valid: no modifiers prop (autofix enabled)',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-popover position="top" /></template>`,
-            },
-        ],
-        invalid: [
-            {
-                name: 'Autofix: removes static modifiers prop',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-popover modifiers="val" /></template>`,
-                output: `<template><bento-popover  /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Autofix: removes dynamic modifiers prop',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-popover :modifiers="val" /></template>`,
-                output: `<template><bento-popover  /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Autofix: removes v-bind longhand modifiers prop',
-                filename: 'test.vue',
-                options: [{ autofix: true }],
-                code: `<template><bento-popover v-bind:modifiers="val" /></template>`,
-                output: `<template><bento-popover  /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Autofix: does not fix when autofix is false',
-                filename: 'test.vue',
-                options: [{ autofix: false }],
-                code: `<template><bento-popover modifiers="val" other="x" /></template>`,
-                errors: [{ messageId: 'deprecation' }],
-            },
-        ],
-    });
-});

package/rules/deprecation-bento-timeline-item-variant-prop/__tests__/deprecation-bento-timeline-item-variant-prop.vue

@@ -1,9 +0,0 @@
-<template>
-    <div>
-        <bento-timeline-item variant="CheckedCircleIcon" />
-        <bento-timeline-item :variant="BentoTimelineItemVariant.CRITICAL" />
-        <bento-timeline-item :variant="BentoTimelineItemVariant.DEFAULT" />
-    </div>
-</template>
-
-<script setup></script>

package/rules/deprecation-bento-timeline-item-variant-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-bento-timeline-item-variant-prop': ['warn', { autofix: true }],
-        },
-        files: ['**/*.vue'],
-    },
-]);

package/rules/deprecation-bento-timeline-item-variant-prop/deprecation-bento-timeline-item-variant-prop.integration.test.ts

@@ -1,35 +0,0 @@
-import path from 'node:path';
-import { execFileSyncEslintVueFiles } from '../../utils/exec-file-sync-eslint-vue-files';
-
-describe('@adyen/bento/deprecation-bento-timeline-item-variant-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-bento-timeline-item-variant-prop.vue');
-
-        // Strip any non-JSON preamble (e.g. pnpm warnings)
-        const rawOutput = execFileSyncEslintVueFiles(eslintrc, vueFile);
-        const jsonStart = rawOutput.indexOf('[');
-
-        // Execute the linter
-        const result = JSON.parse(jsonStart >= 0 ? rawOutput.slice(jsonStart) : rawOutput);
-
-        // 3 examples: static, shorthand, longhand
-        expect(result[0].warningCount).toBe(3);
-
-        // Verify the message structure on the first error found.
-        // Since the rule is the same for all components, checking the first one confirms the message is correct.
-        expect(result[0].messages[0]).toMatchObject({
-            ruleId: '@adyen/bento/deprecation-bento-timeline-item-variant-prop',
-            severity: 1,
-
-            messageId: 'deprecation',
-            message: `The "variant" prop is deprecated. Please use "status" instead.`,
-
-            fix: expect.objectContaining({
-                text: expect.stringContaining('status='),
-            }),
-        });
-    });
-});