refactor: logic

Author: alexander-akait

src/index.js

@@ -9,7 +9,12 @@ const IGNORE_MARKER = "cssmodules-pure-ignore";
 const isSpacing = (node) => node.type === "combinator" && node.value === " ";
 
 function getIgnoreComment(node) {
-  const indexInParent = node.parent ? node.parent.index(node) : -1;
+  if (!node.parent) {
+    return;
+  }
+
+  const indexInParent = node.parent.index(node);
+
   for (let i = indexInParent - 1; i >= 0; i--) {
     const prevNode = node.parent.nodes[i];
     if (prevNode.type === "comment") {
@@ -529,7 +534,6 @@ module.exports = (options = {}) => {
           });
 
           root.walkAtRules((atRule) => {
-            const ignoreComment = getIgnoreComment(atRule);
             if (/keyframes$/i.test(atRule.name)) {
               const globalMatch = /^\s*:global\s*\((.+)\)\s*$/.exec(
                 atRule.params
@@ -541,11 +545,18 @@ module.exports = (options = {}) => {
               let globalKeyframes = globalMode;
 
               if (globalMatch) {
-                if (pureMode && !ignoreComment) {
-                  throw atRule.error(
-                    "@keyframes :global(...) is not allowed in pure mode"
-                  );
+                if (pureMode) {
+                  const ignoreComment = getIgnoreComment(atRule);
+
+                  if (!ignoreComment) {
+                    throw atRule.error(
+                      "@keyframes :global(...) is not allowed in pure mode"
+                    );
+                  } else {
+                    ignoreComment.remove();
+                  }
                 }
+
                 atRule.params = globalMatch[1];
                 globalKeyframes = true;
               } else if (localMatch) {
@@ -568,6 +579,14 @@ module.exports = (options = {}) => {
               });
             } else if (/scope$/i.test(atRule.name)) {
               if (atRule.params) {
+                const ignoreComment = pureMode
+                  ? getIgnoreComment(atRule)
+                  : undefined;
+
+                if (ignoreComment) {
+                  ignoreComment.remove();
+                }
+
                 atRule.params = atRule.params
                   .split("to")
                   .map((item) => {
@@ -581,7 +600,7 @@ module.exports = (options = {}) => {
                     context.options = options;
                     context.localAliasMap = localAliasMap;
 
-                    if (pureMode && context.hasPureGlobals && ignoreComment) {
+                    if (pureMode && context.hasPureGlobals && !ignoreComment) {
                       throw atRule.error(
                         'Selector in at-rule"' +
                           selector +
@@ -615,14 +634,9 @@ module.exports = (options = {}) => {
                 }
               });
             }
-
-            if (ignoreComment) {
-              ignoreComment.remove();
-            }
           });
 
           root.walkRules((rule) => {
-            const ignoreComment = getIgnoreComment(rule);
             if (
               rule.parent &&
               rule.parent.type === "atrule" &&
@@ -637,13 +651,17 @@ module.exports = (options = {}) => {
             context.options = options;
             context.localAliasMap = localAliasMap;
 
+            const ignoreComment = pureMode ? getIgnoreComment(rule) : undefined;
+
             if (pureMode && context.hasPureGlobals && !ignoreComment) {
               throw rule.error(
                 'Selector "' +
                   rule.selector +
                   '" is not pure ' +
                   "(pure selectors must contain at least one local class or id)"
               );
+            } else if (ignoreComment) {
+              ignoreComment.remove();
             }
 
             rule.selector = context.selector;
@@ -654,10 +672,6 @@ module.exports = (options = {}) => {
                 localizeDeclaration(declaration, context)
               );
             }
-
-            if (ignoreComment) {
-              ignoreComment.remove();
-            }
           });
         },
       };

test/index.test.js

@@ -960,6 +960,57 @@ const tests = [
     expected: `/* another comment */
             .foo { color: blue; }`,
   },
+  {
+    name: "should suppress errors for global selectors after ignore comment #3",
+    options: { mode: "pure" },
+    input: `/* another comment */
+            /* cssmodules-pure-ignore */
+            :global(.foo) { color: blue; }`,
+    expected: `/* another comment */
+            .foo { color: blue; }`,
+  },
+  {
+    name: "should suppress errors for global selectors after ignore comment #4",
+    options: { mode: "pure" },
+    input: `/* cssmodules-pure-ignore */ /* another comment */
+            :global(.foo) { color: blue; }`,
+    expected: `/* another comment */
+            .foo { color: blue; }`,
+  },
+  {
+    name: "should suppress errors for global selectors after ignore comment #5",
+    options: { mode: "pure" },
+    input: `/* another comment */ /* cssmodules-pure-ignore */
+            :global(.foo) { color: blue; }`,
+    expected: `/* another comment */
+            .foo { color: blue; }`,
+  },
+  {
+    name: "should suppress errors for global selectors after ignore comment #6",
+    options: { mode: "pure" },
+    input: `.foo { /* cssmodules-pure-ignore */ :global(.bar) { color: blue }; }`,
+    expected: `:local(.foo) { .bar { color: blue }; }`,
+  },
+  {
+    name: "should suppress errors for global selectors after ignore comment #7",
+    options: { mode: "pure" },
+    input: `/* cssmodules-pure-ignore */ :global(.foo) { /* cssmodules-pure-ignore */ :global(.bar) { color: blue } }`,
+    expected: `.foo { .bar { color: blue } }`,
+  },
+  {
+    name: "should suppress errors for global selectors after ignore comment #8",
+    options: { mode: "pure" },
+    input: `/*     cssmodules-pure-ignore     */ :global(.foo) { color: blue; }`,
+    expected: `.foo { color: blue; }`,
+  },
+  {
+    name: "should suppress errors for global selectors after ignore comment #9",
+    options: { mode: "pure" },
+    input: `/*
+    cssmodules-pure-ignore
+    */ :global(.foo) { color: blue; }`,
+    expected: `.foo { color: blue; }`,
+  },
   {
     name: "should allow additional text in ignore comment",
     options: { mode: "pure" },
@@ -1020,6 +1071,45 @@ const tests = [
               to { opacity: 0; }
             }`,
   },
+  {
+    name: "should work with scope in ignored block",
+    options: { mode: "pure" },
+    input: `
+/* cssmodules-pure-ignore */
+@scope (:global(.foo)) to (:global(.bar)) {
+  .article-footer {
+    border: 5px solid black;
+  }
+}
+`,
+    expected: `
+@scope (.foo) to (.bar) {
+  :local(.article-footer) {
+    border: 5px solid black;
+  }
+}
+`,
+  },
+  {
+    name: "should work with scope in ignored block #2",
+    options: { mode: "pure" },
+    input: `
+/* cssmodules-pure-ignore */
+@scope (:global(.foo))
+ to (:global(.bar)) {
+  .article-footer {
+    border: 5px solid black;
+  }
+}
+`,
+    expected: `
+@scope (.foo) to (.bar) {
+  :local(.article-footer) {
+    border: 5px solid black;
+  }
+}
+`,
+  },
   {
     name: "should work in media queries",
     options: { mode: "pure" },