From 2043ff3df33e28af264c8c7aa452b0022551d4ef Mon Sep 17 00:00:00 2001
From: Artur Arseniev <artur.catch@hotmail.it>
Date: Tue, 26 Sep 2017 02:28:15 +0200
Subject: [PATCH] Fix dom_components regressions

---
 test/specs/dom_components/index.js            | 11 ++++---
 .../dom_components/view/ComponentImageView.js | 15 ++-------
 .../dom_components/view/ComponentTextView.js  | 22 +++++--------
 test/specs/dom_components/view/ComponentV.js  | 31 ++++++++-----------
 .../dom_components/view/ComponentsView.js     | 13 ++------
 5 files changed, 31 insertions(+), 61 deletions(-)

diff --git a/test/specs/dom_components/index.js b/test/specs/dom_components/index.js
index 9e7067047..cdae7b0ff 100644
--- a/test/specs/dom_components/index.js
+++ b/test/specs/dom_components/index.js
@@ -113,9 +113,12 @@ describe('DOM Components', () => {
   });
 
   ComponentModels.run();
-  ComponentView.run();
-  ComponentsView.run();
-  ComponentTextView.run();
-  ComponentImageView.run();
+
+  describe('Views', () => {
+    ComponentView.run();
+    ComponentsView.run();
+    ComponentTextView.run();
+    ComponentImageView.run();
+  });
 
 });
diff --git a/test/specs/dom_components/view/ComponentImageView.js b/test/specs/dom_components/view/ComponentImageView.js
index 6f642346d..540855624 100644
--- a/test/specs/dom_components/view/ComponentImageView.js
+++ b/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);
-          $fixture.html(view.render().el);
+          document.body.innerHTML = '<div id="fixtures"></div>';
+          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);
diff --git a/test/specs/dom_components/view/ComponentTextView.js b/test/specs/dom_components/view/ComponentTextView.js
index bc199c4b0..ea4c7c022 100644
--- a/test/specs/dom_components/view/ComponentTextView.js
+++ b/test/specs/dom_components/view/ComponentTextView.js
@@ -6,35 +6,26 @@ module.exports = {
 
       describe('ComponentTextView', () => {
 
-        var $fixtures;
-        var $fixture;
+        var fixtures;
         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);
-          $fixture.html(view.render().el);
+          document.body.innerHTML = '<div id="fixtures"></div>';
+          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');
         });
 
     });
diff --git a/test/specs/dom_components/view/ComponentV.js b/test/specs/dom_components/view/ComponentV.js
index 36b2f4da9..26bd5d0b9 100644
--- a/test/specs/dom_components/view/ComponentV.js
+++ b/test/specs/dom_components/view/ComponentV.js
@@ -7,19 +7,13 @@ module.exports = {
 
       describe('ComponentView', () => {
 
-        var $fixtures;
-        var $fixture;
+        var fixtures;
         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);
-          $fixture.html(view.render().el);
+          document.body.innerHTML = '<div id="fixtures"></div>';
+          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>');
         });
 
     });
diff --git a/test/specs/dom_components/view/ComponentsView.js b/test/specs/dom_components/view/ComponentsView.js
index 18634674b..8d7584cac 100644
--- a/test/specs/dom_components/view/ComponentsView.js
+++ b/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);
-          $fixture.html(view.render().el);
+          document.body.innerHTML = '<div id="fixtures"></div>';
+          document.body.querySelector('#fixtures').appendChild(view.render().el);
         });
 
         afterEach(() => {
           view.collection.reset();
         });
 
-        after(() => {
-          $fixture.remove();
-        });
-
         it("Collection is empty", () => {
           expect(view.$el.html()).toNotExist();
         });