@adyen/eslint-plugin-bento 2.23.0 → 2.24.1

package/rules/deprecation-components-input-emit/__tests__/eslint.config.js

@@ -1,25 +0,0 @@
-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-input-emit': ['warn', { autofix: true }],
-        },
-        files: ['**/*.vue'],
-    },
-]);

package/rules/deprecation-components-input-emit/deprecation-components-input-emit.integration.test.ts

@@ -1,43 +0,0 @@
-import path from 'node:path';
-import { execFileSyncEslintVueFiles } from '../../utils/exec-file-sync-eslint-vue-files';
-
-describe('@adyen/bento/deprecation-components-input-emit', () => {
-    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-input-emit.vue');
-
-        // Execute the linter
-        const result = JSON.parse(execFileSyncEslintVueFiles(eslintrc, vueFile));
-
-        /* ------------------------------------------------ */
-        /* CASE 2: SINGLE REPLACEMENT                       */
-        /* ------------------------------------------------ */
-
-        // For emits/slots, we generate 1 example FOR EACH component.
-        expect(result[0].warningCount).toBe(16);
-
-        // 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-components-input-emit',
-            severity: 1,
-
-            messageId: 'deprecation',
-            message: `The \`input\` emit is deprecated. Please use \`update:model-value\` instead.
-            
-Be wary of undesired side effects and race conditions if \`v-model\` is used in conjunction with \`@input\`.
-
-Incorrect:
-<bento-component v-model="text" @input="onInput" />
-
-Correct:
-<bento-component :model-value="text" @update:model-value="onInput" />`,
-
-            fix: expect.objectContaining({
-                text: expect.stringContaining('update:model-value'),
-            }),
-        });
-    });
-});

package/rules/deprecation-components-input-emit/deprecation-components-input-emit.test.ts

@@ -1,320 +0,0 @@
-import { RuleTester } from 'eslint';
-import vueParser from 'vue-eslint-parser';
-import tsParser from '@typescript-eslint/parser';
-import deprecationComponentsInputEmit from './deprecation-components-input-emit';
-
-const ruleTester = new RuleTester({
-    languageOptions: {
-        ecmaVersion: 'latest',
-        sourceType: 'module',
-        parser: vueParser,
-        parserOptions: {
-            parser: tsParser,
-        },
-    },
-});
-
-describe('@adyen/bento/deprecation-components-input-emit', () => {
-    ruleTester.run('deprecation-components-input-emit', deprecationComponentsInputEmit, {
-        valid: [
-            {
-                name: 'Valid usage for bento-date-picker',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-date-picker @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-date-range-picker',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-date-range-picker @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-dropdown',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-dropdown @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-dropdown-avatar',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-dropdown-avatar @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-dropdown-country',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-dropdown-country @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-dropdown-currency',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-dropdown-currency @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-dropdown-payment-method',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-dropdown-payment-method @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-dropdown-tag',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-dropdown-tag @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-file-uploader',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-file-uploader @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-input-field',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-input-field @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-input-field-password',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-input-field-password @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-input-field-phone-number',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-input-field-phone-number @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-checkbox-group',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-checkbox-group @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-radio-group',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-radio-group @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-selection-card-group',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-selection-card-group @update:model-value="val" />
-                </template>
-                `,
-            },
-            {
-                name: 'Valid usage for bento-textarea',
-                filename: 'test.vue',
-                code: `
-                <template>
-                    <bento-textarea @update:model-value="val" />
-                </template>
-                `,
-            },
-        ],
-        invalid: [
-            /* autofix: false */
-            {
-                name: 'Invalid: Emit event with autofix disabled (explicit false)',
-                filename: 'test.vue',
-                code: `<template><bento-input-field @input="val" /></template>`,
-                output: null,
-                options: [{ autofix: false }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event with autofix disabled (no options)',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown @input="handleInput" /></template>`,
-                output: null,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event with v-on directive and autofix disabled',
-                filename: 'test.vue',
-                code: `<template><bento-textarea v-on:input="val" /></template>`,
-                output: null,
-                errors: [{ messageId: 'deprecation' }],
-            },
-            /* autofix: true */
-            {
-                name: 'Invalid: Emit event on bento-date-picker',
-                filename: 'test.vue',
-                code: `<template><bento-date-picker @input="val" /></template>`,
-                output: `<template><bento-date-picker @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-date-range-picker',
-                filename: 'test.vue',
-                code: `<template><bento-date-range-picker @input="val" /></template>`,
-                output: `<template><bento-date-range-picker @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-dropdown',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown @input="val" /></template>`,
-                output: `<template><bento-dropdown @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-dropdown-avatar',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown-avatar @input="val" /></template>`,
-                output: `<template><bento-dropdown-avatar @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-dropdown-country',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown-country @input="val" /></template>`,
-                output: `<template><bento-dropdown-country @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-dropdown-currency',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown-currency @input="val" /></template>`,
-                output: `<template><bento-dropdown-currency @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-dropdown-payment-method',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown-payment-method @input="val" /></template>`,
-                output: `<template><bento-dropdown-payment-method @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-dropdown-tag',
-                filename: 'test.vue',
-                code: `<template><bento-dropdown-tag @input="val" /></template>`,
-                output: `<template><bento-dropdown-tag @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-file-uploader',
-                filename: 'test.vue',
-                code: `<template><bento-file-uploader @input="val" /></template>`,
-                output: `<template><bento-file-uploader @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-input-field',
-                filename: 'test.vue',
-                code: `<template><bento-input-field @input="val" /></template>`,
-                output: `<template><bento-input-field @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-input-field-password',
-                filename: 'test.vue',
-                code: `<template><bento-input-field-password @input="val" /></template>`,
-                output: `<template><bento-input-field-password @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-input-field-phone-number',
-                filename: 'test.vue',
-                code: `<template><bento-input-field-phone-number @input="val" /></template>`,
-                output: `<template><bento-input-field-phone-number @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-checkbox-group',
-                filename: 'test.vue',
-                code: `<template><bento-checkbox-group @input="val" /></template>`,
-                output: `<template><bento-checkbox-group @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-radio-group',
-                filename: 'test.vue',
-                code: `<template><bento-radio-group @input="val" /></template>`,
-                output: `<template><bento-radio-group @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-selection-card-group',
-                filename: 'test.vue',
-                code: `<template><bento-selection-card-group @input="val" /></template>`,
-                output: `<template><bento-selection-card-group @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-            {
-                name: 'Invalid: Emit event on bento-textarea',
-                filename: 'test.vue',
-                code: `<template><bento-textarea @input="val" /></template>`,
-                output: `<template><bento-textarea @update:model-value="val" /></template>`,
-                options: [{ autofix: true }],
-                errors: [{ messageId: 'deprecation' }],
-            },
-        ],
-    });
-});

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

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

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

@@ -1,25 +0,0 @@
-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-value-prop': ['warn', { autofix: true }],
-        },
-        files: ['**/*.vue'],
-    },
-]);

package/rules/deprecation-components-value-prop/deprecation-components-value-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-value-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-value-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 = 16;
-        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-components-value-prop',
-            severity: 1,
-
-            messageId: 'deprecation',
-            message: `The "value" prop is deprecated. Please use "model-value" instead.`,
-
-            fix: expect.objectContaining({
-                text: expect.stringContaining('model-value'),
-            }),
-        });
-    });
-});