react/jsx-handler-names: cannot opt-out of handler prefix independent of prop prefix

[drewlustro]

Issue

I only want to enforce eventHandlerPropPrefix, but I cannot selectively opt out of eventHandlerPrefix.

---

1. Rule always plugs in a default value 'handle' into eventHandlerPrefix when supplied value is an empty string '' (falsy)

Problematic code:

// will always be set to 'handle' when falsy
const eventHandlerPrefix = configuration.eventHandlerPrefix || 'handle';

source

---

2. Rule prevents "whitelist" JS regex workarounds noted in #1687 because a capital letter must succeed the allowed prefix.

Example Config: I want to whitelist submit select verbatim and handle* prefix:

"react/jsx-handler-names": ['error', {
  "eventHandlerPrefix": '(handle|submit|select)',
  "eventHandlerPropPrefix": 'on',
}],

Problematic code:

// [A-Z] succeeding eventHandlerPrefix prevents handler whitelist
const EVENT_HANDLER_REGEX = new RegExp(`^((props\\.${eventHandlerPropPrefix})|((.*\\.)?${eventHandlerPrefix}))[A-Z].*$`);

source

[ljharb]

I'm not very clear on what actual code you want to be allowed, and what disallowed?

[drewlustro]

I want to be able to set eventHandlerPrefix: false | null in order to turn off the prefix requirement and only enforce the prefix requirement for eventHandlerPropPrefix.

[ljharb]

Can you provide raw source code that you want to allow or disallow, without speaking in any way about linter rules or configuration options?

[drewlustro]

Assuming hypothetical config:

"react/jsx-handler-names": ['error', {
  "eventHandlerPrefix": false,
  "eventHandlerPropPrefix": 'on',
}],

Allow:

<Foo
  onSubmit={this.submit}
/>

<Foo
  onSubmit={this.handleSubmit}
/>

<Foo
  onSubmit={this.whateverAnythingIsOkay}
/>

Disallow:

<Foo
  submit={this.submit} // error, prop handler must be prefixed with 'on'
/>

[ljharb]

Thanks. Adding support for false - in either config option, but not both - seems like a great PR.

[drewlustro]

Awesome; will see if I can give it a shot in the coming week.

[drewlustro]

<3