Fix dom_components regressions

test/specs/dom_components/index.js

@@ -113,9 +113,12 @@ describe('DOM Components', () => {
   });
 
   ComponentModels.run();
-  ComponentView.run();
+
-  ComponentsView.run();
+  describe('Views', () => {
-  ComponentTextView.run();
+    ComponentView.run();
-  ComponentImageView.run();
+    ComponentsView.run();
+    ComponentTextView.run();
+    ComponentImageView.run();
+  });
 
 });

test/specs/dom_components/view/ComponentImageView.js

@@ -6,33 +6,22 @@ module.exports = {
 
       describe('ComponentImageView', () => {
 
-        var $fixtures;
-        var $fixture;
         var model;
         var view;
 
-        before(() => {
-          $fixtures = $("#fixtures");
-          $fixture = $('<div class="components-fixture"></div>');
-        });
-
         beforeEach(() => {
           model = new Component();
           view = new ComponentImageView({
             model
           });
-          $fixture.empty().appendTo($fixtures);
+          document.body.innerHTML = '<div id="fixtures"></div>';
-          $fixture.html(view.render().el);
+          document.body.querySelector('#fixtures').appendChild(view.render().el);
         });
 
         afterEach(() => {
           view.remove();
         });
 
-        after(() => {
-          $fixture.remove();
-        });
-
         it('Component empty', () => {
           expect(view.el.getAttribute('onmousedown')).toEqual('return false');
           expect(view.el.getAttribute('class')).toEqual(view.classEmpty);

test/specs/dom_components/view/ComponentTextView.js

@@ -6,35 +6,26 @@ module.exports = {
 
       describe('ComponentTextView', () => {
 
-        var $fixtures;
+        var fixtures;
-        var $fixture;
         var model;
         var view;
 
-        before(() => {
-          $fixtures = $("#fixtures");
-          $fixture = $('<div class="components-fixture"></div>');
-        });
-
         beforeEach(() => {
           model = new Component();
           view = new ComponentTextView({
             model
           });
-          $fixture.empty().appendTo($fixtures);
+          document.body.innerHTML = '<div id="fixtures"></div>';
-          $fixture.html(view.render().el);
+          fixtures = document.body.querySelector('#fixtures');
+          fixtures.appendChild(view.render().el);
         });
 
         afterEach(() => {
           view.remove();
         });
 
-        after(() => {
-          $fixture.remove();
-        });
-
         it('Component empty', () => {
-          expect($fixture.html()).toEqual('<div data-highlightable="1"></div>');
+          expect(fixtures.innerHTML).toEqual('<div data-highlightable="1"></div>');
         });
 
         it('Input content is stored in model', () => {
@@ -47,7 +38,8 @@ module.exports = {
         it('Init with content', () => {
           model = new Component({ content: 'test' });
           view = new ComponentTextView({ model });
-          expect(view.render().el.innerHTML).toEqual('test');
+          fixtures.appendChild(view.render().el);
+          expect(view.el.innerHTML).toEqual('test');
         });
 
     });

test/specs/dom_components/view/ComponentV.js

@@ -7,19 +7,13 @@ module.exports = {
 
       describe('ComponentView', () => {
 
-        var $fixtures;
+        var fixtures;
-        var $fixture;
         var model;
         var view;
         var hClass = 'hc-state';
         var dcomp;
         var compOpts;
 
-        before(() => {
-          $fixtures = $("#fixtures");
-          $fixture = $('<div class="components-fixture"></div>');
-        });
-
         beforeEach(() => {
           dcomp = new DomComponents();
           compOpts = {
@@ -29,36 +23,33 @@ module.exports = {
           view = new ComponentView({
             model
           });
-          $fixture.empty().appendTo($fixtures);
+          document.body.innerHTML = '<div id="fixtures"></div>';
-          $fixture.html(view.render().el);
+          fixtures = document.body.querySelector('#fixtures');
+          fixtures.appendChild(view.render().el);
         });
 
         afterEach(() => {
           view.remove();
         });
 
-        after(() => {
-          $fixture.remove();
-        });
-
         it('Component empty', () => {
-          expect($fixture.html()).toEqual('<div data-highlightable="1"></div>');
+          expect(fixtures.innerHTML).toEqual('<div data-highlightable="1"></div>');
         });
 
         it('Add helper class on update of state', () => {
           model.set('state', 'test');
-          expect($fixture.html()).toEqual('<div data-highlightable="1" class="' + hClass + '"></div>');
+          expect(fixtures.innerHTML).toEqual('<div data-highlightable="1" class="' + hClass + '"></div>');
         });
 
         it('Clean form helper state', () => {
           model.set('state', 'test');
           model.set('state', '');
-          expect($fixture.html()).toEqual('<div data-highlightable="1" class=""></div>');
+          expect(fixtures.innerHTML).toEqual('<div data-highlightable="1" class=""></div>');
         });
 
         it('Add helper class on status update', () => {
           model.set('status', 'selected');
-          expect($fixture.html()).toEqual('<div data-highlightable="1" class="selected"></div>');
+          expect(fixtures.innerHTML).toEqual('<div data-highlightable="1" class="selected"></div>');
         });
 
         it('Get string of classes', () => {
@@ -117,6 +108,8 @@ module.exports = {
         it('Init with different tag', () => {
           model = new Component({ tagName: 'span' });
           view = new ComponentView({ model });
+          fixtures.innerHTML = '';
+          fixtures.appendChild(view.render().el);
           expect(view.render().el.tagName).toEqual('SPAN');
         });
 
@@ -131,7 +124,9 @@ module.exports = {
             model,
             componentTypes: dcomp.componentTypes,
           });
-          expect(view.render().$el.html()).toEqual('<span data-highlightable="1"></span><div title="test" data-highlightable="1"></div>');
+          fixtures.innerHTML = '';
+          fixtures.appendChild(view.render().el);
+          expect(view.$el.html()).toEqual('<span data-highlightable="1"></span><div title="test" data-highlightable="1"></div>');
         });
 
     });

test/specs/dom_components/view/ComponentsView.js

@@ -13,11 +13,6 @@ module.exports = {
         var dcomp;
         var compOpts;
 
-        before(() => {
-          $fixtures = $("#fixtures");
-          $fixture = $('<div class="components-fixture"></div>');
-        });
-
         beforeEach(() => {
           dcomp = new DomComponents();
           compOpts = {
@@ -28,18 +23,14 @@ module.exports = {
             collection: model,
             componentTypes: dcomp.componentTypes,
           });
-          $fixture.empty().appendTo($fixtures);
+          document.body.innerHTML = '<div id="fixtures"></div>';
-          $fixture.html(view.render().el);
+          document.body.querySelector('#fixtures').appendChild(view.render().el);
         });
 
         afterEach(() => {
           view.collection.reset();
         });
 
-        after(() => {
-          $fixture.remove();
-        });
-
         it("Collection is empty", () => {
           expect(view.$el.html()).toNotExist();
         });