From 901ce18dffacc8e862c1dd855246bee872513ed1 Mon Sep 17 00:00:00 2001
From: Artur Arseniev <artur.catch@hotmail.it>
Date: Wed, 8 Jun 2016 00:34:23 +0200
Subject: [PATCH] Detach style from the html string on add of the component

---
 src/dom_components/model/Components.js     | 9 +++++++--
 src/parser/model/ParserHtml.js             | 2 +-
 test/specs/css_composer/e2e/CssComposer.js | 9 +++++++++
 3 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/dom_components/model/Components.js b/src/dom_components/model/Components.js
index 267d3385b..9d3f0f6fe 100644
--- a/src/dom_components/model/Components.js
+++ b/src/dom_components/model/Components.js
@@ -49,8 +49,13 @@ define([ 'backbone', 'require'],
 			},
 
 			add: function(models, opt){
-				if(typeof models === 'string')
-					models = this.editor.Parser.parseHtml(models).html;
+				if(typeof models === 'string'){
+					var parsed = this.editor.Parser.parseHtml(models);
+					models = parsed.html;
+
+					if(parsed.css)
+						this.editor.CssComposer.getRules().add(parsed.css);
+				}
 
 				return Backbone.Collection.prototype.add.apply(this, [models, opt]);
 			},
diff --git a/src/parser/model/ParserHtml.js b/src/parser/model/ParserHtml.js
index 3d3365edb..735a4f17c 100644
--- a/src/parser/model/ParserHtml.js
+++ b/src/parser/model/ParserHtml.js
@@ -156,7 +156,7 @@ define(function(require) {
        * @return {Object}
        */
       parse: function(str, parserCss){
-        var res = { html: [], css: []};
+        var res = { html: '', css: ''};
         var el = document.createElement('div');
         el.innerHTML = str;
         var scripts = el.querySelectorAll('script');
diff --git a/test/specs/css_composer/e2e/CssComposer.js b/test/specs/css_composer/e2e/CssComposer.js
index 5727060a8..83b4c829e 100644
--- a/test/specs/css_composer/e2e/CssComposer.js
+++ b/test/specs/css_composer/e2e/CssComposer.js
@@ -21,6 +21,7 @@ define(function(require) {
               });
               this.cssc = this.gjs.editor.get('CssComposer');
               this.clsm = this.gjs.editor.get('ClassManager');
+              this.domc = this.gjs.editor.Components;
               this.$fixture.empty().appendTo(this.$fixtures);
               this.gjs.render();
               this.rulesSet = [
@@ -75,6 +76,14 @@ define(function(require) {
               cls.at(2).get('name').should.equal('test3');
             });
 
+            it('Add rules from the new component added as a string with style tag', function() {
+              var comps = this.domc.getComponents();
+              var rules = this.cssc.getRules();
+              comps.add("<div>Test</div><style>.test{color: red} .test2{color: blue}</style>");
+              comps.length.should.equal(1);
+              rules.length.should.equal(2);
+            });
+
         });
       }
     };