Handle interpolations

stylelint-scss · Sep 7, 2021 · aefec72 · aefec72
1 parent 7c0f68c
commit aefec72
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 3 deletions.
diff --git a/src/rules/no-global-function-names/__tests__/index.js b/src/rules/no-global-function-names/__tests__/index.js
@@ -432,6 +432,17 @@ testRule(rule, {
       column: 14,
       message: messages.rejected("map-values"),
       description: "map-values"
+    },
+    {
+      code: `
+      a {
+        background: #{change-color(#6b717f, $red: 15)};
+      }
+    `,
+      line: 3,
+      column: 21,
+      message: messages.rejected("change-color"),
+      description: "change-color"
     }
   ]
 });
diff --git a/src/rules/no-global-function-names/index.js b/src/rules/no-global-function-names/index.js
@@ -2,6 +2,8 @@ import valueParser from "postcss-value-parser";
 import { utils } from "stylelint";
 import { declarationValueIndex, namespace } from "../../utils";
 
+const interpolationPrefix = /^#{\s*/;
+
 const rules = {
   red: "color",
   blue: "color",
@@ -126,14 +128,16 @@ export default function(value) {
 
     root.walkDecls(decl => {
       valueParser(decl.value).walk(node => {
+        const cleanValue = node.value.replace(interpolationPrefix, "");
+
         // Verify that we're only looking at functions.
-        if (node.type !== "function" || node.value === "") {
+        if (node.type !== "function" || cleanValue === "") {
           return;
         }
 
-        if (Object.keys(rules).includes(node.value)) {
+        if (Object.keys(rules).includes(cleanValue)) {
           utils.report({
-            message: messages.rejected(node.value),
+            message: messages.rejected(cleanValue),
             node: decl,
             index: declarationValueIndex(decl) + node.sourceIndex,
             result,