Add autofix to media-query-list-comma-newline-after

docs/user-guide/rules.md

@@ -328,7 +328,7 @@ Here are all the rules within stylelint, grouped first [by category](../../VISIO
 
 #### Media query list
 
--   [`media-query-list-comma-newline-after`](../../lib/rules/media-query-list-comma-newline-after/README.md): Require a newline or disallow whitespace after the commas of media query lists.
+-   [`media-query-list-comma-newline-after`](../../lib/rules/media-query-list-comma-newline-after/README.md): Require a newline or disallow whitespace after the commas of media query lists (Autofixable).
 -   [`media-query-list-comma-newline-before`](../../lib/rules/media-query-list-comma-newline-before/README.md): Require a newline or disallow whitespace before the commas of media query lists.
 -   [`media-query-list-comma-space-after`](../../lib/rules/media-query-list-comma-space-after/README.md): Require a single space or disallow whitespace after the commas of media query lists (Autofixable).
 -   [`media-query-list-comma-space-before`](../../lib/rules/media-query-list-comma-space-before/README.md): Require a single space or disallow whitespace before the commas of media query lists.

lib/rules/media-query-list-comma-newline-after/README.md

@@ -9,6 +9,8 @@ Require a newline or disallow whitespace after the commas of media query lists.
  *            These commas */
 ```
 
+The `--fix` option on the [command line](../../../docs/user-guide/cli.md#autofixing-errors) can automatically fix all of the problems reported by this rule.
+
 ## Options
 
 `string`: `"always"|"always-multi-line"|"never-multi-line"`

lib/rules/media-query-list-comma-newline-after/__tests__/index.js

@@ -6,6 +6,7 @@ const { messages, ruleName } = rule;
 testRule(rule, {
   ruleName,
   config: ["always"],
+  fix: true,
 
   accept: [
     {
@@ -58,46 +59,96 @@ testRule(rule, {
   reject: [
     {
       code: "@media screen and (color),projection and (color) {}",
+      fixed: "@media screen and (color),\nprojection and (color) {}",
       message: messages.expectedAfter(),
       line: 1,
       column: 26
     },
     {
       code: "@mEdIa screen and (color),projection and (color) {}",
+      fixed: "@mEdIa screen and (color),\nprojection and (color) {}",
       message: messages.expectedAfter(),
       line: 1,
       column: 26
     },
     {
       code: "@MEDIA screen and (color),projection and (color) {}",
+      fixed: "@MEDIA screen and (color),\nprojection and (color) {}",
       message: messages.expectedAfter(),
       line: 1,
       column: 26
     },
     {
       code: "@media screen and (color), projection and (color) {}",
+      fixed: "@media screen and (color),\n projection and (color) {}",
       message: messages.expectedAfter(),
       line: 1,
       column: 26
     },
     {
       code: "@media screen and (color),  projection and (color) {}",
+      fixed: "@media screen and (color),\n  projection and (color) {}",
       message: messages.expectedAfter(),
       line: 1,
       column: 26
     },
     {
       code: "@media screen and (color),\tprojection and (color) {}",
+      fixed: "@media screen and (color),\n\tprojection and (color) {}",
       message: messages.expectedAfter(),
       line: 1,
       column: 26
+    },
+    {
+      code: "@media screen and (color), \n\tprojection and (color) {}",
+      fixed: "@media screen and (color),\n\tprojection and (color) {}",
+      message: messages.expectedAfter(),
+      line: 1,
+      column: 26
+    },
+    {
+      code: "@media screen and (color),projection and (color) {\r\n}",
+      fixed: "@media screen and (color),\r\nprojection and (color) {\r\n}",
+      message: messages.expectedAfter(),
+      line: 1,
+      column: 26
+    },
+    {
+      code: "@media screen and (color), \r\n\tprojection and (color) {}",
+      fixed: "@media screen and (color),\r\n\tprojection and (color) {}",
+      message: messages.expectedAfter(),
+      line: 1,
+      column: 26
+    },
+    {
+      code: "@media screen and (color),/**/projection and (color) {}",
+      fixed: "@media screen and (color),\n/**/projection and (color) {}",
+      message: messages.expectedAfter(),
+      line: 1,
+      column: 26
+    },
+    {
+      // we want to allow newline after comment.
+      code: "@media screen and (color),/**/\nprojection and (color) {}",
+      fixed: "@media screen and (color),\n/**/\nprojection and (color) {}",
+      message: messages.expectedAfter(),
+      line: 1,
+      column: 26
+    },
+    {
+      code: "@media " + "tv,".repeat(50) + "print {}",
+      fixed: "@media " + "tv,\n".repeat(50) + "print {}",
+      message: messages.expectedAfter(),
+      line: 1,
+      column: 10
     }
   ]
 });
 
 testRule(rule, {
   ruleName,
   config: ["always-multi-line"],
+  fix: true,
 
   accept: [
     {
@@ -145,30 +196,36 @@ testRule(rule, {
   reject: [
     {
       code: "@media screen and (color),projection and (color),\nprint {}",
+      fixed: "@media screen and (color),\nprojection and (color),\nprint {}",
       message: messages.expectedAfterMultiLine(),
       line: 1,
       column: 26
     },
     {
       code: "@mEdIa screen and (color),projection and (color),\nprint {}",
+      fixed: "@mEdIa screen and (color),\nprojection and (color),\nprint {}",
       message: messages.expectedAfterMultiLine(),
       line: 1,
       column: 26
     },
     {
       code: "@MEDIA screen and (color),projection and (color),\nprint {}",
+      fixed: "@MEDIA screen and (color),\nprojection and (color),\nprint {}",
       message: messages.expectedAfterMultiLine(),
       line: 1,
       column: 26
     },
     {
       code: "@media screen and (color),projection and (color),\nprint {\n}",
+      fixed: "@media screen and (color),\nprojection and (color),\nprint {\n}",
       message: messages.expectedAfterMultiLine(),
       line: 1,
       column: 26
     },
     {
       code: "@media screen and (color),projection and (color),\r\nprint {\r\n}",
+      fixed:
+        "@media screen and (color),\r\nprojection and (color),\r\nprint {\r\n}",
       description: "CRLF",
       message: messages.expectedAfterMultiLine(),
       line: 1,
@@ -180,6 +237,7 @@ testRule(rule, {
 testRule(rule, {
   ruleName,
   config: ["never-multi-line"],
+  fix: true,
 
   accept: [
     {
@@ -227,35 +285,68 @@ testRule(rule, {
   reject: [
     {
       code: "@media screen and (color) ,projection and (color),\nprint {}",
+      fixed: "@media screen and (color) ,projection and (color),print {}",
       message: messages.rejectedAfterMultiLine(),
       line: 1,
       column: 50
     },
     {
       code: "@mEdIa screen and (color) ,projection and (color),\nprint {}",
+      fixed: "@mEdIa screen and (color) ,projection and (color),print {}",
       message: messages.rejectedAfterMultiLine(),
       line: 1,
       column: 50
     },
     {
       code: "@MEDIA screen and (color) ,projection and (color),\nprint {}",
+      fixed: "@MEDIA screen and (color) ,projection and (color),print {}",
       message: messages.rejectedAfterMultiLine(),
       line: 1,
       column: 50
     },
     {
       code: "@media screen and (color) ,projection and (color),\nprint {\n}",
+      fixed: "@media screen and (color) ,projection and (color),print {\n}",
       message: messages.rejectedAfterMultiLine(),
       line: 1,
       column: 50
     },
     {
       code:
         "@media screen and (color) ,projection and (color),\r\nprint {\r\n}",
+      fixed: "@media screen and (color) ,projection and (color),print {\r\n}",
       description: "CRLF",
       message: messages.rejectedAfterMultiLine(),
       line: 1,
       column: 50
+    },
+    {
+      code: "@media screen and (color),\t\n projection and (color) {}",
+      fixed: "@media screen and (color),projection and (color) {}",
+      message: messages.rejectedAfterMultiLine(),
+      line: 1,
+      column: 26
+    },
+    {
+      code: "@media screen and (color),\t\r\n projection and (color) {}",
+      fixed: "@media screen and (color),projection and (color) {}",
+      message: messages.rejectedAfterMultiLine(),
+      line: 1,
+      column: 26
+    },
+    {
+      code: "@media screen and (color),\n/**/\nprojection and (color) {}",
+      fixed: "@media screen and (color),/**/\nprojection and (color) {}",
+      message: messages.rejectedAfterMultiLine(),
+      line: 1,
+      column: 26
+    },
+    {
+      code: "@media " + "tv,\n".repeat(50) + "print {\n}",
+      fixed: "@media " + "tv,".repeat(50) + "print {\n}",
+      message: messages.rejectedAfterMultiLine(),
+      line: 1,
+      column: 10
     }
   ]
 });

lib/rules/media-query-list-comma-newline-after/index.js

@@ -1,5 +1,6 @@
 "use strict";
 
+const atRuleParamIndex = require("../../utils/atRuleParamIndex");
 const mediaQueryListCommaWhitespaceChecker = require("../mediaQueryListCommaWhitespaceChecker");
 const ruleMessages = require("../../utils/ruleMessages");
 const validateOptions = require("../../utils/validateOptions");
@@ -15,7 +16,7 @@ const messages = ruleMessages(ruleName, {
     'Unexpected whitespace after "," in a multi-line list'
 });
 
-const rule = function(expectation) {
+const rule = function(expectation, options, context) {
   const checker = whitespaceChecker("newline", expectation, messages);
 
   return (root, result) => {
@@ -29,12 +30,49 @@ const rule = function(expectation) {
 
     // Only check for the newline after the comma, while allowing
     // arbitrary indentation after the newline
+    let fixData;
     mediaQueryListCommaWhitespaceChecker({
       root,
       result,
       locationChecker: checker.afterOneOnly,
-      checkedRuleName: ruleName
+      checkedRuleName: ruleName,
+      fix: context.fix
+        ? (atRule, index) => {
+            const paramCommaIndex = index - atRuleParamIndex(atRule);
+            fixData = fixData || new Map();
+            const commaIndices = fixData.get(atRule) || [];
+            commaIndices.push(paramCommaIndex);
+            fixData.set(atRule, commaIndices);
+            return true;
+          }
+        : null
     });
+
+    if (fixData) {
+      fixData.forEach((commaIndices, atRule) => {
+        let params = atRule.raws.params
+          ? atRule.raws.params.raw
+          : atRule.params;
+        commaIndices.sort((a, b) => b - a).forEach(index => {
+          const beforeComma = params.slice(0, index + 1);
+          const afterComma = params.slice(index + 1);
+          if (expectation.indexOf("always") === 0) {
+            if (/^\s*\r?\n/.test(afterComma)) {
+              params = beforeComma + afterComma.replace(/^[^\S\r\n]*/, "");
+            } else {
+              params = beforeComma + context.newline + afterComma;
+            }
+          } else if (expectation.indexOf("never") === 0) {
+            params = beforeComma + afterComma.replace(/^\s*/, "");
+          }
+        });
+        if (atRule.raws.params) {
+          atRule.raws.params.raw = params;
+        } else {
+          atRule.params = params;
+        }
+      });
+    }
   };
 };