[Bug]: "react/jsx-handler-names" extremely slow with "checkInlineFunction: true " on a single file? #3858
Open
Description
opened on Nov 29, 2024
Is there an existing issue for this?
- I have searched the existing issues and my issue is unique
- My issue appears in the command-line and not only in the text editor
Description Overview
==========================================
=> Example JS file to run lint: example.js.txt <=
=========================================
ESlint "react/jsx-handler-names" is extremely slow when checkInlineFunction: true
on a single file.
'react/jsx-handler-names': [
'error',
{
checkLocalVariables: true,
checkInlineFunction: true
}
],
If I set checkInlineFunction
to false
the rule is not even mentioned in the time report. It is drastically faster.
Full ESlint config:
/* eslint-disable import/no-unused-modules */
module.exports = {
env: {
browser: true,
node: true,
es2021: true,
},
parserOptions: {
sourceType: 'module',
ecmaVersion: 2021,
},
plugins: [
'prettier',
'import',
'react',
'react-hooks',
'jsx-a11y',
'eslint-plugin-no-inline-styles',
],
extends: [
'eslint:recommended',
'prettier',
'plugin:import/errors',
'plugin:import/warnings',
'plugin:react/recommended',
'plugin:react/jsx-runtime',
'plugin:jsx-a11y/recommended',
'plugin:react-hooks/recommended',
],
ignorePatterns: ['node_modules/', 'build/', 'dist/'],
rules: {
'no-console': ['warn', { allow: ['warn', 'error'] }],
'no-inline-styles/no-inline-styles': 'error',
'react/prop-types': 'off',
'no-unused-vars': [
'error',
{
vars: 'all',
args: 'none',
ignoreRestSiblings: true,
argsIgnorePattern: '^_',
varsIgnorePattern: '^_',
caughtErrorsIgnorePattern: '^_',
},
],
'react/jsx-filename-extension': 'off',
'react/jsx-uses-react': 'error',
'react/display-name': 'off',
'react/jsx-uses-vars': 'error',
'no-empty-function': [
'error',
{
allow: ['arrowFunctions', 'getters', 'setters'],
},
],
'class-methods-use-this': 'off',
eqeqeq: 'error',
'import/default': 'error',
'import/named': 'error',
'import/no-named-as-default-member': 'off',
'import/order': [
'error',
{
groups: ['builtin', 'unknown', 'external', 'internal', 'sibling'],
pathGroups: [
{
pattern: 'react',
group: 'builtin',
position: 'before',
},
],
pathGroupsExcludedImportTypes: ['react'],
'newlines-between': 'always-and-inside-groups',
alphabetize: {
order: 'asc',
caseInsensitive: false,
},
},
],
'import/no-unused-modules': [
'error',
{
unusedExports: true,
missingExports: true,
},
],
'no-param-reassign': [
2,
{
props: false,
},
],
'no-implicit-coercion': ['error'],
'no-extra-boolean-cast': ['error'],
'no-use-before-define': 'error',
'prettier/prettier': 'error',
'react/boolean-prop-naming': ['error', { rule: '^(is|has)[A-Z]([A-Za-z0-9]?)+' }],
'react/button-has-type': 'error',
'react/function-component-definition': ['error', { namedComponents: 'arrow-function' }],
'react/hook-use-state': ['warn', { allowDestructuredState: true }],
'react/iframe-missing-sandbox': 'error',
'react/jsx-boolean-value': ['error', 'never'],
'react/jsx-curly-brace-presence': ['warn', { propElementValues: 'always' }],
'react/jsx-fragments': 'error',
'react/destructuring-assignment': ['error', 'never'],
'react/jsx-handler-names': [
'error',
{
checkLocalVariables: true,
checkInlineFunction: false,
},
],
'react/jsx-key': ['error', { warnOnDuplicates: true }],
'react/jsx-max-depth': ['warn', { max: 8 }],
'react/jsx-newline': ['warn', { prevent: true, allowMultilines: true }],
'react/jsx-no-constructed-context-values': 'error',
'react/jsx-no-leaked-render': ['error', { validStrategies: ['ternary'] }],
'react/jsx-no-script-url': [
'error',
[
{
name: 'Link',
props: ['to'],
},
], // Should describe explicitly components and props that should be checked.
],
'react/jsx-no-useless-fragment': ['warn', { allowExpressions: true }],
'react/jsx-pascal-case': 'error',
'react/jsx-sort-props': [
'warn',
{
callbacksLast: true,
shorthandFirst: true,
shorthandLast: false,
multiline: 'last',
ignoreCase: true,
noSortAlphabetically: false,
},
],
'react-hooks/exhaustive-deps': 'warn',
/**
* This rule enforces to remove useless index path segments
* Example: "../../../ui/inputs/input-textarea/index", should be "../../../ui/inputs/input-textarea"
*/
'import/no-useless-path-segments': [
'error',
{
noUselessIndex: true,
},
],
},
overrides: [],
settings: {
'import/ignore': ['node_modules'],
react: {
version: 'detect',
},
},
globals: {},
};
Expected Behavior
It should work normally fast.
eslint-plugin-react version
v7.37.2
eslint version
v8.57.1
node version
v20.15.0
Activity