diff --git a/test/main.js b/test/main.js
index 91eec0d48..9c9958d24 100644
--- a/test/main.js
+++ b/test/main.js
@@ -14,4 +14,5 @@ describe('Main', () => {
   require(`${path}code_manager`);
   require(`${path}commands`);
   require(`${path}css_composer`);
+  require(`${path}dom_components`);
 });
diff --git a/test/specs/dom_components/index.js b/test/specs/dom_components/index.js
new file mode 100644
index 000000000..0e496bbe1
--- /dev/null
+++ b/test/specs/dom_components/index.js
@@ -0,0 +1,117 @@
+const DomComponents = require('dom_components');
+const ComponentModels = require('./model/Component');
+const ComponentView = require('./view/ComponentV');
+const ComponentsView = require('./view/ComponentsView');
+const ComponentTextView = require('./view/ComponentTextView');
+const ComponentImageView = require('./view/ComponentImageView');
+const utils = require('./../test_utils.js');
+
+describe('DOM Components', function() {
+
+  describe('Main', function() {
+
+    var obj;
+    var config;
+    var storagMock = utils.storageMock();
+    var editorModel = {
+      config: {
+        loadCompsOnRender: 0,
+      },
+      get: function(){return;},
+      getHtml: function(){return 'testHtml';},
+      getComponents: function(){return {test: 1};},
+      getCacheLoad: function(){
+        return storagMock.load();
+      }
+    };
+    // Methods
+    var setSmConfig = function(){
+      config.stm = storagMock;
+      config.stm.getConfig =  function(){
+        return {
+          storeHtml: 1,
+          storeComponents: 1,
+        }
+      };
+    };
+    var setEm = function(){
+      config.em = editorModel;
+    }
+
+
+    beforeEach(function () {
+      config = {};
+      obj = new DomComponents().init(config);
+    });
+
+    afterEach(function () {
+      obj = null;
+    });
+
+    it('Object exists', function() {
+      expect(DomComponents).toExist();
+    });
+
+    it('storageKey returns array', function() {
+      expect(obj.storageKey() instanceof Array).toEqual(true);
+    });
+
+    it('storageKey returns correct composition', function() {
+      config.stm = {
+        getConfig: function(){
+          return {
+            storeHtml: 1,
+            storeComponents: 1,
+          }
+        }
+      };
+      expect(obj.storageKey()).toEqual(['html', 'components']);
+    });
+
+    it('Store data', function() {
+      setSmConfig();
+      setEm();
+      var expected = {
+        html: 'testHtml',
+        components: '{"test":1}',
+      };
+      expect(obj.store(1)).toEqual(expected);
+    });
+
+    it('Store and load data', function() {
+      setSmConfig();
+      setEm();
+      obj.store();
+      expect(obj.load()).toEqual({test: 1});
+    });
+
+    it('Wrapper exists', function() {
+      expect(obj.getWrapper()).toExist();
+    });
+
+    it('No components inside', function() {
+      expect(obj.getComponents().length).toEqual(0);
+    });
+
+    it('Add new component', function() {
+      var comp = obj.addComponent({});
+      expect(obj.getComponents().length).toEqual(1);
+    });
+
+    it('Add more components at once', function() {
+      var comp = obj.addComponent([{},{}]);
+      expect(obj.getComponents().length).toEqual(2);
+    });
+
+    it('Render wrapper', function() {
+      expect(obj.render()).toExist();
+    });
+  });
+
+  ComponentModels.run();
+  ComponentView.run();
+  ComponentsView.run();
+  ComponentTextView.run();
+  ComponentImageView.run();
+
+});
diff --git a/test/specs/dom_components/main.js b/test/specs/dom_components/main.js
deleted file mode 100644
index 86455cdaf..000000000
--- a/test/specs/dom_components/main.js
+++ /dev/null
@@ -1,125 +0,0 @@
-define(function(require, exports, module){
-  'use strict';
-  var DomComponents = require('DomComponents');
-  var ComponentImageView = require('undefined');
-  var utils = require('./../test_utils.js');
-
-		describe('DOM Components', function() {
-
-			describe('Main', function() {
-
-				var obj;
-				var config;
-				var storagMock = utils.storageMock();
-				var editorModel = {
-					config: {
-						loadCompsOnRender: 0,
-					},
-					get: function(){return;},
-					getHtml: function(){return 'testHtml';},
-					getComponents: function(){return {test: 1};},
-					getCacheLoad: function(){
-						return storagMock.load();
-					}
-				};
-				// Methods
-				var setSmConfig = function(){
-					config.stm = storagMock;
-					config.stm.getConfig =  function(){
-						return {
-							storeHtml: 1,
-							storeComponents: 1,
-						}
-					};
-				};
-				var setEm = function(){
-					config.em = editorModel;
-				}
-
-
-				beforeEach(function () {
-					config = {};
-					obj = new DomComponents().init(config);
-				});
-
-				afterEach(function () {
-					delete obj;
-				});
-
-				it('Object exists', function() {
-					DomComponents.should.be.exist;
-				});
-
-				it('storageKey returns array', function() {
-					obj.storageKey().should.be.instanceOf(Array);
-				});
-
-				it('storageKey returns correct composition', function() {
-					config.stm = {
-						getConfig: function(){
-							return {
-								storeHtml: 1,
-								storeComponents: 1,
-							}
-						}
-					};
-					obj.storageKey().should.eql(['html', 'components']);
-				});
-
-				it('Store data', function() {
-					setSmConfig();
-					setEm();
-					var expected = {
-						html: 'testHtml',
-						components: '{"test":1}',
-					};
-					obj.store(1).should.deep.equal(expected);
-				});
-
-				it('Store and load data', function() {
-					setSmConfig();
-					setEm();
-					obj.store();
-					// Load object between html and components
-					obj.load().should.deep.equal({test: 1});
-				});
-
-				it('Wrapper exists', function() {
-					obj.getWrapper().should.not.be.empty;
-				});
-
-				it('No components inside', function() {
-					obj.getComponents().length.should.equal(0);
-				});
-
-				it('Add new component', function() {
-					var comp = obj.addComponent({});
-					obj.getComponents().length.should.equal(1);
-				});
-
-				it('Add more components at once', function() {
-					var comp = obj.addComponent([{},{}]);
-					obj.getComponents().length.should.equal(2);
-				});
-
-				it('Render wrapper', function() {
-					obj.render().should.be.ok;
-				});
-
-				it.skip('Add components at init', function() {
-					obj = new DomComponents().init({
-						components : [{}, {}, {}]
-					});
-					obj.getComponents().length.should.equal(3);
-				});
-
-			});
-
-			ComponentModels.run();
-			ComponentView.run();
-			ComponentsView.run();
-			ComponentTextView.run();
-			ComponentImageView.run();
-
-		});
-});
\ No newline at end of file
diff --git a/test/specs/dom_components/model/Component.js b/test/specs/dom_components/model/Component.js
index d9d746220..48f7b0dda 100644
--- a/test/specs/dom_components/model/Component.js
+++ b/test/specs/dom_components/model/Component.js
@@ -1,285 +1,281 @@
-define(function(require, exports, module){
-  'use strict';
-  var DomComponents = require('DomComponents');
-  var Component = require('DomComponents/model/Component');
-  var ComponentImage = require('DomComponents/model/ComponentImage');
-  var ComponentText = require('DomComponents/model/ComponentText');
-  var ComponentLink = require('DomComponents/model/ComponentLink');
-  var ComponentMap = require('DomComponents/model/ComponentMap');
-  var ComponentVideo = require('DomComponents/model/ComponentVideo');
-  var Components = require('DomComponents/model/Components');
-
-    module.exports = {
-      run : function(){
-          var obj;
-          var dcomp;
-          var compOpts;
-
-          describe('Component', function() {
-
-            beforeEach(function () {
-              obj = new Component();
-              dcomp = new DomComponents();
-              compOpts = {
-                defaultTypes: dcomp.componentTypes,
-              };
-            });
-
-            afterEach(function () {
-              delete obj;
-            });
-
-            it('Has no children', function() {
-              obj.get('components').length.should.equal(0);
-            });
-
-            it.skip('Clones correctly', function() {
-              var sAttr = obj.attributes;
-              var cloned = obj.clone();
-              var eAttr = cloned.attributes;
-              eAttr.components = {};
-              sAttr.components = {};
-              eAttr.traits = {};
-              sAttr.traits = {};
-              sAttr.should.deep.equal(eAttr);
-            });
-
-            it('Clones correctly with traits', function() {
-              obj.get('traits').at(0).set('value', 'testTitle');
-              var cloned = obj.clone();
-              cloned.set('stylable', 0);
-              cloned.get('traits').at(0).set('value', 'testTitle2');
-              obj.get('traits').at(0).get('value').should.equal('testTitle');
-              obj.get('stylable').should.equal(true);
-            });
-
-            it('Has expected name', function() {
-              obj.getName().should.equal('Box');
-            });
-
-            it('Has expected name 2', function() {
-              obj.cid = 'c999';
-              obj.set('type','testType');
-              obj.getName().should.equal('TestType');
-            });
-
-            it('Component toHTML', function() {
-              obj.toHTML().should.equal('<div></div>');
-            });
-
-            it('Component toHTML with attributes', function() {
-              obj = new Component({
-                tagName: 'article',
-                attributes: {
-                  'data-test1': 'value1',
-                  'data-test2': 'value2'
-                }
-              });
-              obj.toHTML().should.equal('<article data-test1="value1" data-test2="value2"></article>');
-            });
-
-            it('Component toHTML with classes', function() {
-              obj = new Component({
-                tagName: 'article'
-              });
-              ['class1', 'class2'].forEach(function(item){
-                obj.get('classes').add({name: item});
-              });
-              obj.toHTML().should.equal('<article class="class1 class2"></article>');
-            });
-
-            it('Component toHTML with children', function() {
-              obj = new Component({tagName: 'article'}, compOpts);
-              obj.get('components').add({tagName: 'span'});
-              obj.toHTML().should.equal('<article><span></span></article>');
-            });
-
-            it('Component toHTML with more children', function() {
-              obj = new Component({tagName: 'article'}, compOpts);
-              obj.get('components').add([{tagName: 'span'}, {tagName: 'div'}]);
-              obj.toHTML().should.equal('<article><span></span><div></div></article>');
-            });
-
-            it('Component toHTML with no closing tag', function() {
-              obj = new Component({void: 1});
-              obj.toHTML().should.equal('<div/>');
-            });
-
-            it('Component parse empty div', function() {
-              var el = document.createElement('div');
-              obj = Component.isComponent(el);
-              obj.should.deep.equal({tagName: 'div'});
-            });
-
-            it('Component parse span', function() {
-              var el = document.createElement('span');
-              obj = Component.isComponent(el);
-              obj.should.deep.equal({tagName: 'span'});
-            });
-
-        });
-
-        describe('Image Component', function() {
-
-            beforeEach(function () {
-              obj = new ComponentImage();
-            });
-
-            afterEach(function () {
-              delete obj;
-            });
-
-            it('Has src property', function() {
-              obj.has('src').should.equal(true);
-            });
-
-            it('Not droppable', function() {
-              obj.get('droppable').should.equal(false);
-            });
-
-            it('ComponentImage toHTML', function() {
-              obj = new ComponentImage();
-              obj.toHTML().should.equal('<img/>');
-            });
-
-            it('Component toHTML with attributes', function() {
-              obj = new ComponentImage({
-                attributes: {'alt': 'AltTest'},
-                src: 'testPath'
-              });
-              obj.toHTML().should.equal('<img alt="AltTest" src="testPath"/>');
-            });
-
-            it('Refuse not img element', function() {
-              var el = document.createElement('div');
-              obj = ComponentImage.isComponent(el);
-              obj.should.equal('');
-            });
-
-            it('Component parse img element', function() {
-              var el = document.createElement('img');
-              obj = ComponentImage.isComponent(el);
-              obj.should.deep.equal({type: 'image'});
-            });
-
-            it('Component parse img element with src', function() {
-              var el = document.createElement('img');
-              el.src = 'http://localhost/';
-              obj = ComponentImage.isComponent(el);
-              obj.should.deep.equal({type: 'image'});
-            });
-
-        });
-
-        describe('Text Component', function() {
-
-            beforeEach(function () {
-              obj  = new ComponentText();
-            });
-
-            afterEach(function () {
-              delete obj;
-            });
-
-            it('Has content property', function() {
-              obj.has('content').should.equal(true);
-            });
-
-            it('Not droppable', function() {
-              obj.get('droppable').should.equal(false);
-            });
-
-            it('Component toHTML with attributes', function() {
-              obj = new ComponentText({
-                attributes: {'data-test': 'value'},
-                content: 'test content'
-              });
-              obj.toHTML().should.equal('<div data-test="value">test content</div>');
-            });
+const DomComponents = require('dom_components');
+const Component = require('dom_components/model/Component');
+const ComponentImage = require('dom_components/model/ComponentImage');
+const ComponentText = require('dom_components/model/ComponentText');
+const ComponentLink = require('dom_components/model/ComponentLink');
+const ComponentMap = require('dom_components/model/ComponentMap');
+const ComponentVideo = require('dom_components/model/ComponentVideo');
+const Components = require('dom_components/model/Components');
+
+module.exports = {
+  run : function(){
+      var obj;
+      var dcomp;
+      var compOpts;
+
+      describe('Component', function() {
+
+        beforeEach(function () {
+          obj = new Component();
+          dcomp = new DomComponents();
+          compOpts = {
+            defaultTypes: dcomp.componentTypes,
+          };
+        });
 
+        afterEach(function () {
+          obj = null;
         });
 
-        describe('Link Component', function() {
+        it('Has no children', function() {
+          expect(obj.get('components').length).toEqual(0);
+        });
 
-          it('Component parse a element', function() {
-            var el = document.createElement('a');
-            obj = ComponentLink.isComponent(el);
-            obj.should.deep.equal({type: 'link'});
-          });
+        it('Clones correctly', function() {
+          var sAttr = obj.attributes;
+          var cloned = obj.clone();
+          var eAttr = cloned.attributes;
+          eAttr.components = {};
+          sAttr.components = {};
+          eAttr.traits = {};
+          sAttr.traits = {};
+          expect(sAttr.length).toEqual(eAttr.length);
+        });
+
+        it('Clones correctly with traits', function() {
+          obj.get('traits').at(0).set('value', 'testTitle');
+          var cloned = obj.clone();
+          cloned.set('stylable', 0);
+          cloned.get('traits').at(0).set('value', 'testTitle2');
+          expect(obj.get('traits').at(0).get('value')).toEqual('testTitle');
+          expect(obj.get('stylable')).toEqual(true);
+        });
+
+        it('Has expected name', function() {
+          expect(obj.getName()).toEqual('Box');
+        });
 
+        it('Has expected name 2', function() {
+          obj.cid = 'c999';
+          obj.set('type','testType');
+          expect(obj.getName()).toEqual('TestType');
         });
 
-        describe('Map Component', function() {
+        it('Component toHTML', function() {
+          expect(obj.toHTML()).toEqual('<div></div>');
+        });
 
-          it('Component parse map iframe', function() {
-            var src = 'https://maps.google.com/maps?&q=London,UK&z=11&t=q&output=embed';
-            var el = $('<iframe src="' + src + '"></iframe>');
-            obj = ComponentMap.isComponent(el.get(0));
-            obj.should.deep.equal({type: 'map', src: src});
+        it('Component toHTML with attributes', function() {
+          obj = new Component({
+            tagName: 'article',
+            attributes: {
+              'data-test1': 'value1',
+              'data-test2': 'value2'
+            }
           });
+          expect(obj.toHTML()).toEqual('<article data-test1="value1" data-test2="value2"></article>');
+        });
 
-          it('Component parse not map iframe', function() {
-            var el = $('<iframe src="https://www.youtube.com/watch?v=jNQXAC9IVRw"></iframe>');
-            obj = ComponentMap.isComponent(el.get(0));
-            obj.should.equal('');
+        it('Component toHTML with classes', function() {
+          obj = new Component({
+            tagName: 'article'
           });
+          ['class1', 'class2'].forEach(function(item){
+            obj.get('classes').add({name: item});
+          });
+          expect(obj.toHTML()).toEqual('<article class="class1 class2"></article>');
+        });
 
+        it('Component toHTML with children', function() {
+          obj = new Component({tagName: 'article'}, compOpts);
+          obj.get('components').add({tagName: 'span'});
+          expect(obj.toHTML()).toEqual('<article><span></span></article>');
         });
 
-        describe('Video Component', function() {
+        it('Component toHTML with more children', function() {
+          obj = new Component({tagName: 'article'}, compOpts);
+          obj.get('components').add([{tagName: 'span'}, {tagName: 'div'}]);
+          expect(obj.toHTML()).toEqual('<article><span></span><div></div></article>');
+        });
 
-          it('Component parse video', function() {
-            var src = 'http://localhost/';
-            var el = $('<video src="' + src + '"></video>');
-            obj = ComponentVideo.isComponent(el.get(0));
-            obj.should.deep.equal({type: 'video'}); //src: src
-          });
+        it('Component toHTML with no closing tag', function() {
+          obj = new Component({void: 1});
+          expect(obj.toHTML()).toEqual('<div/>');
+        });
 
-          it('Component parse youtube video iframe', function() {
-            var src = 'http://www.youtube.com/embed/jNQXAC9IVRw?';
-            var el = $('<iframe src="' + src + '"></video>');
-            obj = ComponentVideo.isComponent(el.get(0));
-            obj.should.deep.equal({type: 'video', provider: 'yt', src: src});
-          });
+        it('Component parse empty div', function() {
+          var el = document.createElement('div');
+          obj = Component.isComponent(el);
+          expect(obj).toEqual({tagName: 'div'});
+        });
+
+        it('Component parse span', function() {
+          var el = document.createElement('span');
+          obj = Component.isComponent(el);
+          expect(obj).toEqual({tagName: 'span'});
+        });
+
+    });
+
+    describe('Image Component', function() {
+
+        beforeEach(function () {
+          obj = new ComponentImage();
+        });
+
+        afterEach(function () {
+          obj = null;
+        });
+
+        it('Has src property', function() {
+          expect(obj.has('src')).toEqual(true);
+        });
+
+        it('Not droppable', function() {
+          expect(obj.get('droppable')).toEqual(false);
+        });
+
+        it('ComponentImage toHTML', function() {
+          obj = new ComponentImage();
+          expect(obj.toHTML()).toEqual('<img/>');
+        });
 
-          it('Component parse vimeo video iframe', function() {
-            var src = 'http://player.vimeo.com/video/2?';
-            var el = $('<iframe src="' + src + '"></video>');
-            obj = ComponentVideo.isComponent(el.get(0));
-            obj.should.deep.equal({type: 'video', provider: 'vi', src: src});
+        it('Component toHTML with attributes', function() {
+          obj = new ComponentImage({
+            attributes: {'alt': 'AltTest'},
+            src: 'testPath'
           });
+          expect(obj.toHTML()).toEqual('<img alt="AltTest" src="testPath"/>');
+        });
 
+        it('Refuse not img element', function() {
+          var el = document.createElement('div');
+          obj = ComponentImage.isComponent(el);
+          expect(obj).toEqual('');
         });
 
-        describe('Components', function() {
+        it('Component parse img element', function() {
+          var el = document.createElement('img');
+          obj = ComponentImage.isComponent(el);
+          expect(obj).toEqual({type: 'image'});
+        });
+
+        it('Component parse img element with src', function() {
+          var el = document.createElement('img');
+          el.src = 'http://localhost/';
+          obj = ComponentImage.isComponent(el);
+          expect(obj).toEqual({type: 'image'});
+        });
+
+    });
+
+    describe('Text Component', function() {
+
+        beforeEach(function () {
+          obj  = new ComponentText();
+        });
+
+        afterEach(function () {
+          obj = null;
+        });
+
+        it('Has content property', function() {
+          expect(obj.has('content')).toEqual(true);
+        });
+
+        it('Not droppable', function() {
+          expect(obj.get('droppable')).toEqual(false);
+        });
+
+        it('Component toHTML with attributes', function() {
+          obj = new ComponentText({
+            attributes: {'data-test': 'value'},
+            content: 'test content'
+          });
+          expect(obj.toHTML()).toEqual('<div data-test="value">test content</div>');
+        });
 
-            beforeEach(function () {
-              dcomp = new DomComponents();
-              compOpts = {
-                defaultTypes: dcomp.componentTypes,
-              }
-            });
+    });
 
-            it('Creates component correctly', function() {
-              var c = new Components({}, compOpts);
-              var m = c.add({});
-              m.should.be.an.instanceOf(Component);
-            });
+    describe('Link Component', function() {
 
-            it('Creates image component correctly', function() {
-              var c = new Components({}, compOpts);
-              var m = c.add({ type: 'image' });
-              m.should.be.an.instanceOf(ComponentImage);
-            });
+      it('Component parse a element', function() {
+        var el = document.createElement('a');
+        obj = ComponentLink.isComponent(el);
+        expect(obj).toEqual({type: 'link'});
+      });
 
-            it('Creates text component correctly', function() {
-              var c = new Components({}, compOpts);
-              var m = c.add({ type: 'text' });
-              m.should.be.an.instanceOf(ComponentText);
-            });
+    });
+
+    describe('Map Component', function() {
+
+      it('Component parse map iframe', function() {
+        var src = 'https://maps.google.com/maps?&q=London,UK&z=11&t=q&output=embed';
+        var el = $('<iframe src="' + src + '"></iframe>');
+        obj = ComponentMap.isComponent(el.get(0));
+        expect(obj).toEqual({type: 'map', src: src});
+      });
+
+      it('Component parse not map iframe', function() {
+        var el = $('<iframe src="https://www.youtube.com/watch?v=jNQXAC9IVRw"></iframe>');
+        obj = ComponentMap.isComponent(el.get(0));
+        expect(obj).toEqual('');
+      });
+
+    });
+
+    describe('Video Component', function() {
+
+      it('Component parse video', function() {
+        var src = 'http://localhost/';
+        var el = $('<video src="' + src + '"></video>');
+        obj = ComponentVideo.isComponent(el.get(0));
+        expect(obj).toEqual({type: 'video', src: src});
+      });
+
+      it('Component parse youtube video iframe', function() {
+        var src = 'http://www.youtube.com/embed/jNQXAC9IVRw?';
+        var el = $('<iframe src="' + src + '"></video>');
+        obj = ComponentVideo.isComponent(el.get(0));
+        expect(obj).toEqual({type: 'video', provider: 'yt', src: src});
+      });
+
+      it('Component parse vimeo video iframe', function() {
+        var src = 'http://player.vimeo.com/video/2?';
+        var el = $('<iframe src="' + src + '"></video>');
+        obj = ComponentVideo.isComponent(el.get(0));
+        expect(obj).toEqual({type: 'video', provider: 'vi', src: src});
+      });
+
+    });
+
+    describe('Components', function() {
+
+        beforeEach(function () {
+          dcomp = new DomComponents();
+          compOpts = {
+            defaultTypes: dcomp.componentTypes,
+          }
+        });
+
+        it('Creates component correctly', function() {
+          var c = new Components({}, compOpts);
+          var m = c.add({});
+          expect(m instanceof Component).toEqual(true);
+        });
+
+        it('Creates image component correctly', function() {
+          var c = new Components({}, compOpts);
+          var m = c.add({ type: 'image' });
+          expect(m instanceof ComponentImage).toEqual(true);
+        });
 
+        it('Creates text component correctly', function() {
+          var c = new Components({}, compOpts);
+          var m = c.add({ type: 'text' });
+          expect(m instanceof ComponentText).toEqual(true);
         });
-      }
-    };
 
-});
\ No newline at end of file
+    });
+  }
+};
diff --git a/test/specs/dom_components/view/ComponentImageView.js b/test/specs/dom_components/view/ComponentImageView.js
index 9c741ab69..a9169d708 100644
--- a/test/specs/dom_components/view/ComponentImageView.js
+++ b/test/specs/dom_components/view/ComponentImageView.js
@@ -1,59 +1,55 @@
-define(function(require, exports, module){
-  'use strict';
-  var ComponentImageView = require('undefined');
-  var Component = require('DomComponents/model/Component');
-
-    module.exports = {
-      run : function(){
-
-          describe('ComponentImageView', function() {
-
-            var $fixtures;
-            var $fixture;
-            var model;
-            var view;
-
-            before(function () {
-              $fixtures = $("#fixtures");
-              $fixture = $('<div class="components-fixture"></div>');
-            });
-
-            beforeEach(function () {
-              model = new Component();
-              view = new ComponentImageView({
-                model: model
-              });
-              $fixture.empty().appendTo($fixtures);
-              $fixture.html(view.render().el);
-            });
-
-            afterEach(function () {
-              view.remove();
-            });
-
-            after(function () {
-              $fixture.remove();
-            });
-
-            it('Component empty', function() {
-              view.el.getAttribute('onmousedown').should.equal('return false');
-              view.el.getAttribute('class').should.equal(view.classEmpty);
-            });
-
-            it('TagName is <img>', function() {
-              view.el.tagName.should.equal('IMG');
-            });
-
-            it('Update src attribute', function() {
-              model.set('src','./');
-              view.el.getAttribute('src').should.equal('./');
-            });
-
-            it('Renders correctly', function() {
-              view.render().should.be.ok;
-            });
-        });
-      }
-    };
-
-});
\ No newline at end of file
+const ComponentImageView = require('dom_components/view/ComponentImageView');
+const Component = require('dom_components/model/Component');
+
+module.exports = {
+  run : function(){
+
+      describe('ComponentImageView', function() {
+
+        var $fixtures;
+        var $fixture;
+        var model;
+        var view;
+
+        before(function () {
+          $fixtures = $("#fixtures");
+          $fixture = $('<div class="components-fixture"></div>');
+        });
+
+        beforeEach(function () {
+          model = new Component();
+          view = new ComponentImageView({
+            model: model
+          });
+          $fixture.empty().appendTo($fixtures);
+          $fixture.html(view.render().el);
+        });
+
+        afterEach(function () {
+          view.remove();
+        });
+
+        after(function () {
+          $fixture.remove();
+        });
+
+        it('Component empty', function() {
+          expect(view.el.getAttribute('onmousedown')).toEqual('return false');
+          expect(view.el.getAttribute('class')).toEqual(view.classEmpty);
+        });
+
+        it('TagName is <img>', function() {
+          expect(view.el.tagName).toEqual('IMG');
+        });
+
+        it('Update src attribute', function() {
+          model.set('src', './');
+          expect(view.el.getAttribute('src')).toEqual('./');
+        });
+
+        it('Renders correctly', function() {
+          expect(view.render()).toExist();
+        });
+    });
+  }
+};
diff --git a/test/specs/dom_components/view/ComponentTextView.js b/test/specs/dom_components/view/ComponentTextView.js
index c023307eb..72b676d3c 100644
--- a/test/specs/dom_components/view/ComponentTextView.js
+++ b/test/specs/dom_components/view/ComponentTextView.js
@@ -1,59 +1,55 @@
-define(function(require, exports, module){
-  'use strict';
-  var ComponentTextView = require('undefined');
-  var Component = require('DomComponents/model/Component');
-
-    module.exports = {
-      run : function(){
-
-          describe('ComponentTextView', function() {
-
-            var $fixtures;
-            var $fixture;
-            var model;
-            var view;
-
-            before(function () {
-              $fixtures = $("#fixtures");
-              $fixture = $('<div class="components-fixture"></div>');
-            });
-
-            beforeEach(function () {
-              model = new Component();
-              view = new ComponentTextView({
-                model: model
-              });
-              $fixture.empty().appendTo($fixtures);
-              $fixture.html(view.render().el);
-            });
-
-            afterEach(function () {
-              view.remove();
-            });
-
-            after(function () {
-              $fixture.remove();
-            });
-
-            it('Component empty', function() {
-              $fixture.html().should.equal('<div data-highlightable="1"></div>');
-            });
-
-            it('Input content is stored in model', function() {
-              //view.enableEditing();
-              view.el.innerHTML = 'test';
-              //view.disableEditing();
-              //model.get('content').should.equal('test');
-            });
-
-            it('Init with content', function() {
-              model = new Component({ content: 'test' });
-              view = new ComponentTextView({ model: model });
-              view.render().el.innerHTML.should.equal('test');
-            });
+const ComponentTextView = require('dom_components/view/ComponentTextView');
+const Component = require('dom_components/model/Component');
 
+module.exports = {
+  run : function(){
+
+      describe('ComponentTextView', function() {
+
+        var $fixtures;
+        var $fixture;
+        var model;
+        var view;
+
+        before(function () {
+          $fixtures = $("#fixtures");
+          $fixture = $('<div class="components-fixture"></div>');
+        });
+
+        beforeEach(function () {
+          model = new Component();
+          view = new ComponentTextView({
+            model: model
+          });
+          $fixture.empty().appendTo($fixtures);
+          $fixture.html(view.render().el);
+        });
+
+        afterEach(function () {
+          view.remove();
+        });
+
+        after(function () {
+          $fixture.remove();
+        });
+
+        it('Component empty', function() {
+          expect($fixture.html()).toEqual('<div data-highlightable="1"></div>');
+        });
+
+        it('Input content is stored in model', function() {
+          //view.enableEditing();
+          view.el.innerHTML = 'test';
+          //view.disableEditing();
+          //model.get('content').should.equal('test');
+        });
+
+        it('Init with content', function() {
+          model = new Component({ content: 'test' });
+          view = new ComponentTextView({ model: model });
+          expect(view.render().el.innerHTML).toEqual('test');
         });
-      }
-    };
 
-});
\ No newline at end of file
+    });
+  }
+};
diff --git a/test/specs/dom_components/view/ComponentV.js b/test/specs/dom_components/view/ComponentV.js
index bfc23eca8..fe1493bf7 100644
--- a/test/specs/dom_components/view/ComponentV.js
+++ b/test/specs/dom_components/view/ComponentV.js
@@ -1,143 +1,139 @@
-define(function(require, exports, module){
-  'use strict';
-  var ComponentView = require('undefined');
-  var Component = require('DomComponents/model/Component');
-  var DomComponents = require('DomComponents');
-
-    module.exports = {
-      run : function(){
-
-          describe('ComponentView', function() {
-
-            var $fixtures;
-            var $fixture;
-            var model;
-            var view;
-            var hClass = 'hc-state';
-            var dcomp;
-            var compOpts;
-
-            before(function () {
-              $fixtures = $("#fixtures");
-              $fixture = $('<div class="components-fixture"></div>');
-            });
-
-            beforeEach(function () {
-              dcomp = new DomComponents();
-              compOpts = {
-                defaultTypes: dcomp.componentTypes,
-              };
-              model = new Component();
-              view = new ComponentView({
-                model: model
-              });
-              $fixture.empty().appendTo($fixtures);
-              $fixture.html(view.render().el);
-            });
-
-            afterEach(function () {
-              view.remove();
-            });
-
-            after(function () {
-              $fixture.remove();
-            });
-
-            it('Component empty', function() {
-              $fixture.html().should.equal('<div data-highlightable="1"></div>');
-            });
-
-            it('Add helper class on update of state', function() {
-              model.set('state', 'test');
-              $fixture.html().should.equal('<div data-highlightable="1" class="' + hClass + '"></div>');
-            });
-
-            it('Clean form helper state', function() {
-              model.set('state', 'test');
-              model.set('state', '');
-              $fixture.html().should.equal('<div data-highlightable="1" class=""></div>');
-            });
-
-            it('Add helper class on status update', function() {
-              model.set('status', 'selected');
-              $fixture.html().should.equal('<div data-highlightable="1" class="selected"></div>');
-            });
-
-            it('Get string of classes', function() {
-              model.set('attributes', { class: ['test', 'test2']});
-              view.getClasses().should.equal('test test2');
-            });
-
-            it('Update attributes', function() {
-              model.set('attributes', {
-                title: 'value',
-                'data-test': 'value2',
-              });
-              view.el.getAttribute('title').should.equal('value');
-              view.el.getAttribute('data-test').should.equal('value2');
-            });
-
-            it('Update style', function() {
-              model.set('style', {
-                color: 'red',
-                float: 'left'
-              });
-              view.el.getAttribute('style').should.equal('color:red;float:left;');
-            });
-
-            it('Clean style', function() {
-              model.set('style', { color: 'red'});
-              model.set('style', {});
-              view.el.getAttribute('style').should.equal('');
-            });
-
-            it('Get style string', function() {
-              model.set('style',  {
-                color: 'red',
-                float: 'left'
-              });
-              view.getStyleString().should.equal('color:red;float:left;');
-            });
-
-            it('Add class', function() {
-              model.get('classes').add({name: 'test'});
-               view.el.getAttribute('class').should.equal('test');
-            });
-
-            it('Add classes', function() {
-              model.get('classes').add([{name: 'test'}, {name: 'test2'}]);
-              view.el.getAttribute('class').should.equal('test test2');
-            });
-
-            it('Update on remove of some class', function() {
-              var cls1 = model.get('classes').add({name: 'test'});
-              var cls12 = model.get('classes').add({name: 'test2'});
-              model.get('classes').remove(cls1);
-              view.el.getAttribute('class').should.equal('test2');
-            });
-
-            it('Init with different tag', function() {
-              model = new Component({ tagName: 'span' });
-              view = new ComponentView({ model: model });
-              view.render().el.tagName.should.equal('SPAN');
-            });
-
-            it('Init with nested components', function() {
-              model = new Component({
-                components: [
-                  { tagName: 'span'},
-                  { attributes: { title: 'test'}}
-                ]
-              }, compOpts);
-              view = new ComponentView({
-                model: model,
-                defaultTypes: dcomp.componentTypes,
-              });
-              view.render().$el.html().should.equal('<span data-highlightable="1"></span><div title="test" data-highlightable="1"></div>');
-            });
-
-        });
-      }
-    };
-
-});
\ No newline at end of file
+const ComponentView = require('dom_components/view/ComponentView');
+const Component = require('dom_components/model/Component');
+const DomComponents = require('dom_components');
+
+module.exports = {
+  run : function(){
+
+      describe('ComponentView', function() {
+
+        var $fixtures;
+        var $fixture;
+        var model;
+        var view;
+        var hClass = 'hc-state';
+        var dcomp;
+        var compOpts;
+
+        before(function () {
+          $fixtures = $("#fixtures");
+          $fixture = $('<div class="components-fixture"></div>');
+        });
+
+        beforeEach(function () {
+          dcomp = new DomComponents();
+          compOpts = {
+            defaultTypes: dcomp.componentTypes,
+          };
+          model = new Component();
+          view = new ComponentView({
+            model: model
+          });
+          $fixture.empty().appendTo($fixtures);
+          $fixture.html(view.render().el);
+        });
+
+        afterEach(function () {
+          view.remove();
+        });
+
+        after(function () {
+          $fixture.remove();
+        });
+
+        it('Component empty', function() {
+          expect($fixture.html()).toEqual('<div data-highlightable="1"></div>');
+        });
+
+        it('Add helper class on update of state', function() {
+          model.set('state', 'test');
+          expect($fixture.html()).toEqual('<div data-highlightable="1" class="' + hClass + '"></div>');
+        });
+
+        it('Clean form helper state', function() {
+          model.set('state', 'test');
+          model.set('state', '');
+          expect($fixture.html()).toEqual('<div data-highlightable="1" class=""></div>');
+        });
+
+        it('Add helper class on status update', function() {
+          model.set('status', 'selected');
+          expect($fixture.html()).toEqual('<div data-highlightable="1" class="selected"></div>');
+        });
+
+        it('Get string of classes', function() {
+          model.set('attributes', { class: ['test', 'test2']});
+          expect(view.getClasses()).toEqual('test test2');
+        });
+
+        it('Update attributes', function() {
+          model.set('attributes', {
+            title: 'value',
+            'data-test': 'value2',
+          });
+          expect(view.el.getAttribute('title')).toEqual('value');
+          expect(view.el.getAttribute('data-test')).toEqual('value2');
+        });
+
+        it('Update style', function() {
+          model.set('style', {
+            color: 'red',
+            float: 'left'
+          });
+          expect(view.el.getAttribute('style')).toEqual('color:red;float:left;');
+        });
+
+        it('Clean style', function() {
+          model.set('style', { color: 'red'});
+          model.set('style', {});
+          expect(view.el.getAttribute('style')).toEqual('');
+        });
+
+        it('Get style string', function() {
+          model.set('style',  {
+            color: 'red',
+            float: 'left'
+          });
+          expect(view.getStyleString()).toEqual('color:red;float:left;');
+        });
+
+        it('Add class', function() {
+          model.get('classes').add({name: 'test'});
+          expect(view.el.getAttribute('class')).toEqual('test');
+        });
+
+        it('Add classes', function() {
+          model.get('classes').add([{name: 'test'}, {name: 'test2'}]);
+          expect(view.el.getAttribute('class')).toEqual('test test2');
+        });
+
+        it('Update on remove of some class', function() {
+          var cls1 = model.get('classes').add({name: 'test'});
+          var cls12 = model.get('classes').add({name: 'test2'});
+          model.get('classes').remove(cls1);
+          expect(view.el.getAttribute('class')).toEqual('test2');
+        });
+
+        it('Init with different tag', function() {
+          model = new Component({ tagName: 'span' });
+          view = new ComponentView({ model: model });
+          expect(view.render().el.tagName).toEqual('SPAN');
+        });
+
+        it('Init with nested components', function() {
+          model = new Component({
+            components: [
+              { tagName: 'span'},
+              { attributes: { title: 'test'}}
+            ]
+          }, compOpts);
+          view = new ComponentView({
+            model: model,
+            defaultTypes: dcomp.componentTypes,
+          });
+          expect(view.render().$el.html()).toEqual('<span data-highlightable="1"></span><div title="test" data-highlightable="1"></div>');
+        });
+
+    });
+  }
+};
diff --git a/test/specs/dom_components/view/ComponentsView.js b/test/specs/dom_components/view/ComponentsView.js
index ea32f7bdd..ec96f8746 100644
--- a/test/specs/dom_components/view/ComponentsView.js
+++ b/test/specs/dom_components/view/ComponentsView.js
@@ -1,64 +1,60 @@
-define(function(require, exports, module){
-  'use strict';
-  var DomComponents = require('DomComponents');
-  var ComponentsView = require('undefined');
-  var Components = require('DomComponents/model/Components');
-
-    module.exports = {
-      run : function(){
-          describe('ComponentsView', function() {
-
-            var $fixtures;
-            var $fixture;
-            var model;
-            var view;
-            var dcomp;
-            var compOpts;
-
-            before(function () {
-              $fixtures = $("#fixtures");
-              $fixture = $('<div class="components-fixture"></div>');
-            });
-
-            beforeEach(function () {
-              dcomp = new DomComponents();
-              compOpts = {
-                defaultTypes: dcomp.componentTypes,
-              };
-              model = new Components([], compOpts);
-              view = new ComponentsView({
-                collection: model,
-                defaultTypes: dcomp.componentTypes,
-              });
-              $fixture.empty().appendTo($fixtures);
-              $fixture.html(view.render().el);
-            });
+const DomComponents = require('dom_components');
+const ComponentsView = require('dom_components/view/ComponentsView');
+const Components = require('dom_components/model/Components');
+
+module.exports = {
+  run : function() {
+      describe('ComponentsView', function() {
+
+        var $fixtures;
+        var $fixture;
+        var model;
+        var view;
+        var dcomp;
+        var compOpts;
+
+        before(function () {
+          $fixtures = $("#fixtures");
+          $fixture = $('<div class="components-fixture"></div>');
+        });
 
-            afterEach(function () {
-              view.collection.reset();
-            });
+        beforeEach(function () {
+          dcomp = new DomComponents();
+          compOpts = {
+            defaultTypes: dcomp.componentTypes,
+          };
+          model = new Components([], compOpts);
+          view = new ComponentsView({
+            collection: model,
+            defaultTypes: dcomp.componentTypes,
+          });
+          $fixture.empty().appendTo($fixtures);
+          $fixture.html(view.render().el);
+        });
 
-            after(function () {
-              $fixture.remove();
-            });
+        afterEach(function () {
+          view.collection.reset();
+        });
 
-            it("Collection is empty", function (){
-              view.$el.html().should.be.empty;
-            });
+        after(function () {
+          $fixture.remove();
+        });
 
-            it("Add new component", function (){
-              sinon.stub(view, "addToCollection");
-              view.collection.add({});
-              view.addToCollection.calledOnce.should.equal(true);
-            });
+        it("Collection is empty", function (){
+          expect(view.$el.html()).toNotExist();
+        });
 
-            it("Render new component", function (){
-              view.collection.add({});
-              view.$el.html().should.not.be.empty;
-            });
+        it("Add new component", function (){
+          sinon.stub(view, "addToCollection");
+          view.collection.add({});
+          expect(view.addToCollection.calledOnce).toEqual(true);
+        });
 
+        it("Render new component", function (){
+          view.collection.add({});
+          expect(view.$el.html()).toExist();
         });
-      }
-    };
 
-});
\ No newline at end of file
+    });
+  }
+};