Merge pull request #273 from draperunner/fix-sort-case-including-shorthand

Fix bug in sort-styles when props included shorthands

Author: Intellicode

lib/rules/sort-styles.js

@@ -92,14 +92,9 @@ module.exports = (context) => {
       const prevName = getStylePropertyIdentifier(previous);
       const currentName = getStylePropertyIdentifier(current);
 
-      if (
-        arrayName === 'style properties'
-        && isEitherShortHand(prevName, currentName)
-      ) {
-        return;
-      }
+      const oneIsShorthandForTheOther = arrayName === 'style properties' && isEitherShortHand(prevName, currentName);
 
-      if (!isValidOrder(prevName, currentName)) {
+      if (!oneIsShorthandForTheOther && !isValidOrder(prevName, currentName)) {
         return report(array, arrayName, node, previous, current);
       }
     }

tests/lib/rules/sort-styles.js

@@ -190,6 +190,32 @@ const tests = {
     },
   ],
   invalid: [
+    {
+      code: `
+          const styles = StyleSheet.create({
+            myClass: {
+              flex: 1,
+              flexDirection: 'row',
+              backgroundColor: 'red',
+            },
+          })
+          `,
+      output: `
+          const styles = StyleSheet.create({
+            myClass: {
+              backgroundColor: 'red',
+              flex: 1,
+              flexDirection: 'row',
+            },
+          })
+          `,
+      errors: [
+        {
+          message:
+            "Expected style properties to be in ascending order. 'backgroundColor' should be before 'flexDirection'.",
+        },
+      ],
+    },
     {
       code: `
           const styles = StyleSheet.create({