Skip to content

Commit 3db5285

Browse files
Tobias Waltlljharb
Tobias Waltl
authored and
ljharb
committed
[Fix] jsx-indent-props: Reset line.isUsingOperator correctly after ternary
1 parent d56fdb8 commit 3db5285

File tree

3 files changed

+269
-1
lines changed

3 files changed

+269
-1
lines changed

‎CHANGELOG.md‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,16 @@ This change log adheres to standards from [Keep a CHANGELOG](http://keepachangel
88
### Added
99
* [`function-component-definition`]: support namedComponents option being an array ([#3129][] @petersendidit)
1010

11+
### Fixed
12+
* [`jsx-indent-props`]: Reset `line.isUsingOperator` correctly after ternary ([#3146][] @tobiaswaltl)
13+
1114
### Changed
1215
* [Refactor] [`no-arrow-function-lifecycle`], [`no-unused-class-component-methods`]: use report/messages convention (@ljharb)
1316
* [Tests] component detection: Add testing scaffolding ([#3149][] @duncanbeevers)
1417
* [New] component detection: track React imports ([#3149][] @duncanbeevers)
1518

1619
[#3149]: https://github.com/yannickcr/eslint-plugin-react/pull/3149
20+
[#3146]: https://github.com/yannickcr/eslint-plugin-react/pull/3146
1721
[#3129]: https://github.com/yannickcr/eslint-plugin-react/pull/3129
1822

1923
## [7.27.1] - 2021.11.18

‎lib/rules/jsx-indent-props.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -153,7 +153,7 @@ module.exports = {
153153

154154
const indent = regExp.exec(src);
155155
const useOperator = /^([ ]|[\t])*[:]/.test(src) || /^([ ]|[\t])*[?]/.test(src);
156-
const useBracket = /^([ ]|[\t])*[<]/.test(src);
156+
const useBracket = /[<]/.test(src);
157157

158158
line.currentOperator = false;
159159
if (useOperator) {

‎tests/lib/rules/jsx-indent-props.js‎

Lines changed: 264 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -195,6 +195,90 @@ ruleTester.run('jsx-indent-props', rule, {
195195
},
196196
],
197197
},
198+
{
199+
code: `
200+
const F = () => {
201+
const foo = true
202+
? <div id="id">test</div>
203+
: false;
204+
205+
return <div
206+
id="id"
207+
>
208+
test
209+
</div>
210+
}
211+
`,
212+
options: [
213+
{
214+
indentMode: 2,
215+
ignoreTernaryOperator: false,
216+
},
217+
],
218+
},
219+
{
220+
code: `
221+
const F = () => {
222+
const foo = true
223+
? <div id="id">test</div>
224+
: false;
225+
226+
return <div
227+
id="id"
228+
>
229+
test
230+
</div>
231+
}
232+
`,
233+
options: [
234+
{
235+
indentMode: 2,
236+
ignoreTernaryOperator: true,
237+
},
238+
],
239+
},
240+
{
241+
code: `
242+
\t\t\t\tconst F = () => {
243+
\t\t\t\t\tconst foo = true
244+
\t\t\t\t\t\t? <div id="id">test</div>
245+
\t\t\t\t\t\t: false;
246+
247+
\t\t\t\t\treturn <div
248+
\t\t\t\t\t\tid="id"
249+
\t\t\t\t\t>
250+
\t\t\t\t\t\ttest
251+
\t\t\t\t\t</div>
252+
\t\t\t\t}
253+
`,
254+
options: [
255+
{
256+
indentMode: 'tab',
257+
ignoreTernaryOperator: false,
258+
},
259+
],
260+
},
261+
{
262+
code: `
263+
\t\t\t\tconst F = () => {
264+
\t\t\t\t\tconst foo = true
265+
\t\t\t\t\t\t? <div id="id">test</div>
266+
\t\t\t\t\t\t: false;
267+
268+
\t\t\t\t\treturn <div
269+
\t\t\t\t\t\tid="id"
270+
\t\t\t\t\t>
271+
\t\t\t\t\t\ttest
272+
\t\t\t\t\t</div>
273+
\t\t\t\t}
274+
`,
275+
options: [
276+
{
277+
indentMode: 'tab',
278+
ignoreTernaryOperator: true,
279+
},
280+
],
281+
},
198282
{
199283
code: `
200284
{this.props.ignoreTernaryOperatorTrue
@@ -607,5 +691,185 @@ ruleTester.run('jsx-indent-props', rule, {
607691
},
608692
],
609693
},
694+
{
695+
code: `
696+
const F = () => {
697+
const foo = true
698+
? <div id="id">test</div>
699+
: false;
700+
701+
return <div
702+
id="id"
703+
>
704+
test
705+
</div>
706+
}
707+
`,
708+
output: `
709+
const F = () => {
710+
const foo = true
711+
? <div id="id">test</div>
712+
: false;
713+
714+
return <div
715+
id="id"
716+
>
717+
test
718+
</div>
719+
}
720+
`,
721+
options: [
722+
{
723+
indentMode: 2,
724+
ignoreTernaryOperator: false,
725+
},
726+
],
727+
errors: [
728+
{
729+
messageId: 'wrongIndent',
730+
data: {
731+
needed: 12,
732+
type: 'space',
733+
characters: 'characters',
734+
gotten: 14,
735+
},
736+
},
737+
],
738+
},
739+
{
740+
code: `
741+
const F = () => {
742+
const foo = true
743+
? <div id="id">test</div>
744+
: false;
745+
746+
return <div
747+
id="id"
748+
>
749+
test
750+
</div>
751+
}
752+
`,
753+
output: `
754+
const F = () => {
755+
const foo = true
756+
? <div id="id">test</div>
757+
: false;
758+
759+
return <div
760+
id="id"
761+
>
762+
test
763+
</div>
764+
}
765+
`,
766+
options: [
767+
{
768+
indentMode: 2,
769+
ignoreTernaryOperator: true,
770+
},
771+
],
772+
errors: [
773+
{
774+
messageId: 'wrongIndent',
775+
data: {
776+
needed: 12,
777+
type: 'space',
778+
characters: 'characters',
779+
gotten: 14,
780+
},
781+
},
782+
],
783+
},
784+
{
785+
code: `
786+
\t\t\t\tconst F = () => {
787+
\t\t\t\t\tconst foo = true
788+
\t\t\t\t\t\t? <div id="id">test</div>
789+
\t\t\t\t\t\t: false;
790+
791+
\t\t\t\t\treturn <div
792+
\t\t\t\t\t\t\tid="id"
793+
\t\t\t\t\t>
794+
\t\t\t\t\t\ttest
795+
\t\t\t\t\t</div>
796+
\t\t\t\t}
797+
`,
798+
output: `
799+
\t\t\t\tconst F = () => {
800+
\t\t\t\t\tconst foo = true
801+
\t\t\t\t\t\t? <div id="id">test</div>
802+
\t\t\t\t\t\t: false;
803+
804+
\t\t\t\t\treturn <div
805+
\t\t\t\t\t\tid="id"
806+
\t\t\t\t\t>
807+
\t\t\t\t\t\ttest
808+
\t\t\t\t\t</div>
809+
\t\t\t\t}
810+
`,
811+
options: [
812+
{
813+
indentMode: 'tab',
814+
ignoreTernaryOperator: false,
815+
},
816+
],
817+
errors: [
818+
{
819+
messageId: 'wrongIndent',
820+
data: {
821+
needed: 6,
822+
type: 'tab',
823+
characters: 'characters',
824+
gotten: 7,
825+
},
826+
},
827+
],
828+
},
829+
{
830+
code: `
831+
\t\t\t\tconst F = () => {
832+
\t\t\t\t\tconst foo = true
833+
\t\t\t\t\t\t? <div id="id">test</div>
834+
\t\t\t\t\t\t: false;
835+
836+
\t\t\t\t\treturn <div
837+
\t\t\t\t\t\t\tid="id"
838+
\t\t\t\t\t>
839+
\t\t\t\t\t\ttest
840+
\t\t\t\t\t</div>
841+
\t\t\t\t}
842+
`,
843+
output: `
844+
\t\t\t\tconst F = () => {
845+
\t\t\t\t\tconst foo = true
846+
\t\t\t\t\t\t? <div id="id">test</div>
847+
\t\t\t\t\t\t: false;
848+
849+
\t\t\t\t\treturn <div
850+
\t\t\t\t\t\tid="id"
851+
\t\t\t\t\t>
852+
\t\t\t\t\t\ttest
853+
\t\t\t\t\t</div>
854+
\t\t\t\t}
855+
`,
856+
options: [
857+
{
858+
indentMode: 'tab',
859+
ignoreTernaryOperator: true,
860+
},
861+
],
862+
errors: [
863+
{
864+
messageId: 'wrongIndent',
865+
data: {
866+
needed: 6,
867+
type: 'tab',
868+
characters: 'characters',
869+
gotten: 7,
870+
},
871+
},
872+
],
873+
},
610874
]),
611875
});

0 commit comments

Comments
 (0)