Skip to content

react/jsx-sort-props not working #1320

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
tobyf93 opened this issue Jul 24, 2017 · 5 comments · Fixed by #1340
Closed

react/jsx-sort-props not working #1320

tobyf93 opened this issue Jul 24, 2017 · 5 comments · Fixed by #1340

Comments

@tobyf93
Copy link

tobyf93 commented Jul 24, 2017

I seem to be having trouble getting this rule to work. The documentation references the following interface:

"react/jsx-sort-props": [<enabled>, {
  "callbacksLast": <boolean>,
  "shorthandFirst": <boolean>,
  "shorthandLast": <boolean>,
  "ignoreCase": <boolean>,
  "noSortAlphabetically": <boolean>,
  "reservedFirst": <boolean>|<array<string>>,
}]

My current configuration is "react/jsx-sort-props": [2]. I have omitted the options which seem to work fine for other rules in the library. Don't get any errors for the following component:

<Component c="c" b="b" a="a" />
@ljharb
Copy link
Member

ljharb commented Jul 24, 2017

There must be something else going on - the test cases (https://github.com/yannickcr/eslint-plugin-react/blob/master/tests/lib/rules/jsx-sort-props.js#L106, https://github.com/yannickcr/eslint-plugin-react/blob/master/tests/lib/rules/jsx-sort-props.js#L162) seem pretty solid.

Can you provide a full repro case, not just with options omitted?

@tobyf93
Copy link
Author

tobyf93 commented Jul 26, 2017

https://github.com/tobyf93/jsx-sort-props-issue

npm run lint will give you an error about boolean attributes but not prop order...

@tobyf93
Copy link
Author

tobyf93 commented Jul 26, 2017

same result for:

"react/jsx-sort-props": [2, {
  "callbacksLast": false,
  "shorthandFirst": false,
  "shorthandLast": false,
  "ignoreCase": false,
  "noSortAlphabetically": false,
  "reservedFirst": true
}]

@tagoro9
Copy link
Contributor

tagoro9 commented Aug 3, 2017

I just run into this issue too. I think that when reservedFirst is enabled and noSortAlphabetically is off, then the alphabetical order is only enforced within the reserved props.

Adding a test case like this shows the issue:

{
  code: '<App key={2} b a />',
  options: reservedFirstAsBooleanArgs,
  errors: [expectedError]
}

I don't know if the expected behavior is that sorting is only enforced within the reserved props, but I would expect the alphabetical order to also be enforced in the other props.

I think I have a fix for this, so I'm gonna submit a PR with it. If this fix is not desired and current behavior is the desired, I apologize for all this noise.

@sadarshannaiynar
Copy link

sadarshannaiynar commented Oct 1, 2017

Still not working any working fix?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Development

Successfully merging a pull request may close this issue.

4 participants