Enable fix option for font-weight-notation

stylelint · Jul 7, 2018 · 91372ca · 91372ca
1 parent 17028f9
commit 91372ca
Show file tree

Hide file tree

Showing 3 changed files with 60 additions and 4 deletions.
diff --git a/docs/user-guide/rules.md b/docs/user-guide/rules.md
@@ -210,7 +210,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
@@ -6,6 +6,7 @@ const { messages, ruleName } = rule;
 testRule(rule, {
   ruleName,
   config: ["numeric"],
+  fixed: true,
 
   accept: [
     {
@@ -89,30 +90,35 @@ testRule(rule, {
   reject: [
     {
       code: "a { font-weight: normal; }",
+      fixed: "a { font-weight: 400; }",
       message: messages.expected("numeric"),
       line: 1,
       column: 18
     },
     {
       code: "a { fOnT-wEiGhT: normal; }",
+      fixed: "a { fOnT-wEiGhT: 400; }",
       message: messages.expected("numeric"),
       line: 1,
       column: 18
     },
     {
       code: "a { FONT-WEIGHT: normal; }",
+      fixed: "a { FONT-WEIGHT: 400; }",
       message: messages.expected("numeric"),
       line: 1,
       column: 18
     },
     {
       code: "a { font-weight: nOrMaL; }",
+      fixed: "a { font-weight: 400; }",
       message: messages.expected("numeric"),
       line: 1,
       column: 18
     },
     {
       code: "a { font-weight: NORMAL; }",
+      fixed: "a { font-weight: 400; }",
       message: messages.expected("numeric"),
       line: 1,
       column: 18
@@ -150,6 +156,7 @@ testRule(rule, {
 testRule(rule, {
   ruleName,
   config: ["numeric", { ignore: ["relative"] }],
+  fixed: true,
 
   accept: [
     {
@@ -175,6 +182,7 @@ testRule(rule, {
   reject: [
     {
       code: "a { font-weight: normal; }",
+      fixed: "a { font-weight: 400}",
       message: messages.expected("numeric"),
       line: 1,
       column: 18
@@ -185,6 +193,7 @@ testRule(rule, {
 testRule(rule, {
   ruleName,
   config: ["named-where-possible"],
+  fixed: true,
 
   accept: [
     {
@@ -263,6 +272,7 @@ testRule(rule, {
   reject: [
     {
       code: "a { font-weight: 400; }",
+      fixed: "a { font-weight: normal; }",
       message: messages.expected("named"),
       line: 1,
       column: 18
@@ -276,6 +286,7 @@ testRule(rule, {
     },
     {
       code: "a { font: italic small-caps 700 16px/3 cursive; }",
+      fixed: "a { font: italic small-caps bold 16px/3 cursive; }",
       message: messages.expected("named"),
       line: 1,
       column: 29

diff --git a/lib/rules/font-weight-notation/index.js b/lib/rules/font-weight-notation/index.js
@@ -10,6 +10,7 @@ const optionsMatches = require("../../utils/optionsMatches");
 const postcss = require("postcss");
 const report = require("../../utils/report");
 const ruleMessages = require("../../utils/ruleMessages");
+const styleSearch = require("style-search");
 const validateOptions = require("../../utils/validateOptions");
 
 const ruleName = "font-weight-notation";
@@ -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}`);
+  });
+}
+
 rule.ruleName = ruleName;
 rule.messages = messages;
 module.exports = rule;