fix: Fix interaction with other plugins (#647)

* test: Add (failing) test for working with other plugins * fix: PurgeCSS must run on exit to work with other plugins Otherwise it tries to understand selectors before they have been processed by other plugins. For example, when using both postcss-nested and purgecss * chore: cleanup
FullHuman · Apr 12, 2021 · fb08e3a · fb08e3a
1 parent 89ece42
commit fb08e3a
Show file tree

Hide file tree

Showing 5 changed files with 50 additions and 1 deletion.
diff --git a/packages/postcss-purgecss/__tests__/fixtures/expected/other-plugins.css b/packages/postcss-purgecss/__tests__/fixtures/expected/other-plugins.css
@@ -0,0 +1,3 @@
+.prefixed-used-class {
+  color: black;
+}
diff --git a/packages/postcss-purgecss/__tests__/fixtures/src/other-plugins/other-plugins.css b/packages/postcss-purgecss/__tests__/fixtures/src/other-plugins/other-plugins.css
@@ -0,0 +1,11 @@
+.used-class {
+  color: black;
+}
+
+.unused-class {
+  color: black;
+}
+
+.another-one-not-found {
+  color: black;
+}
diff --git a/packages/postcss-purgecss/__tests__/fixtures/src/other-plugins/other-plugins.html b/packages/postcss-purgecss/__tests__/fixtures/src/other-plugins/other-plugins.html
@@ -0,0 +1,8 @@
+<html>
+
+  <body>
+
+    <div class="prefixed-used-class"></div>
+  </body>
+
+</html>
diff --git a/packages/postcss-purgecss/__tests__/index.test.ts b/packages/postcss-purgecss/__tests__/index.test.ts
@@ -82,4 +82,31 @@ describe("Purgecss postcss plugin", () => {
         done();
       });
   });
+
+  it(`lets other plugins transform selectors before purging`, async () => {
+    const input = fs
+      .readFileSync(`${__dirname}/fixtures/src/other-plugins/other-plugins.css`)
+      .toString();
+    const expected = fs
+      .readFileSync(`${__dirname}/fixtures/expected/other-plugins.css`)
+      .toString();
+    const result = await postcss([
+      {
+        postcssPlugin: "postcss-test-prefixer",
+        Rule(rule) {
+          if (rule.selector.startsWith(".")) {
+            rule.selector = ".prefixed-" + rule.selector.slice(1);
+          }
+        },
+      },
+      purgeCSSPlugin({
+        content: [`${__dirname}/fixtures/src/other-plugins/other-plugins.html`],
+        fontFace: true,
+        keyframes: true,
+      }),
+    ]).process(input, { from: undefined });
+
+    expect(result.css).toBe(expected);
+    expect(result.warnings().length).toBe(0);
+  });
 });
diff --git a/packages/postcss-purgecss/src/index.ts b/packages/postcss-purgecss/src/index.ts
@@ -77,7 +77,7 @@ const purgeCSSPlugin: postcss.PluginCreator<UserDefinedOptions> = function (
     throw new Error("PurgeCSS plugin does not have the correct options");
   return {
     postcssPlugin: PLUGIN_NAME,
-    Once(root, helpers) {
+    OnceExit(root, helpers) {
       return purgeCSS(opts, root, helpers);
     },
   };