From 340da36bc7d5b4ef7c4fec044a34cf8cd74f689b Mon Sep 17 00:00:00 2001
From: Roman Dvornov <rdvornov@gmail.com>
Date: Thu, 12 Jan 2017 14:56:33 +0300
Subject: [PATCH] make unused styles removal safe

- avoid using usage data when document contains <script> or on*
attributes
- implemented usage.force option to force usage data using
---
 plugins/minifyStyles.js          | 25 +++++++++++++++++++------
 test/plugins/minifyStyles.07.svg | 26 ++++++++++++++++++++++++++
 test/plugins/minifyStyles.08.svg | 20 ++++++++++++++++++++
 test/plugins/minifyStyles.09.svg | 29 +++++++++++++++++++++++++++++
 4 files changed, 94 insertions(+), 6 deletions(-)
 create mode 100644 test/plugins/minifyStyles.07.svg
 create mode 100644 test/plugins/minifyStyles.08.svg
 create mode 100644 test/plugins/minifyStyles.09.svg

diff --git a/plugins/minifyStyles.js b/plugins/minifyStyles.js
index 9b5f4a25..d240900e 100755
--- a/plugins/minifyStyles.js
+++ b/plugins/minifyStyles.js
@@ -8,10 +8,10 @@ exports.description = 'minifies styles and removes unused styles based on usage
 
 exports.params = {
     // ... CSSO options goes here
-    svgo: {},
 
     // additional 
     usage: {
+        force: false,  // force to use usage data even if it unsafe (document contains <script> or on* attributes)
         ids: true,
         classes: true,
         tags: true
@@ -110,6 +110,10 @@ function collectUsageData(ast, options) {
                 walk(item, usageData);
             }
 
+            if (item.isElem('script')) {
+                safe = false;
+            }
+
             if (item.isElem()) {
                 usageData.tags[item.elem] = true;
 
@@ -122,26 +126,35 @@ function collectUsageData(ast, options) {
                         usageData.classes[className] = true;
                     });
                 }
+
+                if (item.attrs && Object.keys(item.attrs).some(function(name) { return /^on/i.test(name); })) {
+                    safe = false;
+                }
             }
         }
 
         return usageData;
     }
 
+    var safe = true;
+    var usageData = {};
     var hasData = false;
-    var usageData = walk(ast, {
+    var rawData = walk(ast, {
         ids: Object.create(null),
         classes: Object.create(null),
         tags: Object.create(null)
     });
 
-    for (var key in usageData) {
-        usageData[key] = shouldFilter(options, key) && Object.keys(usageData[key]);
+    if (!safe && options.usage && options.usage.force) {
+        safe = true;
+    }
 
-        if (usageData[key]) {
+    for (var key in rawData) {
+        if (shouldFilter(options, key)) {
+            usageData[key] = Object.keys(rawData[key]);
             hasData = true;
         }
     }
 
-    return hasData ? usageData : null;
+    return safe && hasData ? usageData : null;
 }
diff --git a/test/plugins/minifyStyles.07.svg b/test/plugins/minifyStyles.07.svg
new file mode 100644
index 00000000..5d2d7a9c
--- /dev/null
+++ b/test/plugins/minifyStyles.07.svg
@@ -0,0 +1,26 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+    <style>
+        .used { p: 1 }
+        .unused { p: 2 }
+    </style>
+    <script>
+        /* script element prevents removing unused styles */
+    </script>
+    <g class="used">
+        test
+    </g>
+</svg>
+
+@@@
+
+<svg xmlns="http://www.w3.org/2000/svg">
+    <style>
+        .used{p:1}.unused{p:2}
+    </style>
+    <script>
+        /* script element prevents removing unused styles */
+    </script>
+    <g class="used">
+        test
+    </g>
+</svg>
diff --git a/test/plugins/minifyStyles.08.svg b/test/plugins/minifyStyles.08.svg
new file mode 100644
index 00000000..d0f6e030
--- /dev/null
+++ b/test/plugins/minifyStyles.08.svg
@@ -0,0 +1,20 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+    <style>
+        .used { p: 1 }
+        .unused { p: 2 }
+    </style>
+    <g class="used" onclick="/* on* attributes prevents removing unused styles */">
+        test
+    </g>
+</svg>
+
+@@@
+
+<svg xmlns="http://www.w3.org/2000/svg">
+    <style>
+        .used{p:1}.unused{p:2}
+    </style>
+    <g class="used" onclick="/* on* attributes prevents removing unused styles */">
+        test
+    </g>
+</svg>
diff --git a/test/plugins/minifyStyles.09.svg b/test/plugins/minifyStyles.09.svg
new file mode 100644
index 00000000..49e4b65b
--- /dev/null
+++ b/test/plugins/minifyStyles.09.svg
@@ -0,0 +1,29 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+    <style>
+        .used { p: 1 }
+        .unused { p: 2 }
+    </style>
+    <script>
+        /* with usage.force=true script element does not prevent removing unused styles */
+    </script>
+    <g class="used" onclick="/* with usage.force=true on* attributes doesn't prevent removing unused styles */">
+        test
+    </g>
+</svg>
+
+@@@
+
+<svg xmlns="http://www.w3.org/2000/svg">
+    <style>
+        .used{p:1}
+    </style>
+    <script>
+        /* with usage.force=true script element does not prevent removing unused styles */
+    </script>
+    <g class="used" onclick="/* with usage.force=true on* attributes doesn't prevent removing unused styles */">
+        test
+    </g>
+</svg>
+
+@@@
+{ "usage": { "force": true } }
\ No newline at end of file