proxy purge.safelist to purge.options.safelist works

This allows us to have a similar API in `AOT` and `JIT` mode.
tailwindlabs · Jun 8, 2021 · 425a939 · 425a939
1 parent 85c8201
commit 425a939
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 0 deletions.
diff --git a/src/lib/purgeUnusedStyles.js b/src/lib/purgeUnusedStyles.js
@@ -81,6 +81,13 @@ export default function purgeUnusedUtilities(
   const transformers = config.purge.transform || {}
   let { defaultExtractor: originalDefaultExtractor, ...purgeOptions } = config.purge.options || {}
 
+  if (config.purge?.safelist) {
+    purgeOptions.safelist = []
+      .concat(config.purge.safelist)
+      .concat(purgeOptions.safelist)
+      .filter(Boolean)
+  }
+
   if (!originalDefaultExtractor) {
     originalDefaultExtractor =
       typeof extractors === 'function' ? extractors : extractors.DEFAULT || tailwindExtractor

diff --git a/tests/purgeUnusedStyles.test.js b/tests/purgeUnusedStyles.test.js
@@ -579,6 +579,32 @@ test(
   })
 )
 
+test(
+  'proxying purge.safelist to purge.options.safelist works',
+  suppressConsoleLogs(() => {
+    const inputPath = path.resolve(`${__dirname}/fixtures/tailwind-input.css`)
+    const input = fs.readFileSync(inputPath, 'utf8')
+
+    return postcss([
+      tailwind({
+        ...config,
+        purge: {
+          enabled: true,
+          safelist: ['md:bg-green-500'],
+          options: {
+            content: [path.resolve(`${__dirname}/fixtures/**/*.html`)],
+          },
+        },
+      }),
+    ])
+      .process(input, { from: withTestName(inputPath) })
+      .then((result) => {
+        expect(result.css).toContain('.md\\:bg-green-500')
+        assertPurged(result)
+      })
+  })
+)
+
 test(
   'can purge all CSS, not just Tailwind classes',
   suppressConsoleLogs(() => {