`jsx-no-leaked-render` performs redundant props check and invalid fix in coerce mode
Context
There is a sample Checkbox component:
const Checkbox = ({
isChecked = false,
isIndeterminate = false,
}: {
isChecked?: boolean;
isIndeterminate?: boolean;
}) => (
<input
checked={isIndeterminate ? false : isChecked}
type="checkbox"
/>
);
The eslint config file contains a rule:
"react/jsx-no-leaked-render": ["error", { validStrategies: ["coerce"] }],
Expected behavior
Linting the code raises no issues
Actual behavior
- Eslint displays an error for the line:
checked={isIndeterminate ? false : isChecked}
Potential leaked value that might cause unintentionally rendered values or rendering crasheseslint[react/jsx-no-leaked-render](https://github.com/jsx-eslint/eslint-plugin-react/tree/master/docs/rules/jsx-no-leaked-render.md)
- When auto-fix is performed, the code above is replaced with
checked={!!isIndeterminate && false}
which causes the logical issues (the isChecked is removed in that case).
isChecked could be undefined, according to the types, and default arguments aren’t something that can really be used reliably with static analysis - so i think the warning may be correct.
I agree, though, that the autofix is incorrect - it should be fixing it to !isIndeterminate && isChecked
cc @Belco90
hey, would like to work on this issue
Go for it!
i was not able to reproduce the issue
In that case, can you make a PR with passing test cases, and it can close this issue?
I had an identical situation to the OP, and this error still occurred. @himanshu007-creator, did you remember to change the allowed strategies to only coerce?