Merge pull request #58 from cmizzi/master

Allows preserving children from whitelistPatterns
FullHuman · Mar 20, 2018 · f25921e · f25921e
2 parents be5ac0f + 772eccf
commit f25921e
Show file tree

Hide file tree

Showing 8 changed files with 92 additions and 3 deletions.
diff --git a/__tests__/purgecss.test.js b/__tests__/purgecss.test.js
@@ -701,3 +701,43 @@ describe('purge methods with files and legacy extractor', () => {
         })
     })
 })
+
+describe('whitelistPatternsChildren', () => {
+    let purgecssResult
+    beforeAll(() => {
+        purgecssResult = new Purgecss({
+            content: [`${root}whitelist_patterns_children/whitelist_patterns_children.html`],
+            css: [`${root}whitelist_patterns_children/whitelist_patterns_children.css`],
+            legacy: false,
+            whitelistPatternsChildren: [/^card$/]
+        }).purge()[0].css
+    })
+
+    it('finds card class', () => {
+        expect(purgecssResult.includes('.card')).toBe(true)
+    })
+
+    it('finds card--title', () => {
+        expect(purgecssResult.includes('.title')).toBe(false)
+    })
+
+    it('finds card--content', () => {
+        expect(purgecssResult.includes('.card .content')).toBe(true)
+    })
+
+    it('finds btn', () => {
+        expect(purgecssResult.includes('.btn')).toBe(true)
+    })
+
+    it('finds btn yellow', () => {
+        expect(purgecssResult.includes('.card .btn .yellow')).toBe(true)
+    })
+
+    it('finds btn red', () => {
+        expect(purgecssResult.includes('.btn .red')).toBe(false)
+    })
+
+    it('excludes btn--green', () => {
+        expect(purgecssResult.includes('.btn__green')).toBe(false)
+    })
+})
diff --git a/__tests__/test_examples/whitelist_patterns_children/whitelist_patterns_children.css b/__tests__/test_examples/whitelist_patterns_children/whitelist_patterns_children.css
@@ -0,0 +1,9 @@
+.card {}
+.title {}
+.card .content {}
+
+.btn {}
+.btn .red {}
+.btngreen {}
+
+.card .btn .yellow {}
diff --git a/__tests__/test_examples/whitelist_patterns_children/whitelist_patterns_children.html b/__tests__/test_examples/whitelist_patterns_children/whitelist_patterns_children.html
@@ -0,0 +1,10 @@
+<html>
+	<body>
+		<div class="card">
+			<div class="card--title"></div>
+			<div class="card--content">
+				<div class="btn"></div>
+			</div>
+		</div>
+	</body>
+</html>
diff --git a/flow-typed/index.js b/flow-typed/index.js
@@ -11,6 +11,7 @@ declare type Options = {
   extractors?: Array<ExtractorsObj>,
   whitelist?: Array<string>,
   whitelistPatterns?: Array<RegExp>,
+  whitelistPatternsChildren?: Array<RegExp>,
   output?: string,
   stdout?: boolean,
   stdin?: boolean,

diff --git a/lib/purgecss.d.ts b/lib/purgecss.d.ts
@@ -40,6 +40,7 @@ declare namespace Purgecss {
     extractors?: Array<ExtractorsObj>
     whitelist?: Array<string>
     whitelistPatterns?: Array<RegExp>
+    whitelistPatternsChildren?: Array<RegExp>
     output?: string
     stdout?: boolean
     stdin?: boolean

diff --git a/lib/purgecss.es.js b/lib/purgecss.es.js
diff --git a/lib/purgecss.js b/lib/purgecss.js
diff --git a/src/index.js b/src/index.js
@@ -392,6 +392,11 @@ class Purgecss {
                 const sels = selector.split(/[^a-z]/g)
                 let keepSelector = false
                 for (let sel of sels) {
+                    if (this.isSelectorWhitelistedChildren(sel)) {
+                        keepSelector = true
+                        break
+                    }
+
                     if (!sel) continue
                     if (!selectorsInContent.has(sel)) break
                     keepSelector = true
@@ -407,7 +412,17 @@ class Purgecss {
                 // non legacy extractors
                 // pseudo class
                 const unescapedSelector = selector.replace(/\\/g, '')
-                if (unescapedSelector.startsWith(':')) continue
+
+                if (unescapedSelector.startsWith(':')) {
+                    continue
+                }
+
+                // If the selector is whitelisted with children keep, simply
+                // returns true to keep all children selectors
+                if (this.isSelectorWhitelistedChildren(unescapedSelector)) {
+                    return true
+                }
+
                 if (
                     !(
                         selectorsInContent.has(unescapedSelector) ||
@@ -435,6 +450,19 @@ class Purgecss {
                 this.options.whitelistPatterns.some((v: RegExp) => v.test(selector)))
         )
     }
+
+    /**
+     * Check if the selector is whitelisted by the whitelistPatternsChildren
+     * options element
+     *
+     * @param {string} selector
+     */
+    isSelectorWhitelistedChildren(selector: string): boolean {
+        return !!(
+            this.options.whitelistPatternsChildren &&
+            this.options.whitelistPatternsChildren.some((v: RegExp) => v.test(selector))
+        )
+    }
 }
 
 export default Purgecss