Enable fix option for font-weight-notation

stylelint · Feb 7, 2018 · 77c8cca · 77c8cca
1 parent 8a6d344
commit 77c8cca
Show file tree

Hide file tree

Showing 3 changed files with 136 additions and 4 deletions.
diff --git a/docs/user-guide/rules.md b/docs/user-guide/rules.md
@@ -204,7 +204,7 @@ Here are all the rules within stylelint, grouped first [by category](../../VISIO
 
 #### Font weight
 
--   [`font-weight-notation`](../../lib/rules/font-weight-notation/README.md): Require numeric or named (where possible) `font-weight` values.
+-   [`font-weight-notation`](../../lib/rules/font-weight-notation/README.md): Require numeric or named (where possible) `font-weight` values (Autofixable).
 
 #### Function
 

diff --git a/lib/rules/font-weight-notation/__tests__/index.js b/lib/rules/font-weight-notation/__tests__/index.js
@@ -323,3 +323,90 @@ testRule(rule, {
     }
   ]
 });
+
+testRule(rule, {
+  ruleName,
+  config: ["numeric"],
+  fix: true,
+  accept: [
+    {
+      code: "a { font-weight: 400; }"
+    },
+    {
+      code: "a { font-weight: 700; }"
+    },
+    {
+      code: "a { font-weight: 800; }"
+    },
+    {
+      code: "a { font: italic 400 20px; }"
+    },
+    {
+      code: "a { font: italic var(--bold) 20px; }"
+    }
+  ],
+  reject: [
+    {
+      code: "a { font-weight: normal; }",
+      fixed: "a { font-weight: 400; }",
+      message: messages.expected("numeric")
+    },
+    {
+      code: "a { font-weight: bold; }",
+      fixed: "a { font-weight: 700; }",
+      message: messages.expected("numeric")
+    },
+    {
+      code: "a { font: italic normal 20px; }",
+      fixed: "a { font: italic 400 20px; }",
+      message: messages.expected("numeric")
+    },
+    {
+      code: "a { font: italic bold 20px; }",
+      fixed: "a { font: italic 700 20px; }",
+      message: messages.expected("numeric")
+    }
+  ]
+});
+
+testRule(rule, {
+  ruleName,
+  config: ["named-where-possible"],
+  fix: true,
+  accept: [
+    {
+      code: "a { font-weight: normal; }"
+    },
+    {
+      code: "a { font-weight: bold; }"
+    },
+    {
+      code: "a { font: italic bold 20px; }"
+    },
+    {
+      code: "a { font: italic var(--700) 20px; }"
+    }
+  ],
+  reject: [
+    {
+      code: "a { font-weight: 400; }",
+      fixed: "a { font-weight: normal; }",
+      message: messages.expected("named")
+    },
+    {
+      code: "a { font-weight: 700; }",
+      fixed: "a { font-weight: bold; }",
+      message: messages.expected("named")
+    },
+    {
+      code: "a { font: italic 400 20px; }",
+      fixed: "a { font: italic normal 20px; }",
+      message: messages.expected("named")
+    },
+    {
+      code: "a { font: italic 700 20px; }",
+      fixed: "a { font: italic bold 20px; }",
+      message: messages.expected("named")
+    }
+  ]
+});
diff --git a/lib/rules/font-weight-notation/index.js b/lib/rules/font-weight-notation/index.js
@@ -1,6 +1,7 @@
 "use strict";
 
 const _ = require("lodash");
+const styleSearch = require("style-search");
 const declarationValueIndex = require("../../utils/declarationValueIndex");
 const isNumbery = require("../../utils/isNumbery");
 const isStandardSyntaxValue = require("../../utils/isStandardSyntaxValue");
@@ -24,7 +25,7 @@ const INITIAL_KEYWORD = "initial";
 const NORMAL_KEYWORD = "normal";
 const WEIGHTS_WITH_KEYWORD_EQUIVALENTS = ["400", "700"];
 
-const rule = function(expectation, options) {
+const rule = function(expectation, options, context) {
   return (root, result) => {
     const validOptions = validateOptions(
       result,
@@ -46,13 +47,42 @@ const rule = function(expectation, options) {
     }
 
     root.walkDecls(decl => {
-      if (decl.prop.toLowerCase() === "font-weight") {
+      const propName = decl.prop.toLowerCase();
+
+      if (propName === "font-weight") {
         checkWeight(decl.value, decl);
       }
 
-      if (decl.prop.toLowerCase() === "font") {
+      if (propName === "font") {
         checkFont(decl);
       }
+
+      if (context.fix) {
+        // delete property name
+        const declString = decl
+          .toString()
+          .replace(`${propName}:`, "")
+          .trim();
+
+        if (expectation === "named-where-possible") {
+          replaceWord(declString, "400", "normal", output => {
+            decl.value = output;
+          });
+
+          replaceWord(declString, "700", "bold", output => {
+            decl.value = output;
+          });
+        }
+        if (expectation === "numeric") {
+          replaceWord(declString, "normal", "400", output => {
+            decl.value = output;
+          });
+
+          replaceWord(declString, "bold", "700", output => {
+            decl.value = output;
+          });
+        }
+      }
     });
 
     function checkFont(decl) {
@@ -133,6 +163,21 @@ const rule = function(expectation, options) {
   };
 };
 
+function replaceWord(input, searchString, replaceString, cb) {
+  styleSearch({ source: input, target: searchString }, match => {
+    if (match.insideParens || match.insideFunctionArguments) {
+      // e.g. var(--bold)
+      return cb(input);
+    }
+
+    const offset = match.startIndex;
+    const stringStart = input.slice(0, offset);
+    const stringEnd = input.slice(offset + searchString.length);
+
+    cb(`${stringStart}${replaceString}${stringEnd}`.trim());
+  });
+}
+
 rule.ruleName = ruleName;
 rule.messages = messages;
 module.exports = rule;