Merge pull request #979 from markus101/jsx-sort-props-no-sort-alphabetically

jsx-sort-props noSortAlphabetically option

Author: lencioni

docs/rules/jsx-sort-props.md

@@ -27,7 +27,8 @@ The following patterns are considered okay and do not cause warnings:
   "callbacksLast": <boolean>,
   "shorthandFirst": <boolean>,
   "shorthandLast": <boolean>,
-  "ignoreCase": <boolean>
+  "ignoreCase": <boolean>,
+  "noSortAlphabetically": <boolean>
 }]
 ...
 ```
@@ -66,6 +67,14 @@ When `true`, short hand props must be listed after all other props (unless `call
 <Hello name="John" tel={5555555} active validate />
 ```
 
+### `noSortAlphabetically`
+
+When `true`, alphabetical order is not enforced:
+
+```js
+<Hello tel={5555555} name="John" />
+```
+
 ## When not to use
 
 This rule is a formatting preference and not following it won't negatively affect the quality of your code. If alphabetizing props isn't a part of your coding standards, then you can leave this rule off.

lib/rules/jsx-sort-props.js

@@ -40,6 +40,10 @@ module.exports = {
         },
         ignoreCase: {
           type: 'boolean'
+        },
+        // Whether alphabetical sorting should be enforced
+        noSortAlphabetically: {
+          type: 'boolean'
         }
       },
       additionalProperties: false
@@ -53,6 +57,7 @@ module.exports = {
     var callbacksLast = configuration.callbacksLast || false;
     var shorthandFirst = configuration.shorthandFirst || false;
     var shorthandLast = configuration.shorthandLast || false;
+    var noSortAlphabetically = configuration.noSortAlphabetically || false;
 
     return {
       JSXOpeningElement: function(node) {
@@ -114,7 +119,7 @@ module.exports = {
             }
           }
 
-          if (currentPropName < previousPropName) {
+          if (!noSortAlphabetically && currentPropName < previousPropName) {
             context.report({
               node: decl,
               message: 'Props should be sorted alphabetically'

tests/lib/rules/jsx-sort-props.js

@@ -57,6 +57,12 @@ var shorthandAndCallbackLastArgs = [{
 var ignoreCaseArgs = [{
   ignoreCase: true
 }];
+var noSortAlphabeticallyArgs = [{
+  noSortAlphabetically: true
+}];
+var sortAlphabeticallyArgs = [{
+  noSortAlphabetically: false
+}];
 
 ruleTester.run('jsx-sort-props', rule, {
   valid: [
@@ -84,7 +90,10 @@ ruleTester.run('jsx-sort-props', rule, {
       code: '<App a="a" b="b" x y z onBar onFoo />;',
       options: shorthandAndCallbackLastArgs,
       parserOptions: parserOptions
-    }
+    },
+    // noSortAlphabetically
+    {code: '<App a b />;', options: noSortAlphabeticallyArgs, parserOptions: parserOptions},
+    {code: '<App b a />;', options: noSortAlphabeticallyArgs, parserOptions: parserOptions}
   ],
   invalid: [
     {code: '<App b a />;', errors: [expectedError], parserOptions: parserOptions},
@@ -122,6 +131,7 @@ ruleTester.run('jsx-sort-props', rule, {
       errors: [shorthandAndCallbackLastArgs],
       options: shorthandLastArgs,
       parserOptions: parserOptions
-    }
+    },
+    {code: '<App b a />;', errors: [expectedError], options: sortAlphabeticallyArgs, parserOptions: parserOptions}
   ]
 });