Take in account singleAtRule in CSS generator

src/code_manager/model/CssGenerator.js

@@ -72,9 +72,16 @@ module.exports = require('backbone').Model.extend({
       for (let atRule in atRules) {
         let rulesStr = '';
         const mRules = atRules[atRule];
-        mRules.forEach(
-          rule => (rulesStr += this.buildFromRule(rule, dump, opts))
-        );
+
+        mRules.forEach(rule => {
+          const ruleStr = this.buildFromRule(rule, dump, opts);
+
+          if (rule.get('singleAtRule')) {
+            code += `${atRule}{${ruleStr}}`;
+          } else {
+            rulesStr += ruleStr;
+          }
+        });
 
         if (rulesStr) {
           code += `${atRule}{${rulesStr}}`;

src/parser/model/ParserCss.js

@@ -13,7 +13,7 @@ module.exports = (config = {}) => ({
   parse(str) {
     let result = [];
     const { parserCss, em = {} } = config;
-    const editor = em && em.get('Editor');
+    const editor = em && em.get && em.get('Editor');
     const nodes = parserCss ? parserCss(str, editor) : BrowserCssParser(str);
     nodes.forEach(node => (result = result.concat(this.checkNode(node))));
 

test/specs/grapesjs/index.js

@@ -164,18 +164,19 @@ describe('GrapesJS', () => {
         `
       <style>
         @font-face {
-          font-family: 'Glyphicons Halflings';
-          src: url(https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/fonts/glyphicons-halflings-regular.woff2) format('woff2');
+          font-family: 'A';
+          src: url('http://a.link') format('woff2');
         }
         @font-face {
-          font-family: 'Droid Sans';
-          src: url(https://fonts.gstatic.com/s/droidsans/v8/SlGVmQWMvZQIdix7AFxXkHNSbRYXags.woff2) format('woff2');
+          font-family: 'B';
+          src: url('http://b.link') format('woff2');
         }
       </style>` + htmlString;
       const editor = obj.init(config);
       const css = editor.getCss();
       const styles = editor.getStyle();
       expect(styles.length).toEqual(2);
+      expect((css.match(/@font-face/g) || []).length).toEqual(2);
     });
 
     test('Set components as HTML', () => {