Fix regression in 1.6.0 that broke @include media(">=desk") sorting

Author: hudochenkov

CHANGELOG.md

@@ -2,6 +2,9 @@
 All notable changes to this project will be documented in this file.
 This project adheres to [Semantic Versioning](http://semver.org/).
 
+## 1.6.1
+* Fixed a regression in 1.6.0. Sort order with item like `@include media` didn't found rules like `@include media(">=desk") {}`.
+
 ## 1.6.0
 * Add special comments to disable processing for some part in style sheet
 * Support custom properties as $variable #27

index.js

@@ -77,16 +77,29 @@ function createLineBreaks(lineBreaksCount) {
 
 function getAtruleSortName(node, order) {
 	var atruleName = '@' + node.name;
+	var sortNameExtended;
+	var atruleParameter;
 
-	// If atRule has a parameter like @mixin name or @include name, sort by this parameter
-	var atruleParameter = (/^[\w-\(\)]+/).exec(node.params);
-
-	if (atruleParameter && atruleParameter.length) {
-		var sortNameExtended = atruleName + ' ' + atruleParameter[0];
+	// If atRule has a parameter like `@mixin name` or `@include name`, sort by this parameter
+	if (node.params) {
+		atruleParameter = node.params;
+		sortNameExtended = atruleName + ' ' + atruleParameter;
 
+		// check if there is a whole parameter in the config, e. g. `media("<=desk")`
 		if (order[sortNameExtended]) {
 			return sortNameExtended;
 		}
+
+		// check if there is a part of parameter in the config, e. g. `media` from `media("<=desk")`
+		atruleParameter = (/^[\w-]+/).exec(atruleParameter);
+
+		if (atruleParameter && atruleParameter.length) {
+			sortNameExtended = atruleName + ' ' + atruleParameter[0];
+
+			if (order[sortNameExtended]) {
+				return sortNameExtended;
+			}
+		}
 	}
 
 	// If atrule with name is in order use the name

package.json

@@ -1,6 +1,6 @@
 {
   "name": "postcss-sorting",
-  "version": "1.6.0",
+  "version": "1.6.1",
   "description": "PostCSS plugin to sort rules content with specified order.",
   "keywords": [
     "postcss",

test/fixtures/at-rules-by-parameter-with-arg.css

@@ -3,5 +3,9 @@
 	@include mwp(3);
 	border: none;
 	@include mwp(2);
+	@include mwp(some-name);
 	@include mwp(1);
+	@include media("<=desk") {
+		display: none;
+	}
 }

test/fixtures/at-rules-by-parameter-with-arg.expected.css

@@ -2,6 +2,10 @@
 	@mixin clearfix;
 	border: none;
 	@include mwp(1);
+	@include media("<=desk") {
+		display: none;
+	}
 	@include mwp(2);
 	@include mwp(3);
+	@include mwp(some-name)
 }

test/fixtures/at-rules-by-parameter.css

@@ -1,4 +1,7 @@
 .block {
+	@include media(">=palm") {
+		border: 1px solid #000;
+	}
 	@some-rule hello;
 	border: none;
 	@mixin clearfix;

test/fixtures/at-rules-by-parameter.expected.css

@@ -2,5 +2,8 @@
 	@mixin island;
 	border: none;
 	@some-rule hello;
+	@include media(">=palm") {
+		border: 1px solid #000;
+	}
 	@mixin clearfix;
 }

test/test.js

@@ -159,13 +159,27 @@ test('Should sort complex case with leftovers', t => {
 
 test('Should sort at-rules by their parameter name', t => {
 	return run(t, 'at-rules-by-parameter', { 'sort-order': [
-		['@mixin', 'border', '@some-rule hello', '@mixin clearfix']
+		[
+			'@mixin',
+			'border',
+			'@some-rule hello',
+			'@include media(">=palm")',
+			'@mixin clearfix'
+		]
 	] });
 });
 
 test('Should sort at-rules by their parameter name and argument', t => {
 	return run(t, 'at-rules-by-parameter-with-arg', { 'sort-order': [
-		['@mixin', 'border', '@include mwp(1)', '@include mwp(2)', '@include mwp(3)']
+		[
+			'@mixin',
+			'border',
+			'@include mwp(1)',
+			'@include media("<=desk")',
+			'@include mwp(2)',
+			'@include mwp(3)',
+			'@include mwp(some-name)'
+		]
 	] });
 });