[New] `jsx-no-leaked-render`: add `ignoreAttributes` option

[aleclarson]

Fixes #3292

When ignoreAttributes is true, validation of JSX attribute values is skipped.

Todo

• [ ] write docs

[codecov[bot]]

Codecov Report

Attention: Patch coverage is 90.90909% with 1 lines in your changes are missing coverage. Please review.

Project coverage is 97.61%. Comparing base (417e1ca) to head (9c84be6).

:exclamation: Current head 9c84be6 differs from pull request most recent head b0a9c41

Please upload reports for the commit b0a9c41 to get more accurate results.

Files	Patch %	Lines
lib/rules/jsx-no-leaked-render.js	90.90%	1 Missing :warning:

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #3441      +/-   ##
==========================================
- Coverage   97.79%   97.61%   -0.19%     
==========================================
  Files         134      123      -11     
  Lines        9613     8970     -643     
  Branches     3486     3275     -211     
==========================================
- Hits         9401     8756     -645     
- Misses        212      214       +2     

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

[levrik]

I think ignoreProps would be a more suitable name here.

[aleclarson]

Can you elaborate on the use case here?

Certainly the component you're passing the prop value to might not be directly rendering it - but I'm not sure why that makes it OK to pass a renderable falsy value.

The use case is preferring to avoid false positives. The component receiving the prop is responsible for avoiding leaky render. Many prefer to keep the warning local to where the prop is actually rendered.

[ljharb]

I see - so you're saying, you still want to report on leaky renders on DOM elements, but you don't want to do that on props on custom elements so that the custom component has the responsibility to check for it?

In that case, what i'd expect is that this could be ignoreNonDOMProps, and it would only suppress warning on props of non-DOM elements - would that meet your use case?

[tcl333]

This rule is unusable to me until this PR is landed. I need to handle a very basic usecase of <Component isFooBar={isFoo && isBar}>. This rule currently auto-breaks that line by converting it into <Component isFooBar={isFoo ? isBar : null }>. My component doesn't take null as a prop, nor should it be required to.

[l1135677068]

I want to know how to use the ignoreAttributes option? i use it like belows code, but it throw an error.

  "react/jsx-no-leaked-render": ["error", { "validStrategies": ["coerce"], ignoreAttributes: true }]

Is there a use case that i can refer to?

[ljharb]

@l1135677068 this PR isn't merged yet, and thus can't be released yet either, so you can't use it yet.

[ljharb]

I've just rebased this PR; it's ready to go once there's documentation. If someone wants to leave a code review suggestion, I can pull it in and land this.

[l1135677068]

If someone wants to leave a code review suggestion, I can pull it in and land this.

ok, i get it.