From bf0ba2879929e20fc1ed508df15ae06efb2d9cc3 Mon Sep 17 00:00:00 2001
From: Jesse Pearson <jesse.pearson@totalexpertinc.com>
Date: Fri, 24 Apr 2020 02:46:51 -0500
Subject: [PATCH 1/2] Fix issue with common "{{ }}" template syntax in a CSS
 rule

---
 css.js                   |  6 +++---
 css.min.js               |  4 ++--
 tests/cssParsing.test.js | 38 +++++++++++++++++++++++++++++++++++---
 tests/data.js            | 40 ++++++++++++++++++++++++++++++++++++----
 4 files changed, 76 insertions(+), 12 deletions(-)

diff --git a/css.js b/css.js
index f3061b3..1e564fc 100644
--- a/css.js
+++ b/css.js
@@ -10,15 +10,15 @@
     this.cssRegex = new RegExp('([\\s\\S]*?){([\\s\\S]*?)}', 'gi');
     this.cssMediaQueryRegex = '((@media [\\s\\S]*?){([\\s\\S]*?}\\s*?)})';
     this.cssKeyframeRegex = '((@.*?keyframes [\\s\\S]*?){([\\s\\S]*?}\\s*?)})';
-    this.combinedCSSRegex = '((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]*?){([\\s\\S]*?)}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)})'; //to match css & media queries together
+    this.combinedCSSRegex = '((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]*?){([\\s\\S]*?)(?!.*}})}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)(?![\\s\\S]?}})[\\s\\S]})'; // to match css & media queries together
     this.cssCommentsRegex = '(\\/\\*[\\s\\S]*?\\*\\/)';
     this.cssImportStatementRegex = new RegExp('@import .*?;', 'gi');
   };
 
   /*
-    Strip outs css comments and returns cleaned css string
+    Strips out css comments and returns cleaned css string
 
-    @param css, the original css string to be stipped out of comments
+    @param css, the original css string to be stripped out of comments
 
     @return cleanedCSS contains no css comments
   */
diff --git a/css.min.js b/css.min.js
index 5fece1e..67707bd 100644
--- a/css.min.js
+++ b/css.min.js
@@ -1,3 +1,3 @@
-/*! css.js 27-02-2018 */
+/*! jotform-css.js 24-04-2020 */
 
