Skip to content

Commit

Permalink
[Fix] jsx-no-leaked-render: fix removing parentheses for conditionals
Browse files Browse the repository at this point in the history
Fixes #3502.
  • Loading branch information
akulsr0 authored and ljharb committed Dec 5, 2022
1 parent c9f5eb2 commit 8b51eef
Show file tree
Hide file tree
Showing 3 changed files with 22 additions and 0 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ This change log adheres to standards from [Keep a CHANGELOG](https://keepachange
* [`jsx-newline`]: No newline between comments and jsx elements ([#3493][] @justmejulian)
* [`jsx-no-leaked-render`]: Don't report errors on empty strings if React >= v18 ([#3488][] @himanshu007-creator)
* [`no-invalid-html-attribute`]: convert autofix to suggestion ([#3474][] @himanshu007-creator @ljharb)
* [`jsx-no-leaked-render`]: fix removing parentheses for conditionals ([#3502][] @akulsr0)

### Changed
* [Docs] [`jsx-no-leaked-render`]: Remove mentions of empty strings for React 18 ([#3468][] @karlhorky)
Expand Down
3 changes: 3 additions & 0 deletions lib/rules/jsx-no-leaked-render.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,9 @@ function ruleFixer(context, fixStrategy, fixer, reportedNode, leftNode, rightNod
return `${getIsCoerceValidNestedLogicalExpression(node) ? '' : '!!'}${nodeText}`;
}).join(' && ');

if (rightNode.type === 'ConditionalExpression') {
return fixer.replaceText(reportedNode, `${newText} && (${rightSideText})`);
}
return fixer.replaceText(reportedNode, `${newText} && ${rightSideText}`);
}

Expand Down
18 changes: 18 additions & 0 deletions tests/lib/rules/jsx-no-leaked-render.js
Original file line number Diff line number Diff line change
Expand Up @@ -829,5 +829,23 @@ ruleTester.run('jsx-no-leaked-render', rule, {
column: 24,
}],
},
{
code: `
const MyComponent = () => {
return <div>{maybeObject && (isFoo ? <Aaa /> : <Bbb />)}</div>
}
`,
output: `
const MyComponent = () => {
return <div>{!!maybeObject && (isFoo ? <Aaa /> : <Bbb />)}</div>
}
`,
options: [{ validStrategies: ['coerce'] }],
errors: [{
message: 'Potential leaked value that might cause unintentionally rendered values or rendering crashes',
line: 3,
column: 24,
}],
},
]),
});

0 comments on commit 8b51eef

Please sign in to comment.