-!function(e){"use strict";var t=function(){this.cssImportStatements=[],this.cssKeyframeStatements=[],this.cssRegex=new RegExp("([\\s\\S]*?){([\\s\\S]*?)}","gi"),this.cssMediaQueryRegex="((@media [\\s\\S]*?){([\\s\\S]*?}\\s*?)})",this.cssKeyframeRegex="((@.*?keyframes [\\s\\S]*?){([\\s\\S]*?}\\s*?)})",this.combinedCSSRegex="((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]*?){([\\s\\S]*?)}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)})",this.cssCommentsRegex="(\\/\\*[\\s\\S]*?\\*\\/)",this.cssImportStatementRegex=new RegExp("@import .*?;","gi")};t.prototype.stripComments=function(e){var t=new RegExp(this.cssCommentsRegex,"gi");return e.replace(t,"")},t.prototype.parseCSS=function(e){if(void 0===e)return[];for(var t=[];;){var s=this.cssImportStatementRegex.exec(e);if(null===s)break;this.cssImportStatements.push(s[0]),t.push({selector:"@imports",type:"imports",styles:s[0]})}e=e.replace(this.cssImportStatementRegex,"");for(var r,i=new RegExp(this.cssKeyframeRegex,"gi");null!==(r=i.exec(e));)t.push({selector:"@keyframes",type:"keyframes",styles:r[0]});e=e.replace(i,"");for(var n=new RegExp(this.combinedCSSRegex,"gi");null!==(r=n.exec(e));){var o="";o=void 0===r[2]?r[5].split("\r\n").join("\n").trim():r[2].split("\r\n").join("\n").trim();var l=new RegExp(this.cssCommentsRegex,"gi"),p=l.exec(o);if(null!==p&&(o=o.replace(l,"").trim()),-1!==(o=o.replace(/\n+/,"\n")).indexOf("@media")){var a={selector:o,type:"media",subStyles:this.parseCSS(r[3]+"\n}")};null!==p&&(a.comments=p[0]),t.push(a)}else{var c={selector:o,rules:this.parseRules(r[6])};"@font-face"===o&&(c.type="font-face"),null!==p&&(c.comments=p[0]),t.push(c)}}return t},t.prototype.parseRules=function(e){var t=[];e=(e=e.split("\r\n").join("\n")).split(";");for(var s=0;s<e.length;s++){var r=e[s];if(-1!==(r=r.trim()).indexOf(":")){var i=(r=r.split(":"))[0].trim(),n=r.slice(1).join(":").trim();if(i.length<1||n.length<1)continue;t.push({directive:i,value:n})}else"base64,"===r.trim().substr(0,7)?t[t.length-1].value+=r.trim():r.length>0&&t.push({directive:"",value:r,defective:!0})}return t},t.prototype.findCorrespondingRule=function(e,t,s){void 0===s&&(s=!1);for(var r=!1,i=0;i<e.length&&(e[i].directive!==t||(r=e[i],s!==e[i].value));i++);return r},t.prototype.findBySelector=function(e,t,s){void 0===s&&(s=!1);for(var r=[],i=0;i<e.length;i++)!1===s?e[i].selector===t&&r.push(e[i]):-1!==e[i].selector.indexOf(t)&&r.push(e[i]);if("@imports"===t||r.length<2)return r;var n=r[0];for(i=1;i<r.length;i++)this.intelligentCSSPush([n],r[i]);return[n]},t.prototype.deleteBySelector=function(e,t){for(var s=[],r=0;r<e.length;r++)e[r].selector!==t&&s.push(e[r]);return s},t.prototype.compressCSS=function(e){for(var t=[],s={},r=0;r<e.length;r++){var i=e[r];if(!0!==s[i.selector]){var n=this.findBySelector(e,i.selector);0!==n.length&&(t=t.concat(n),s[i.selector]=!0)}}return t},t.prototype.cssDiff=function(e,t){if(e.selector!==t.selector)return!1;if("media"===e.type||"media"===t.type)return!1;for(var s,r,i={selector:e.selector,rules:[]},n=0;n<e.rules.length;n++)s=e.rules[n],!1===(r=this.findCorrespondingRule(t.rules,s.directive,s.value))?i.rules.push(s):s.value!==r.value&&i.rules.push(s);for(var o=0;o<t.rules.length;o++)r=t.rules[o],!1===(s=this.findCorrespondingRule(e.rules,r.directive))&&(r.type="DELETED",i.rules.push(r));return 0!==i.rules.length&&i},t.prototype.intelligentMerge=function(e,t,s){void 0===s&&(s=!1);for(var r=0;r<t.length;r++)this.intelligentCSSPush(e,t[r],s);for(r=0;r<e.length;r++){var i=e[r];"media"!==i.type&&"keyframes"!==i.type&&(i.rules=this.compactRules(i.rules))}},t.prototype.intelligentCSSPush=function(e,t,s){var r=t.selector,i=!1;if(void 0===s&&(s=!1),!1===s){for(var n=0;n<e.length;n++)if(e[n].selector===r){i=e[n];break}}else for(var o=e.length-1;o>-1;o--)if(e[o].selector===r){i=e[o];break}if(!1===i)e.push(t);else if("media"!==t.type)for(var l=0;l<t.rules.length;l++){var p=t.rules[l],a=this.findCorrespondingRule(i.rules,p.directive);!1===a?i.rules.push(p):"DELETED"===p.type?a.type="DELETED":a.value=p.value}else i.subStyles=i.subStyles.concat(t.subStyles)},t.prototype.compactRules=function(e){for(var t=[],s=0;s<e.length;s++)"DELETED"!==e[s].type&&t.push(e[s]);return t},t.prototype.getCSSForEditor=function(e,t){void 0===t&&(t=0);var s="";void 0===e&&(e=this.css);for(var r=0;r<e.length;r++)"imports"===e[r].type&&(s+=e[r].styles+"\n\n");for(r=0;r<e.length;r++){var i=e[r];if(void 0!==i.selector){var n="";void 0!==i.comments&&(n=i.comments+"\n"),"media"===i.type?(s+=n+i.selector+"{\n",s+=this.getCSSForEditor(i.subStyles,t+1),s+="}\n\n"):"keyframes"!==i.type&&"imports"!==i.type&&(s+=this.getSpaces(t)+n+i.selector+" {\n",s+=this.getCSSOfRules(i.rules,t+1),s+=this.getSpaces(t)+"}\n\n")}}for(r=0;r<e.length;r++)"keyframes"===e[r].type&&(s+=e[r].styles+"\n\n");return s},t.prototype.getImports=function(e){for(var t=[],s=0;s<e.length;s++)"imports"===e[s].type&&t.push(e[s].styles);return t},t.prototype.getCSSOfRules=function(e,t){for(var s="",r=0;r<e.length;r++)void 0!==e[r]&&(void 0===e[r].defective?s+=this.getSpaces(t)+e[r].directive+": "+e[r].value+";\n":s+=this.getSpaces(t)+e[r].value+";\n");return s||"\n"},t.prototype.getSpaces=function(e){for(var t="",s=0;s<4*e;s++)t+=" ";return t},t.prototype.applyNamespacing=function(e,t){var s=e,r="."+this.cssPreviewNamespace;void 0!==t&&(r=t),"string"==typeof e&&(s=this.parseCSS(e));for(var i=0;i<s.length;i++){var n=s[i];if(!(n.selector.indexOf("@font-face")>-1||n.selector.indexOf("keyframes")>-1||n.selector.indexOf("@import")>-1||n.selector.indexOf(".form-all")>-1||n.selector.indexOf("#stage")>-1))if("media"!==n.type){for(var o=n.selector.split(","),l=[],p=0;p<o.length;p++)-1===o[p].indexOf(".supernova")?l.push(r+" "+o[p]):l.push(o[p]);n.selector=l.join(",")}else n.subStyles=this.applyNamespacing(n.subStyles,t)}return s},t.prototype.clearNamespacing=function(e,t){void 0===t&&(t=!1);var s=e,r="."+this.cssPreviewNamespace;"string"==typeof e&&(s=this.parseCSS(e));for(var i=0;i<s.length;i++){var n=s[i];if("media"!==n.type){for(var o=n.selector.split(","),l=[],p=0;p<o.length;p++)l.push(o[p].split(r+" ").join(""));n.selector=l.join(",")}else n.subStyles=this.clearNamespacing(n.subStyles,!0)}return!1===t?this.getCSSForEditor(s):s},t.prototype.createStyleElement=function(e,t,s){if(void 0===s&&(s=!1),!1===this.testMode&&"nonamespace"!==s&&(t=this.applyNamespacing(t)),"string"!=typeof t&&(t=this.getCSSForEditor(t)),!0===s&&(t=this.getCSSForEditor(this.parseCSS(t))),!1!==this.testMode)return this.testMode("create style #"+e,t);var r=document.getElementById(e);r&&r.parentNode.removeChild(r);var i=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.id=e,n.type="text/css",i.appendChild(n),n.styleSheet&&!n.sheet?n.styleSheet.cssText=t:n.appendChild(document.createTextNode(t))},e.cssjs=t}(this);
\ No newline at end of file
+!function(e){"use strict";var t=function(){this.cssImportStatements=[],this.cssKeyframeStatements=[],this.cssRegex=new RegExp("([\\s\\S]*?){([\\s\\S]*?)}","gi"),this.cssMediaQueryRegex="((@media [\\s\\S]*?){([\\s\\S]*?}\\s*?)})",this.cssKeyframeRegex="((@.*?keyframes [\\s\\S]*?){([\\s\\S]*?}\\s*?)})",this.combinedCSSRegex="((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]*?){([\\s\\S]*?)(?!.*}})}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)(?![\\s\\S]?}})[\\s\\S]})",this.cssCommentsRegex="(\\/\\*[\\s\\S]*?\\*\\/)",this.cssImportStatementRegex=new RegExp("@import .*?;","gi")};t.prototype.stripComments=function(e){var t=new RegExp(this.cssCommentsRegex,"gi");return e.replace(t,"")},t.prototype.parseCSS=function(e){if(void 0===e)return[];for(var t=[];;){var s=this.cssImportStatementRegex.exec(e);if(null===s)break;this.cssImportStatements.push(s[0]),t.push({selector:"@imports",type:"imports",styles:s[0]})}e=e.replace(this.cssImportStatementRegex,"");for(var r,i=new RegExp(this.cssKeyframeRegex,"gi");null!==(r=i.exec(e));)t.push({selector:"@keyframes",type:"keyframes",styles:r[0]});e=e.replace(i,"");for(var n=new RegExp(this.combinedCSSRegex,"gi");null!==(r=n.exec(e));){var o="";o=void 0===r[2]?r[5].split("\r\n").join("\n").trim():r[2].split("\r\n").join("\n").trim();var l=new RegExp(this.cssCommentsRegex,"gi"),p=l.exec(o);if(null!==p&&(o=o.replace(l,"").trim()),-1!==(o=o.replace(/\n+/,"\n")).indexOf("@media")){var a={selector:o,type:"media",subStyles:this.parseCSS(r[3]+"\n}")};null!==p&&(a.comments=p[0]),t.push(a)}else{var c={selector:o,rules:this.parseRules(r[6])};"@font-face"===o&&(c.type="font-face"),null!==p&&(c.comments=p[0]),t.push(c)}}return t},t.prototype.parseRules=function(e){var t=[];e=(e=e.split("\r\n").join("\n")).split(";");for(var s=0;s<e.length;s++){var r=e[s];if(-1!==(r=r.trim()).indexOf(":")){var i=(r=r.split(":"))[0].trim(),n=r.slice(1).join(":").trim();if(i.length<1||n.length<1)continue;t.push({directive:i,value:n})}else"base64,"===r.trim().substr(0,7)?t[t.length-1].value+=r.trim():0<r.length&&t.push({directive:"",value:r,defective:!0})}return t},t.prototype.findCorrespondingRule=function(e,t,s){void 0===s&&(s=!1);for(var r=!1,i=0;i<e.length&&(e[i].directive!==t||(r=e[i],s!==e[i].value));i++);return r},t.prototype.findBySelector=function(e,t,s){void 0===s&&(s=!1);for(var r=[],i=0;i<e.length;i++)!1===s?e[i].selector===t&&r.push(e[i]):-1!==e[i].selector.indexOf(t)&&r.push(e[i]);if("@imports"===t||r.length<2)return r;var n=r[0];for(i=1;i<r.length;i++)this.intelligentCSSPush([n],r[i]);return[n]},t.prototype.deleteBySelector=function(e,t){for(var s=[],r=0;r<e.length;r++)e[r].selector!==t&&s.push(e[r]);return s},t.prototype.compressCSS=function(e){for(var t=[],s={},r=0;r<e.length;r++){var i=e[r];if(!0!==s[i.selector]){var n=this.findBySelector(e,i.selector);0!==n.length&&(t=t.concat(n),s[i.selector]=!0)}}return t},t.prototype.cssDiff=function(e,t){if(e.selector!==t.selector)return!1;if("media"===e.type||"media"===t.type)return!1;for(var s,r,i={selector:e.selector,rules:[]},n=0;n<e.rules.length;n++)s=e.rules[n],!1===(r=this.findCorrespondingRule(t.rules,s.directive,s.value))?i.rules.push(s):s.value!==r.value&&i.rules.push(s);for(var o=0;o<t.rules.length;o++)r=t.rules[o],!1===(s=this.findCorrespondingRule(e.rules,r.directive))&&(r.type="DELETED",i.rules.push(r));return 0!==i.rules.length&&i},t.prototype.intelligentMerge=function(e,t,s){void 0===s&&(s=!1);for(var r=0;r<t.length;r++)this.intelligentCSSPush(e,t[r],s);for(r=0;r<e.length;r++){var i=e[r];"media"!==i.type&&"keyframes"!==i.type&&(i.rules=this.compactRules(i.rules))}},t.prototype.intelligentCSSPush=function(e,t,s){var r=t.selector,i=!1;if(void 0===s&&(s=!1),!1===s){for(var n=0;n<e.length;n++)if(e[n].selector===r){i=e[n];break}}else for(var o=e.length-1;-1<o;o--)if(e[o].selector===r){i=e[o];break}if(!1===i)e.push(t);else if("media"!==t.type)for(var l=0;l<t.rules.length;l++){var p=t.rules[l],a=this.findCorrespondingRule(i.rules,p.directive);!1===a?i.rules.push(p):"DELETED"===p.type?a.type="DELETED":a.value=p.value}else i.subStyles=i.subStyles.concat(t.subStyles)},t.prototype.compactRules=function(e){for(var t=[],s=0;s<e.length;s++)"DELETED"!==e[s].type&&t.push(e[s]);return t},t.prototype.getCSSForEditor=function(e,t){void 0===t&&(t=0);var s="";void 0===e&&(e=this.css);for(var r=0;r<e.length;r++)"imports"===e[r].type&&(s+=e[r].styles+"\n\n");for(r=0;r<e.length;r++){var i=e[r];if(void 0!==i.selector){var n="";void 0!==i.comments&&(n=i.comments+"\n"),"media"===i.type?(s+=n+i.selector+"{\n",s+=this.getCSSForEditor(i.subStyles,t+1),s+="}\n\n"):"keyframes"!==i.type&&"imports"!==i.type&&(s+=this.getSpaces(t)+n+i.selector+" {\n",s+=this.getCSSOfRules(i.rules,t+1),s+=this.getSpaces(t)+"}\n\n")}}for(r=0;r<e.length;r++)"keyframes"===e[r].type&&(s+=e[r].styles+"\n\n");return s},t.prototype.getImports=function(e){for(var t=[],s=0;s<e.length;s++)"imports"===e[s].type&&t.push(e[s].styles);return t},t.prototype.getCSSOfRules=function(e,t){for(var s="",r=0;r<e.length;r++)void 0!==e[r]&&(void 0===e[r].defective?s+=this.getSpaces(t)+e[r].directive+": "+e[r].value+";\n":s+=this.getSpaces(t)+e[r].value+";\n");return s||"\n"},t.prototype.getSpaces=function(e){for(var t="",s=0;s<4*e;s++)t+=" ";return t},t.prototype.applyNamespacing=function(e,t){var s=e,r="."+this.cssPreviewNamespace;void 0!==t&&(r=t),"string"==typeof e&&(s=this.parseCSS(e));for(var i=0;i<s.length;i++){var n=s[i];if(!(-1<n.selector.indexOf("@font-face")||-1<n.selector.indexOf("keyframes")||-1<n.selector.indexOf("@import")||-1<n.selector.indexOf(".form-all")||-1<n.selector.indexOf("#stage")))if("media"!==n.type){for(var o=n.selector.split(","),l=[],p=0;p<o.length;p++)-1===o[p].indexOf(".supernova")?l.push(r+" "+o[p]):l.push(o[p]);n.selector=l.join(",")}else n.subStyles=this.applyNamespacing(n.subStyles,t)}return s},t.prototype.clearNamespacing=function(e,t){void 0===t&&(t=!1);var s=e,r="."+this.cssPreviewNamespace;"string"==typeof e&&(s=this.parseCSS(e));for(var i=0;i<s.length;i++){var n=s[i];if("media"!==n.type){for(var o=n.selector.split(","),l=[],p=0;p<o.length;p++)l.push(o[p].split(r+" ").join(""));n.selector=l.join(",")}else n.subStyles=this.clearNamespacing(n.subStyles,!0)}return!1===t?this.getCSSForEditor(s):s},t.prototype.createStyleElement=function(e,t,s){if(void 0===s&&(s=!1),!1===this.testMode&&"nonamespace"!==s&&(t=this.applyNamespacing(t)),"string"!=typeof t&&(t=this.getCSSForEditor(t)),!0===s&&(t=this.getCSSForEditor(this.parseCSS(t))),!1!==this.testMode)return this.testMode("create style #"+e,t);var r=document.getElementById(e);r&&r.parentNode.removeChild(r);var i=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.id=e,n.type="text/css",i.appendChild(n),n.styleSheet&&!n.sheet?n.styleSheet.cssText=t:n.appendChild(document.createTextNode(t))},e.cssjs=t}(this);
\ No newline at end of file
diff --git a/tests/cssParsing.test.js b/tests/cssParsing.test.js
index 7a7c564..82a97f0 100755
--- a/tests/cssParsing.test.js
+++ b/tests/cssParsing.test.js
@@ -40,8 +40,6 @@ QUnit.test('FullInspector Unit Tests', function(assert) {
     expected = unitTest.parseRules1.output;
     result = fullInspector.parseRules(unitTest.parseRules1.input);
     assert.deepEqual(result, expected, 'fi.prototype.parseRules : parse css rules, containing duplicate directives' ); //assert 9
-
-
 });
 
 QUnit.test('Basic CSS parsing', function(assert) {
@@ -69,7 +67,11 @@ QUnit.test('Basic CSS parsing', function(assert) {
 
     expected = JSON.parse(testData.basicCSS5.output); //simple css with margin value is "*0"
     parsed = fullInspector.parseCSS(testData.basicCSS5.input);
-    assert.deepEqual(parsed, expected, 'simple css with margin value is "*0'); //assert 5
+    assert.deepEqual(parsed, expected, 'simple css with margin value is "*0'); //assert 6
+
+    expected = JSON.parse(testData.basicCSS6.output); //stacked classes separate into 2 rules
+    parsed = fullInspector.parseCSS(testData.basicCSS6.input);
+    assert.deepEqual(parsed, expected, 'stacked css classes are separated correctly'); //assert 7
 });
 QUnit.test('Advanced CSS Parsing(support for media queries)', function(assert) {
     var expected = JSON.parse(testData.advCSS.output);
@@ -99,6 +101,36 @@ QUnit.test('Advanced CSS Parsing(support for media queries)', function(assert) {
     assert.deepEqual(parsed, expected, 'Media query with a comment above it.');
 });
 
+QUnit.test('Template CSS Parsing (retains handlebars-style syntax in CSS)', function(assert) {
+    var expected = JSON.parse(testData.tmplCSS.output);
+    var parsed = fullInspector.parseCSS(testData.tmplCSS.input);
+    assert.deepEqual(parsed, expected, 'basic CSS value assignment should have margin {{test}}');
+
+    var expected = JSON.parse(testData.tmplCSS2.output);
+    var parsed = fullInspector.parseCSS(testData.tmplCSS2.input);
+    assert.deepEqual(parsed, expected, 'background image should have url with placeholder maintained');
+
+    var expected = JSON.parse(testData.tmplCSS3.output);
+    var parsed = fullInspector.parseCSS(testData.tmplCSS3.input);
+    assert.deepEqual(parsed, expected, 'background image specified in url(\'\') should have url with placeholder maintained');
+
+    var expected = JSON.parse(testData.tmplCSS4.output);
+    var parsed = fullInspector.parseCSS(testData.tmplCSS4.input);
+    assert.deepEqual(parsed, expected, 'background image specified in url("") should have url with placeholder maintained');
+
+    var expected = JSON.parse(testData.tmplCSS5.output);
+    var parsed = fullInspector.parseCSS(testData.tmplCSS5.input);
+    assert.deepEqual(parsed, expected, 'basic CSS value assignment should maintain leading spacing');
+
+    var expected = JSON.parse(testData.tmplCSS6.output);
+    var parsed = fullInspector.parseCSS(testData.tmplCSS6.input);
+    assert.deepEqual(parsed, expected, 'basic CSS value assignment should maintain surrounding spacing');
+
+    var expected = JSON.parse(testData.tmplCSS7.output);
+    var parsed = fullInspector.parseCSS(testData.tmplCSS7.input);
+    assert.deepEqual(parsed, expected, 'basic CSS value assignment should maintain trailing spacing');
+});
+
 /*
 	this tests convert css string to object, then to string, then to object and compares the last 2 objects
 	to detect incostincies
diff --git a/tests/data.js b/tests/data.js
index 72ae48e..45218d3 100755
--- a/tests/data.js
+++ b/tests/data.js
@@ -23,6 +23,10 @@ var testData = {
         input: '.someClass{margin:0;}',
         output: '[{"selector":".someClass","rules":[{"directive":"margin","value":"0"}]}]'
     },
+    basicCSS6: {
+        input: '.someClass{margin:0;}.someClass2{margin:1;}',
+        output: '[{"selector":".someClass","rules":[{"directive":"margin","value":"0"}]},{"selector":".someClass2","rules":[{"directive":"margin","value":"1"}]}]'
+    },
     advCSS: {
         input: '@media screen and (min-width: 780px) {\n  .supernova {\n    background-color: #fafafa;\n  }\n}',
         output: '[{"selector":"@media screen and (min-width: 780px)","type":"media","subStyles":[{"selector":".supernova","rules":[{"directive":"background-color","value":"#fafafa"}]}]}]'
@@ -46,7 +50,35 @@ var testData = {
     advCSS6: {
         input: '/*--------------------------------------------------------------\nA big comment\n--------------------------------------------------------------*/@media screen and (min-width: 780px) {\n  .supernova {\n    background-color: #fafafa;\n  }\n}',
         output: '[{"comments": "/*--------------------------------------------------------------\\nA big comment\\n--------------------------------------------------------------*/","selector":"@media screen and (min-width: 780px)","type":"media","subStyles":[{"selector":".supernova","rules":[{"directive":"background-color","value":"#fafafa"}]}]}]'
-    }
+    },
+    tmplCSS: {
+        input: '.someClass{margin:{{test}};}',
+        output: '[{"selector":".someClass","rules":[{"directive":"margin","value":"{{test}}"}]}]'
+    },
+    tmplCSS2: {
+        input: '.someClass{background-image:url({{test}});}',
+        output: '[{"selector":".someClass","rules":[{"directive":"background-image","value":"url({{test}})"}]}]'
+    },
+    tmplCSS3: {
+        input: '.someClass{background-image:url(\'{{test}}\');}',
+        output: '[{"selector":".someClass","rules":[{"directive":"background-image","value":"url(\'{{test}}\')"}]}]'
+    },
+    tmplCSS4: {
+        input: '.someClass{background-image:url("{{test}}");}',
+        output: '[{"selector":".someClass","rules":[{"directive":"background-image","value":"url(\\"{{test}}\\")"}]}]'
+    },
+    tmplCSS5: {
+        input: '.someClass{margin:{{ test}};}',
+        output: '[{"selector":".someClass","rules":[{"directive":"margin","value":"{{ test}}"}]}]'
+    },
+    tmplCSS6: {
+        input: '.someClass{margin:{{ test }};}',
+        output: '[{"selector":".someClass","rules":[{"directive":"margin","value":"{{ test }}"}]}]'
+    },
+    tmplCSS7: {
+        input: '.someClass{margin:{{test }};}',
+        output: '[{"selector":".someClass","rules":[{"directive":"margin","value":"{{test }}"}]}]'
+    },
 };
 
 
@@ -371,15 +403,15 @@ var unitTest = {
             output : [
                 {
                     directive : 'color',
-                    value : 'white'    
+                    value : 'white'
                 },
                 {
                     directive : 'font-size',
-                    value : '18px'    
+                    value : '18px'
                 },
                 {
                     directive : 'color',
-                    value : 'red'    
+                    value : 'red'
                 }
             ]
     }

From 1a6b6c4069dc4ea2dd07bd461b035944e2b1af8e Mon Sep 17 00:00:00 2001
From: Jesse Pearson <jesse.pearson@totalexpertinc.com>
Date: Tue, 28 Apr 2020 14:34:44 -0500
Subject: [PATCH 2/2] - Push up comment parsing fix

---
 css.js                   | 8 ++++++++
 css.min.js               | 4 ++--
 tests/cssParsing.test.js | 2 ++
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/css.js b/css.js
index 1e564fc..9880e2f 100644
--- a/css.js
+++ b/css.js
@@ -4,6 +4,7 @@
   'use strict';
   var fi = function() {
 
+    this.skipCommentParsing = true;
     this.cssImportStatements = [];
     this.cssKeyframeStatements = [];
 
@@ -15,6 +16,10 @@
     this.cssImportStatementRegex = new RegExp('@import .*?;', 'gi');
   };
 
+  fi.prototype.setSkipCommentParsing = function (skip) {
+    this.skipCommentParsing = skip;
+  };
+
   /*
     Strips out css comments and returns cleaned css string
 
@@ -474,6 +479,9 @@
     }
     for (i = 0; i < cssBase.length; i++) {
       var tmp = cssBase[i];
+      if (this.skipCommentParsing) {
+        tmp.comments = undefined;
+      }
       if (tmp.selector === undefined) { //temporarily omit media queries
         continue;
       }
diff --git a/css.min.js b/css.min.js
index 67707bd..aa94477 100644
--- a/css.min.js
+++ b/css.min.js
@@ -1,3 +1,3 @@
-/*! jotform-css.js 24-04-2020 */
+/*! jotform-css.js 28-04-2020 */
 
-!function(e){"use strict";var t=function(){this.cssImportStatements=[],this.cssKeyframeStatements=[],this.cssRegex=new RegExp("([\\s\\S]*?){([\\s\\S]*?)}","gi"),this.cssMediaQueryRegex="((@media [\\s\\S]*?){([\\s\\S]*?}\\s*?)})",this.cssKeyframeRegex="((@.*?keyframes [\\s\\S]*?){([\\s\\S]*?}\\s*?)})",this.combinedCSSRegex="((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]*?){([\\s\\S]*?)(?!.*}})}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)(?![\\s\\S]?}})[\\s\\S]})",this.cssCommentsRegex="(\\/\\*[\\s\\S]*?\\*\\/)",this.cssImportStatementRegex=new RegExp("@import .*?;","gi")};t.prototype.stripComments=function(e){var t=new RegExp(this.cssCommentsRegex,"gi");return e.replace(t,"")},t.prototype.parseCSS=function(e){if(void 0===e)return[];for(var t=[];;){var s=this.cssImportStatementRegex.exec(e);if(null===s)break;this.cssImportStatements.push(s[0]),t.push({selector:"@imports",type:"imports",styles:s[0]})}e=e.replace(this.cssImportStatementRegex,"");for(var r,i=new RegExp(this.cssKeyframeRegex,"gi");null!==(r=i.exec(e));)t.push({selector:"@keyframes",type:"keyframes",styles:r[0]});e=e.replace(i,"");for(var n=new RegExp(this.combinedCSSRegex,"gi");null!==(r=n.exec(e));){var o="";o=void 0===r[2]?r[5].split("\r\n").join("\n").trim():r[2].split("\r\n").join("\n").trim();var l=new RegExp(this.cssCommentsRegex,"gi"),p=l.exec(o);if(null!==p&&(o=o.replace(l,"").trim()),-1!==(o=o.replace(/\n+/,"\n")).indexOf("@media")){var a={selector:o,type:"media",subStyles:this.parseCSS(r[3]+"\n}")};null!==p&&(a.comments=p[0]),t.push(a)}else{var c={selector:o,rules:this.parseRules(r[6])};"@font-face"===o&&(c.type="font-face"),null!==p&&(c.comments=p[0]),t.push(c)}}return t},t.prototype.parseRules=function(e){var t=[];e=(e=e.split("\r\n").join("\n")).split(";");for(var s=0;s<e.length;s++){var r=e[s];if(-1!==(r=r.trim()).indexOf(":")){var i=(r=r.split(":"))[0].trim(),n=r.slice(1).join(":").trim();if(i.length<1||n.length<1)continue;t.push({directive:i,value:n})}else"base64,"===r.trim().substr(0,7)?t[t.length-1].value+=r.trim():0<r.length&&t.push({directive:"",value:r,defective:!0})}return t},t.prototype.findCorrespondingRule=function(e,t,s){void 0===s&&(s=!1);for(var r=!1,i=0;i<e.length&&(e[i].directive!==t||(r=e[i],s!==e[i].value));i++);return r},t.prototype.findBySelector=function(e,t,s){void 0===s&&(s=!1);for(var r=[],i=0;i<e.length;i++)!1===s?e[i].selector===t&&r.push(e[i]):-1!==e[i].selector.indexOf(t)&&r.push(e[i]);if("@imports"===t||r.length<2)return r;var n=r[0];for(i=1;i<r.length;i++)this.intelligentCSSPush([n],r[i]);return[n]},t.prototype.deleteBySelector=function(e,t){for(var s=[],r=0;r<e.length;r++)e[r].selector!==t&&s.push(e[r]);return s},t.prototype.compressCSS=function(e){for(var t=[],s={},r=0;r<e.length;r++){var i=e[r];if(!0!==s[i.selector]){var n=this.findBySelector(e,i.selector);0!==n.length&&(t=t.concat(n),s[i.selector]=!0)}}return t},t.prototype.cssDiff=function(e,t){if(e.selector!==t.selector)return!1;if("media"===e.type||"media"===t.type)return!1;for(var s,r,i={selector:e.selector,rules:[]},n=0;n<e.rules.length;n++)s=e.rules[n],!1===(r=this.findCorrespondingRule(t.rules,s.directive,s.value))?i.rules.push(s):s.value!==r.value&&i.rules.push(s);for(var o=0;o<t.rules.length;o++)r=t.rules[o],!1===(s=this.findCorrespondingRule(e.rules,r.directive))&&(r.type="DELETED",i.rules.push(r));return 0!==i.rules.length&&i},t.prototype.intelligentMerge=function(e,t,s){void 0===s&&(s=!1);for(var r=0;r<t.length;r++)this.intelligentCSSPush(e,t[r],s);for(r=0;r<e.length;r++){var i=e[r];"media"!==i.type&&"keyframes"!==i.type&&(i.rules=this.compactRules(i.rules))}},t.prototype.intelligentCSSPush=function(e,t,s){var r=t.selector,i=!1;if(void 0===s&&(s=!1),!1===s){for(var n=0;n<e.length;n++)if(e[n].selector===r){i=e[n];break}}else for(var o=e.length-1;-1<o;o--)if(e[o].selector===r){i=e[o];break}if(!1===i)e.push(t);else if("media"!==t.type)for(var l=0;l<t.rules.length;l++){var p=t.rules[l],a=this.findCorrespondingRule(i.rules,p.directive);!1===a?i.rules.push(p):"DELETED"===p.type?a.type="DELETED":a.value=p.value}else i.subStyles=i.subStyles.concat(t.subStyles)},t.prototype.compactRules=function(e){for(var t=[],s=0;s<e.length;s++)"DELETED"!==e[s].type&&t.push(e[s]);return t},t.prototype.getCSSForEditor=function(e,t){void 0===t&&(t=0);var s="";void 0===e&&(e=this.css);for(var r=0;r<e.length;r++)"imports"===e[r].type&&(s+=e[r].styles+"\n\n");for(r=0;r<e.length;r++){var i=e[r];if(void 0!==i.selector){var n="";void 0!==i.comments&&(n=i.comments+"\n"),"media"===i.type?(s+=n+i.selector+"{\n",s+=this.getCSSForEditor(i.subStyles,t+1),s+="}\n\n"):"keyframes"!==i.type&&"imports"!==i.type&&(s+=this.getSpaces(t)+n+i.selector+" {\n",s+=this.getCSSOfRules(i.rules,t+1),s+=this.getSpaces(t)+"}\n\n")}}for(r=0;r<e.length;r++)"keyframes"===e[r].type&&(s+=e[r].styles+"\n\n");return s},t.prototype.getImports=function(e){for(var t=[],s=0;s<e.length;s++)"imports"===e[s].type&&t.push(e[s].styles);return t},t.prototype.getCSSOfRules=function(e,t){for(var s="",r=0;r<e.length;r++)void 0!==e[r]&&(void 0===e[r].defective?s+=this.getSpaces(t)+e[r].directive+": "+e[r].value+";\n":s+=this.getSpaces(t)+e[r].value+";\n");return s||"\n"},t.prototype.getSpaces=function(e){for(var t="",s=0;s<4*e;s++)t+=" ";return t},t.prototype.applyNamespacing=function(e,t){var s=e,r="."+this.cssPreviewNamespace;void 0!==t&&(r=t),"string"==typeof e&&(s=this.parseCSS(e));for(var i=0;i<s.length;i++){var n=s[i];if(!(-1<n.selector.indexOf("@font-face")||-1<n.selector.indexOf("keyframes")||-1<n.selector.indexOf("@import")||-1<n.selector.indexOf(".form-all")||-1<n.selector.indexOf("#stage")))if("media"!==n.type){for(var o=n.selector.split(","),l=[],p=0;p<o.length;p++)-1===o[p].indexOf(".supernova")?l.push(r+" "+o[p]):l.push(o[p]);n.selector=l.join(",")}else n.subStyles=this.applyNamespacing(n.subStyles,t)}return s},t.prototype.clearNamespacing=function(e,t){void 0===t&&(t=!1);var s=e,r="."+this.cssPreviewNamespace;"string"==typeof e&&(s=this.parseCSS(e));for(var i=0;i<s.length;i++){var n=s[i];if("media"!==n.type){for(var o=n.selector.split(","),l=[],p=0;p<o.length;p++)l.push(o[p].split(r+" ").join(""));n.selector=l.join(",")}else n.subStyles=this.clearNamespacing(n.subStyles,!0)}return!1===t?this.getCSSForEditor(s):s},t.prototype.createStyleElement=function(e,t,s){if(void 0===s&&(s=!1),!1===this.testMode&&"nonamespace"!==s&&(t=this.applyNamespacing(t)),"string"!=typeof t&&(t=this.getCSSForEditor(t)),!0===s&&(t=this.getCSSForEditor(this.parseCSS(t))),!1!==this.testMode)return this.testMode("create style #"+e,t);var r=document.getElementById(e);r&&r.parentNode.removeChild(r);var i=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.id=e,n.type="text/css",i.appendChild(n),n.styleSheet&&!n.sheet?n.styleSheet.cssText=t:n.appendChild(document.createTextNode(t))},e.cssjs=t}(this);
\ No newline at end of file
+!function(e){"use strict";var t=function(){this.skipCommentParsing=!0,this.cssImportStatements=[],this.cssKeyframeStatements=[],this.cssRegex=new RegExp("([\\s\\S]*?){([\\s\\S]*?)}","gi"),this.cssMediaQueryRegex="((@media [\\s\\S]*?){([\\s\\S]*?}\\s*?)})",this.cssKeyframeRegex="((@.*?keyframes [\\s\\S]*?){([\\s\\S]*?}\\s*?)})",this.combinedCSSRegex="((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]*?){([\\s\\S]*?)(?!.*}})}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)(?![\\s\\S]?}})[\\s\\S]})",this.cssCommentsRegex="(\\/\\*[\\s\\S]*?\\*\\/)",this.cssImportStatementRegex=new RegExp("@import .*?;","gi")};t.prototype.setSkipCommentParsing=function(e){this.skipCommentParsing=e},t.prototype.stripComments=function(e){var t=new RegExp(this.cssCommentsRegex,"gi");return e.replace(t,"")},t.prototype.parseCSS=function(e){if(void 0===e)return[];for(var t=[];;){var s=this.cssImportStatementRegex.exec(e);if(null===s)break;this.cssImportStatements.push(s[0]),t.push({selector:"@imports",type:"imports",styles:s[0]})}e=e.replace(this.cssImportStatementRegex,"");for(var r,i=new RegExp(this.cssKeyframeRegex,"gi");null!==(r=i.exec(e));)t.push({selector:"@keyframes",type:"keyframes",styles:r[0]});e=e.replace(i,"");for(var n=new RegExp(this.combinedCSSRegex,"gi");null!==(r=n.exec(e));){var o="";o=void 0===r[2]?r[5].split("\r\n").join("\n").trim():r[2].split("\r\n").join("\n").trim();var l=new RegExp(this.cssCommentsRegex,"gi"),p=l.exec(o);if(null!==p&&(o=o.replace(l,"").trim()),-1!==(o=o.replace(/\n+/,"\n")).indexOf("@media")){var a={selector:o,type:"media",subStyles:this.parseCSS(r[3]+"\n}")};null!==p&&(a.comments=p[0]),t.push(a)}else{var c={selector:o,rules:this.parseRules(r[6])};"@font-face"===o&&(c.type="font-face"),null!==p&&(c.comments=p[0]),t.push(c)}}return t},t.prototype.parseRules=function(e){var t=[];e=(e=e.split("\r\n").join("\n")).split(";");for(var s=0;s<e.length;s++){var r=e[s];if(-1!==(r=r.trim()).indexOf(":")){var i=(r=r.split(":"))[0].trim(),n=r.slice(1).join(":").trim();if(i.length<1||n.length<1)continue;t.push({directive:i,value:n})}else"base64,"===r.trim().substr(0,7)?t[t.length-1].value+=r.trim():0<r.length&&t.push({directive:"",value:r,defective:!0})}return t},t.prototype.findCorrespondingRule=function(e,t,s){void 0===s&&(s=!1);for(var r=!1,i=0;i<e.length&&(e[i].directive!==t||(r=e[i],s!==e[i].value));i++);return r},t.prototype.findBySelector=function(e,t,s){void 0===s&&(s=!1);for(var r=[],i=0;i<e.length;i++)!1===s?e[i].selector===t&&r.push(e[i]):-1!==e[i].selector.indexOf(t)&&r.push(e[i]);if("@imports"===t||r.length<2)return r;var n=r[0];for(i=1;i<r.length;i++)this.intelligentCSSPush([n],r[i]);return[n]},t.prototype.deleteBySelector=function(e,t){for(var s=[],r=0;r<e.length;r++)e[r].selector!==t&&s.push(e[r]);return s},t.prototype.compressCSS=function(e){for(var t=[],s={},r=0;r<e.length;r++){var i=e[r];if(!0!==s[i.selector]){var n=this.findBySelector(e,i.selector);0!==n.length&&(t=t.concat(n),s[i.selector]=!0)}}return t},t.prototype.cssDiff=function(e,t){if(e.selector!==t.selector)return!1;if("media"===e.type||"media"===t.type)return!1;for(var s,r,i={selector:e.selector,rules:[]},n=0;n<e.rules.length;n++)s=e.rules[n],!1===(r=this.findCorrespondingRule(t.rules,s.directive,s.value))?i.rules.push(s):s.value!==r.value&&i.rules.push(s);for(var o=0;o<t.rules.length;o++)r=t.rules[o],!1===(s=this.findCorrespondingRule(e.rules,r.directive))&&(r.type="DELETED",i.rules.push(r));return 0!==i.rules.length&&i},t.prototype.intelligentMerge=function(e,t,s){void 0===s&&(s=!1);for(var r=0;r<t.length;r++)this.intelligentCSSPush(e,t[r],s);for(r=0;r<e.length;r++){var i=e[r];"media"!==i.type&&"keyframes"!==i.type&&(i.rules=this.compactRules(i.rules))}},t.prototype.intelligentCSSPush=function(e,t,s){var r=t.selector,i=!1;if(void 0===s&&(s=!1),!1===s){for(var n=0;n<e.length;n++)if(e[n].selector===r){i=e[n];break}}else for(var o=e.length-1;-1<o;o--)if(e[o].selector===r){i=e[o];break}if(!1===i)e.push(t);else if("media"!==t.type)for(var l=0;l<t.rules.length;l++){var p=t.rules[l],a=this.findCorrespondingRule(i.rules,p.directive);!1===a?i.rules.push(p):"DELETED"===p.type?a.type="DELETED":a.value=p.value}else i.subStyles=i.subStyles.concat(t.subStyles)},t.prototype.compactRules=function(e){for(var t=[],s=0;s<e.length;s++)"DELETED"!==e[s].type&&t.push(e[s]);return t},t.prototype.getCSSForEditor=function(e,t){void 0===t&&(t=0);var s="";void 0===e&&(e=this.css);for(var r=0;r<e.length;r++)"imports"===e[r].type&&(s+=e[r].styles+"\n\n");for(r=0;r<e.length;r++){var i=e[r];if(this.skipCommentParsing&&(i.comments=void 0),void 0!==i.selector){var n="";void 0!==i.comments&&(n=i.comments+"\n"),"media"===i.type?(s+=n+i.selector+"{\n",s+=this.getCSSForEditor(i.subStyles,t+1),s+="}\n\n"):"keyframes"!==i.type&&"imports"!==i.type&&(s+=this.getSpaces(t)+n+i.selector+" {\n",s+=this.getCSSOfRules(i.rules,t+1),s+=this.getSpaces(t)+"}\n\n")}}for(r=0;r<e.length;r++)"keyframes"===e[r].type&&(s+=e[r].styles+"\n\n");return s},t.prototype.getImports=function(e){for(var t=[],s=0;s<e.length;s++)"imports"===e[s].type&&t.push(e[s].styles);return t},t.prototype.getCSSOfRules=function(e,t){for(var s="",r=0;r<e.length;r++)void 0!==e[r]&&(void 0===e[r].defective?s+=this.getSpaces(t)+e[r].directive+": "+e[r].value+";\n":s+=this.getSpaces(t)+e[r].value+";\n");return s||"\n"},t.prototype.getSpaces=function(e){for(var t="",s=0;s<4*e;s++)t+=" ";return t},t.prototype.applyNamespacing=function(e,t){var s=e,r="."+this.cssPreviewNamespace;void 0!==t&&(r=t),"string"==typeof e&&(s=this.parseCSS(e));for(var i=0;i<s.length;i++){var n=s[i];if(!(-1<n.selector.indexOf("@font-face")||-1<n.selector.indexOf("keyframes")||-1<n.selector.indexOf("@import")||-1<n.selector.indexOf(".form-all")||-1<n.selector.indexOf("#stage")))if("media"!==n.type){for(var o=n.selector.split(","),l=[],p=0;p<o.length;p++)-1===o[p].indexOf(".supernova")?l.push(r+" "+o[p]):l.push(o[p]);n.selector=l.join(",")}else n.subStyles=this.applyNamespacing(n.subStyles,t)}return s},t.prototype.clearNamespacing=function(e,t){void 0===t&&(t=!1);var s=e,r="."+this.cssPreviewNamespace;"string"==typeof e&&(s=this.parseCSS(e));for(var i=0;i<s.length;i++){var n=s[i];if("media"!==n.type){for(var o=n.selector.split(","),l=[],p=0;p<o.length;p++)l.push(o[p].split(r+" ").join(""));n.selector=l.join(",")}else n.subStyles=this.clearNamespacing(n.subStyles,!0)}return!1===t?this.getCSSForEditor(s):s},t.prototype.createStyleElement=function(e,t,s){if(void 0===s&&(s=!1),!1===this.testMode&&"nonamespace"!==s&&(t=this.applyNamespacing(t)),"string"!=typeof t&&(t=this.getCSSForEditor(t)),!0===s&&(t=this.getCSSForEditor(this.parseCSS(t))),!1!==this.testMode)return this.testMode("create style #"+e,t);var r=document.getElementById(e);r&&r.parentNode.removeChild(r);var i=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.id=e,n.type="text/css",i.appendChild(n),n.styleSheet&&!n.sheet?n.styleSheet.cssText=t:n.appendChild(document.createTextNode(t))},e.cssjs=t}(this);
\ No newline at end of file
diff --git a/tests/cssParsing.test.js b/tests/cssParsing.test.js
index 82a97f0..d290048 100755
--- a/tests/cssParsing.test.js
+++ b/tests/cssParsing.test.js
@@ -1,5 +1,7 @@
 var fullInspector = new cssjs();
 
+fullInspector.setSkipCommentParsing(false);
+
 QUnit.test('FullInspector Unit Tests', function(assert) {
     var expected = unitTest.stripComments.output;
     var result = fullInspector.stripComments(unitTest.stripComments.input);