use jest-codemods

test/main.test.js

@@ -2,7 +2,7 @@ import grapesjs from './../src';
 
 describe('Main', () => {
   describe('Startup', () => {
-    it('Main object should be loaded', () => {
+    test('Main object should be loaded', () => {
       expect(grapesjs).toBeTruthy();
     });
   });

test/specs/asset_manager/index.js

@@ -35,20 +35,20 @@ describe('Asset Manager', () => {
       obj = null;
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(obj).toExist();
     });
 
-    it('No assets inside', () => {
+    test('No assets inside', () => {
       expect(obj.getAll().length).toEqual(0);
     });
 
-    it('Add new asset', () => {
+    test('Add new asset', () => {
       obj.add(imgObj);
       expect(obj.getAll().length).toEqual(1);
     });
 
-    it('Added asset has correct data', () => {
+    test('Added asset has correct data', () => {
       obj.add(imgObj);
       var asset = obj.get(imgObj.src);
       expect(asset.get('width')).toEqual(imgObj.width);
@@ -56,14 +56,14 @@ describe('Asset Manager', () => {
       expect(asset.get('type')).toEqual(imgObj.type);
     });
 
-    it('Add asset with src', () => {
+    test('Add asset with src', () => {
       obj.add(imgObj.src);
       var asset = obj.get(imgObj.src);
       expect(asset.get('type')).toEqual('image');
       expect(asset.get('src')).toEqual(imgObj.src);
     });
 
-    it('Add asset with more src', () => {
+    test('Add asset with more src', () => {
       obj.add([imgObj.src, imgObj.src + '2']);
       expect(obj.getAll().length).toEqual(2);
       var asset1 = obj.getAll().at(0);
@@ -72,13 +72,13 @@ describe('Asset Manager', () => {
       expect(asset2.get('src')).toEqual(imgObj.src + '2');
     });
 
-    it('Remove asset', () => {
+    test('Remove asset', () => {
       obj.add(imgObj);
       obj.remove(imgObj.src);
       expect(obj.getAll().length).toEqual(0);
     });
 
-    it('Render assets', () => {
+    test('Render assets', () => {
       obj.add(imgObj);
       expect(obj.render()).toExist();
     });
@@ -103,7 +103,7 @@ describe('Asset Manager', () => {
         storageManager = null;
       });
 
-      it('Store and load data', () => {
+      test('Store and load data', () => {
         obj.add(imgObj);
         obj.store();
         obj.remove(imgObj.src);

test/specs/asset_manager/model/Asset.js

@@ -3,11 +3,11 @@ var Asset = require('asset_manager/model/Asset');
 module.exports = {
   run() {
     describe('Asset', () => {
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(Asset).toExist();
       });
 
-      it('Has default values', () => {
+      test('Has default values', () => {
         var obj = new Asset({});
         expect(obj.get('type')).toNotExist();
         expect(obj.get('src')).toNotExist();
@@ -15,14 +15,14 @@ module.exports = {
         expect(obj.getFilename()).toNotExist();
       });
 
-      it('Test getFilename', () => {
+      test('Test getFilename', () => {
         var obj = new Asset({ type: 'image', src: 'ch/eck/t.e.s.t' });
         expect(obj.getFilename()).toEqual('t.e.s.t');
         var obj = new Asset({ type: 'image', src: 'ch/eck/1234abc' });
         expect(obj.getFilename()).toEqual('1234abc');
       });
 
-      it('Test getExtension', () => {
+      test('Test getExtension', () => {
         var obj = new Asset({ type: 'image', src: 'ch/eck/t.e.s.t' });
         expect(obj.getExtension()).toEqual('t');
         var obj = new Asset({ type: 'image', src: 'ch/eck/1234abc.' });

test/specs/asset_manager/model/AssetImage.js

@@ -3,11 +3,11 @@ var AssetImage = require('asset_manager/model/AssetImage');
 module.exports = {
   run() {
     describe('AssetImage', () => {
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(AssetImage).toExist();
       });
 
-      it('Has default values', () => {
+      test('Has default values', () => {
         var obj = new AssetImage({});
         expect(obj.get('type')).toEqual('image');
         expect(obj.get('src')).toNotExist();

test/specs/asset_manager/model/Assets.js

@@ -13,11 +13,11 @@ module.exports = {
         obj = null;
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(obj).toExist();
       });
 
-      it('Collection is empty', () => {
+      test('Collection is empty', () => {
         expect(obj.length).toEqual(0);
       });
     });

test/specs/asset_manager/view/AssetImageView.js

@@ -7,7 +7,7 @@ module.exports = {
     let obj;
 
     describe('AssetImageView', () => {
-      beforeEach(function() {
+      beforeEach(() => {
         var coll = new Assets();
         var model = coll.add({ type: 'image', src: '/test' });
         obj = new AssetImageView({
@@ -19,40 +19,40 @@ module.exports = {
         document.body.querySelector('#fixtures').appendChild(obj.render().el);
       });
 
-      afterEach(function() {
+      afterEach(() => {
         obj = null;
         document.body.innerHTML = '';
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(AssetImageView).toExist();
       });
 
       describe('Asset should be rendered correctly', () => {
-        it('Has preview box', function() {
+        test('Has preview box', () => {
           var $asset = obj.$el;
           expect($asset.find('.preview').length).toEqual(1);
         });
 
-        it('Has meta box', function() {
+        test('Has meta box', () => {
           var $asset = obj.$el;
           expect($asset.find('.meta').length).toEqual(1);
         });
 
-        it('Has close button', function() {
+        test('Has close button', () => {
           var $asset = obj.$el;
           expect($asset.find('[data-toggle=asset-remove]').length).toEqual(1);
         });
       });
 
-      it('Could be selected', function() {
+      test('Could be selected', () => {
         var spy = expect.spyOn(obj, 'updateTarget');
         obj.$el.trigger('click');
         expect(obj.$el.attr('class')).toInclude('highlight');
         expect(spy).toHaveBeenCalled();
       });
 
-      it('Could be chosen', function() {
+      test('Could be chosen', () => {
         sinon.stub(obj, 'updateTarget');
         var spy = expect.spyOn(obj, 'updateTarget');
         obj.$el.trigger('dblclick');
@@ -60,7 +60,7 @@ module.exports = {
         //obj.updateTarget.calledOnce.should.equal(true);
       });
 
-      it('Could be removed', function() {
+      test('Could be removed', () => {
         var spy = sinon.spy();
         obj.model.on('remove', spy);
         obj.onRemove({ stopImmediatePropagation() {} });

test/specs/asset_manager/view/AssetView.js

@@ -5,29 +5,35 @@ var Assets = require('asset_manager/model/Assets');
 module.exports = {
   run() {
     describe('AssetView', () => {
-      beforeEach(function() {
+      let testContext;
+
+      beforeEach(() => {
+        testContext = {};
+      });
+
+      beforeEach(() => {
         var coll = new Assets();
         var model = coll.add({ src: 'test' });
-        this.view = new AssetView({
+        testContext.view = new AssetView({
           config: {},
           model
         });
         document.body.innerHTML = '<div id="fixtures"></div>';
         document.body
           .querySelector('#fixtures')
-          .appendChild(this.view.render().el);
+          .appendChild(testContext.view.render().el);
       });
 
-      afterEach(function() {
-        this.view.remove();
+      afterEach(() => {
+        testContext.view.remove();
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(AssetView).toExist();
       });
 
-      it('Has correct prefix', function() {
-        expect(this.view.pfx).toEqual('');
+      test('Has correct prefix', () => {
+        expect(testContext.view.pfx).toEqual('');
       });
     });
   }

test/specs/asset_manager/view/AssetsView.js

@@ -8,7 +8,7 @@ module.exports = {
       var obj;
       var coll;
 
-      beforeEach(function() {
+      beforeEach(() => {
         coll = new Assets([]);
         obj = new AssetsView({
           config: {},
@@ -22,43 +22,43 @@ module.exports = {
         document.body.querySelector('#fixtures').appendChild(obj.el);
       });
 
-      afterEach(function() {
+      afterEach(() => {
         obj.collection.reset();
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(AssetsView).toExist();
       });
 
-      it('Collection is empty', function() {
+      test('Collection is empty', () => {
         expect(obj.getAssetsEl().innerHTML).toNotExist();
       });
 
-      it('Add new asset', function() {
+      test('Add new asset', () => {
         sinon.stub(obj, 'addAsset');
         coll.add({ src: 'test' });
         expect(obj.addAsset.calledOnce).toEqual(true);
       });
 
-      it('Render new asset', function() {
+      test('Render new asset', () => {
         coll.add({ src: 'test' });
         expect(obj.getAssetsEl().innerHTML).toExist();
       });
 
-      it('Render correctly new image asset', function() {
+      test('Render correctly new image asset', () => {
         coll.add({ type: 'image', src: 'test' });
         var asset = obj.getAssetsEl().firstChild;
         expect(asset.tagName).toEqual('DIV');
         expect(asset.innerHTML).toExist();
       });
 
-      it('Clean collection from asset', function() {
+      test('Clean collection from asset', () => {
         var model = coll.add({ src: 'test' });
         coll.remove(model);
         expect(obj.getAssetsEl().innerHTML).toNotExist();
       });
 
-      it('Deselect works', function() {
+      test('Deselect works', () => {
         coll.add([{}, {}]);
         var $asset = obj.$el.children().first();
         $asset.attr('class', obj.pfx + 'highlight');
@@ -66,15 +66,15 @@ module.exports = {
         expect($asset.attr('class')).toNotExist();
       });
 
-      it('Returns not empty assets element', () => {
+      test('Returns not empty assets element', () => {
         expect(obj.getAssetsEl()).toExist();
       });
 
-      it('Returns not empty url input', () => {
+      test('Returns not empty url input', () => {
         expect(obj.getAddInput()).toExist();
       });
 
-      it('Add image asset from input string', () => {
+      test('Add image asset from input string', () => {
         obj.getAddInput().value = 'test';
         obj.handleSubmit({
           preventDefault() {}

test/specs/asset_manager/view/FileUploader.js

@@ -5,38 +5,38 @@ module.exports = {
     describe('File Uploader', () => {
       let obj;
 
-      beforeEach(function() {
+      beforeEach(() => {
         obj = new FileUploader({ config: {} });
         document.body.innerHTML = '<div id="fixtures"></div>';
         document.body.querySelector('#fixtures').appendChild(obj.render().el);
       });
 
-      afterEach(function() {
+      afterEach(() => {
         obj.remove();
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(FileUploader).toExist();
       });
 
-      it('Has correct prefix', function() {
+      test('Has correct prefix', () => {
         expect(obj.pfx).toNotExist();
       });
 
       describe('Should be rendered correctly', () => {
-        it('Has title', function() {
+        test('Has title', () => {
           expect(obj.$el.find('#title').length).toEqual(1);
         });
 
-        it('Title is empty', function() {
+        test('Title is empty', () => {
           expect(obj.$el.find('#title').html()).toEqual('');
         });
 
-        it('Has file input', function() {
+        test('Has file input', () => {
           expect(obj.$el.find('input[type=file]').length).toEqual(1);
         });
 
-        it('File input is enabled', function() {
+        test('File input is enabled', () => {
           expect(obj.$el.find('input[type=file]').prop('disabled')).toEqual(
             true
           );
@@ -44,7 +44,7 @@ module.exports = {
       });
 
       describe('Interprets configurations correctly', () => {
-        it('Has correct title', () => {
+        test('Has correct title', () => {
           var view = new FileUploader({
             config: {
               uploadText: 'Test'
@@ -54,7 +54,7 @@ module.exports = {
           expect(view.$el.find('#title').html()).toEqual('Test');
         });
 
-        it('Could be disabled', () => {
+        test('Could be disabled', () => {
           var view = new FileUploader({
             config: {
               disableUpload: true,
@@ -67,7 +67,7 @@ module.exports = {
           );
         });
 
-        it('Handles embedAsBase64 parameter', () => {
+        test('Handles embedAsBase64 parameter', () => {
           var view = new FileUploader({
             config: {
               embedAsBase64: true

test/specs/block_manager/index.js

@@ -21,48 +21,48 @@ describe('BlockManager', () => {
       obj = null;
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(obj).toExist();
     });
 
-    it('No blocks inside', () => {
+    test('No blocks inside', () => {
       expect(obj.getAll().length).toEqual(0);
     });
 
-    it('No categories inside', () => {
+    test('No categories inside', () => {
       expect(obj.getCategories().length).toEqual(0);
     });
 
-    it('Add new block', () => {
+    test('Add new block', () => {
       var model = obj.add(idTest, optsTest);
       expect(obj.getAll().length).toEqual(1);
     });
 
-    it('Added block has correct data', () => {
+    test('Added block has correct data', () => {
       var model = obj.add(idTest, optsTest);
       expect(model.get('label')).toEqual(optsTest.label);
       expect(model.get('content')).toEqual(optsTest.content);
     });
 
-    it('Add block with attributes', () => {
+    test('Add block with attributes', () => {
       optsTest.attributes = { class: 'test' };
       var model = obj.add(idTest, optsTest);
       expect(model.get('attributes').class).toEqual('test');
     });
 
-    it('The id of the block is unique', () => {
+    test('The id of the block is unique', () => {
       var model = obj.add(idTest, optsTest);
       var model2 = obj.add(idTest, { other: 'test' });
       expect(model).toEqual(model2);
     });
 
-    it('Get block by id', () => {
+    test('Get block by id', () => {
       var model = obj.add(idTest, optsTest);
       var model2 = obj.get(idTest);
       expect(model).toEqual(model2);
     });
 
-    it('Render blocks', () => {
+    test('Render blocks', () => {
       obj.render();
       expect(obj.getContainer()).toExist();
     });

test/specs/block_manager/view/BlocksView.js

@@ -23,22 +23,22 @@ module.exports = {
         view.collection.reset();
       });
 
-      it('The container is not empty', () => {
+      test('The container is not empty', () => {
         expect(view.el.outerHTML).toExist();
       });
 
-      it('No children inside', () => {
+      test('No children inside', () => {
         expect(view.getBlocksEl().children.length).toEqual(0);
       });
 
-      it('Render children on add', () => {
+      test('Render children on add', () => {
         model.add({});
         expect(view.getBlocksEl().children.length).toEqual(1);
         model.add([{}, {}]);
         expect(view.getBlocksEl().children.length).toEqual(3);
       });
 
-      it('Destroy children on remove', () => {
+      test('Destroy children on remove', () => {
         model.add([{}, {}]);
         expect(view.getBlocksEl().children.length).toEqual(2);
         model.at(0).destroy();
@@ -64,11 +64,11 @@ module.exports = {
             .appendChild(view.render().el);
         });
 
-        it('Render children', () => {
+        test('Render children', () => {
           expect(view.getBlocksEl().children.length).toEqual(2);
         });
 
-        it('Render container', () => {
+        test('Render container', () => {
           expect(view.getBlocksEl().getAttribute('class')).toEqual(
             ppfx + 'blocks-c'
           );

test/specs/code_manager/index.js

@@ -13,24 +13,24 @@ describe('Code Manager', () => {
       obj = null;
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(CodeManager).toExist();
     });
 
-    it('No code generators inside', () => {
+    test('No code generators inside', () => {
       expect(obj.getGenerators()).toEqual({});
     });
 
-    it('No code viewers inside', () => {
+    test('No code viewers inside', () => {
       expect(obj.getViewers()).toEqual({});
     });
 
-    it('Add and get code generator', () => {
+    test('Add and get code generator', () => {
       obj.addGenerator('test', 'gen');
       expect(obj.getGenerator('test')).toEqual('gen');
     });
 
-    it('Add and get code viewer', () => {
+    test('Add and get code viewer', () => {
       obj.addViewer('test', 'view');
       expect(obj.getViewer('test')).toEqual('view');
     });

test/specs/code_manager/model/CodeModels.js

@@ -31,16 +31,16 @@ module.exports = {
         obj = null;
       });
 
-      it('Build correctly one component', () => {
+      test('Build correctly one component', () => {
         expect(obj.build(comp)).toEqual('');
       });
 
-      it('Build correctly empty component inside', () => {
+      test('Build correctly empty component inside', () => {
         var m1 = comp.get('components').add({});
         expect(obj.build(comp)).toEqual('<div></div>');
       });
 
-      it('Build correctly not empty component inside', () => {
+      test('Build correctly not empty component inside', () => {
         var m1 = comp.get('components').add({
           tagName: 'article',
           attributes: {
@@ -53,7 +53,7 @@ module.exports = {
         );
       });
 
-      it('Build correctly component with classes', () => {
+      test('Build correctly component with classes', () => {
         var m1 = comp.get('components').add({
           tagName: 'article',
           attributes: {
@@ -93,16 +93,16 @@ module.exports = {
         obj = null;
       });
 
-      it('Build correctly one component', () => {
+      test('Build correctly one component', () => {
         expect(obj.build(comp)).toEqual('');
       });
 
-      it('Build correctly empty component inside', () => {
+      test('Build correctly empty component inside', () => {
         var m1 = comp.get('components').add({ tagName: 'article' });
         expect(obj.build(comp)).toEqual('');
       });
 
-      it('Build correctly component with style inside', () => {
+      test('Build correctly component with style inside', () => {
         var m1 = comp.get('components').add({
           tagName: 'article',
           style: {
@@ -115,7 +115,7 @@ module.exports = {
         );
       });
 
-      it('Build correctly component with class styled', () => {
+      test('Build correctly component with class styled', () => {
         var m1 = comp.get('components').add({ tagName: 'article' });
         var cls1 = m1.get('classes').add({ name: 'class1' });
 
@@ -128,7 +128,7 @@ module.exports = {
         );
       });
 
-      it('Build correctly component styled with class and state', () => {
+      test('Build correctly component styled with class and state', () => {
         var m1 = comp.get('components').add({ tagName: 'article' });
         var cls1 = m1.get('classes').add({ name: 'class1' });
 
@@ -142,7 +142,7 @@ module.exports = {
         );
       });
 
-      it('Build correctly with more classes', () => {
+      test('Build correctly with more classes', () => {
         var m1 = comp.get('components').add({ tagName: 'article' });
         var cls1 = m1.get('classes').add({ name: 'class1' });
         var cls2 = m1.get('classes').add({ name: 'class2' });
@@ -156,7 +156,7 @@ module.exports = {
         );
       });
 
-      it('Build rules with mixed classes', () => {
+      test('Build rules with mixed classes', () => {
         var m1 = comp.get('components').add({ tagName: 'article' });
         var cls1 = m1.get('classes').add({ name: 'class1' });
         var cls2 = m1.get('classes').add({ name: 'class2' });
@@ -171,7 +171,7 @@ module.exports = {
         );
       });
 
-      it('Build rules with only not class based selectors', () => {
+      test('Build rules with only not class based selectors', () => {
         var cssc = newCssComp();
         var rule = cssc.add([]);
         rule.set('style', { prop1: 'value1', prop2: 'value2' });
@@ -182,7 +182,7 @@ module.exports = {
         );
       });
 
-      it('Build correctly with class styled out', () => {
+      test('Build correctly with class styled out', () => {
         var m1 = comp.get('components').add({ tagName: 'article' });
         var cls1 = m1.get('classes').add({ name: 'class1' });
         var cls2 = m1.get('classes').add({ name: 'class2' });
@@ -198,7 +198,7 @@ module.exports = {
         );
       });
 
-      it('Rule with media query', () => {
+      test('Rule with media query', () => {
         var m1 = comp.get('components').add({ tagName: 'article' });
         var cls1 = m1.get('classes').add({ name: 'class1' });
         var cls2 = m1.get('classes').add({ name: 'class2' });
@@ -213,7 +213,7 @@ module.exports = {
         );
       });
 
-      it('Rules mixed with media queries', () => {
+      test('Rules mixed with media queries', () => {
         var m1 = comp.get('components').add({ tagName: 'article' });
         var cls1 = m1.get('classes').add({ name: 'class1' });
         var cls2 = m1.get('classes').add({ name: 'class2' });
@@ -240,7 +240,7 @@ module.exports = {
         );
       });
 
-      it('Avoid useless code', () => {
+      test('Avoid useless code', () => {
         var m1 = comp.get('components').add({ tagName: 'article' });
         var cls1 = m1.get('classes').add({ name: 'class1' });
 
@@ -252,14 +252,14 @@ module.exports = {
         expect(obj.build(comp, { cssc })).toEqual('');
       });
 
-      it('Render correctly a rule without avoidInlineStyle option', () => {
+      test('Render correctly a rule without avoidInlineStyle option', () => {
         comp.setStyle({ color: 'red' });
         const id = comp.getId();
         const result = `#${id}{color:red;}`;
         expect(obj.build(comp, { cssc: cc })).toEqual(result);
       });
 
-      it('Render correctly a rule with avoidInlineStyle option', () => {
+      test('Render correctly a rule with avoidInlineStyle option', () => {
         em.getConfig().avoidInlineStyle = 1;
         comp = new Component(
           {},
@@ -274,7 +274,7 @@ module.exports = {
         expect(obj.build(comp, { cssc: cc, em })).toEqual(result);
       });
 
-      it('Render correctly a rule with avoidInlineStyle and state', () => {
+      test('Render correctly a rule with avoidInlineStyle and state', () => {
         em.getConfig().avoidInlineStyle = 1;
         const state = 'hover';
         comp.config.avoidInlineStyle = 1;
@@ -285,7 +285,7 @@ module.exports = {
         expect(obj.build(comp, { cssc: cc, em })).toEqual(result);
       });
 
-      it('Render correctly a rule with avoidInlineStyle and w/o state', () => {
+      test('Render correctly a rule with avoidInlineStyle and w/o state', () => {
         em.getConfig().avoidInlineStyle = 1;
         const state = 'hover';
         comp.config.avoidInlineStyle = 1;

test/specs/commands/index.js

@@ -14,17 +14,17 @@ describe('Commands', () => {
       obj = null;
     });
 
-    it('No commands inside', () => {
+    test('No commands inside', () => {
       expect(obj.get('test')).toEqual(null);
     });
 
-    it('Push new command', () => {
+    test('Push new command', () => {
       var comm = { test: 'test' };
       obj.add('test', comm);
       expect(obj.get('test').test).toEqual('test');
     });
 
-    it('Load default commands at init', () => {
+    test('Load default commands at init', () => {
       expect(obj.get('select-comp')).toNotEqual(null);
       expect(obj.get('create-comp')).toNotEqual(null);
       expect(obj.get('delete-comp')).toNotEqual(null);
@@ -50,12 +50,12 @@ describe('Commands', () => {
       expect(obj.get('drag')).toNotEqual(null);
     });
 
-    it('Default commands after loadDefaultCommands', () => {
+    test('Default commands after loadDefaultCommands', () => {
       obj.loadDefaultCommands();
       expect(obj.get('select-comp')).toNotEqual(null);
     });
 
-    it('Commands module should not have toLoad property', () => {
+    test('Commands module should not have toLoad property', () => {
       expect(obj.toLoad).toEqual(null);
     });
   });

test/specs/commands/model/CommandModels.js

@@ -14,7 +14,7 @@ module.exports = {
         obj = null;
       });
 
-      it('Has id property', () => {
+      test('Has id property', () => {
         expect(obj.has('id')).toEqual(true);
       });
     });
@@ -30,7 +30,7 @@ module.exports = {
         obj = null;
       });
 
-      it('Object is ok', () => {
+      test('Object is ok', () => {
         expect(obj).toExist();
       });
     });

test/specs/commands/view/CommandAbstract.js

@@ -20,7 +20,7 @@ module.exports = {
         editor = null;
       });
 
-      it('callRun returns result when no "abort" option specified', () => {
+      test('callRun returns result when no "abort" option specified', () => {
         const runStub = sinon.stub(command, 'run').returns('result');
 
         const result = command.callRun(editor);
@@ -40,7 +40,7 @@ module.exports = {
         expect(runStub.calledOnce).toEqual(true);
       });
 
-      it('callRun returns undefined when "abort" option is specified', () => {
+      test('callRun returns undefined when "abort" option is specified', () => {
         const runStub = sinon.stub(command, 'run').returns('result');
 
         const result = command.callRun(editor, { abort: true });
@@ -59,7 +59,7 @@ module.exports = {
         expect(runStub.notCalled).toEqual(true);
       });
 
-      it('callStop returns result', () => {
+      test('callStop returns result', () => {
         const stopStub = sinon.stub(command, 'stop').returns('stopped');
 
         const result = command.callStop(editor);

test/specs/css_composer/e2e/CssComposer.js

@@ -13,7 +13,7 @@ module.exports = {
       var rulesSet;
       var rulesSet2;
 
-      before(() => {
+      beforeAll(() => {
         fixtures = $('#fixtures');
         fixture = $('<div class="csscomposer-fixture"></div>');
       });
@@ -53,11 +53,11 @@ module.exports = {
         clsm = null;
       });
 
-      after(() => {
+      afterAll(() => {
         fixture.remove();
       });
 
-      it('Rules are correctly imported from default property', () => {
+      test('Rules are correctly imported from default property', () => {
         var gj = grapesjs.init({
           stylePrefix: '',
           storageManager: { autoload: 0, type: 'none' },
@@ -70,7 +70,7 @@ module.exports = {
         expect(cls.length).toEqual(3);
       });
 
-      it('New rule adds correctly the class inside selector manager', () => {
+      test('New rule adds correctly the class inside selector manager', () => {
         var rules = cssc.getAll();
         rules.add({ selectors: [{ name: 'test1', private: true }] });
         var rule = clsm.getAll().at(0);
@@ -78,7 +78,7 @@ module.exports = {
         expect(rule.get('private')).toEqual(true);
       });
 
-      it('New rules are correctly imported inside selector manager', () => {
+      test('New rules are correctly imported inside selector manager', () => {
         var rules = cssc.getAll();
         rulesSet.forEach(item => {
           rules.add(item);
@@ -90,7 +90,7 @@ module.exports = {
         expect(cls.at(2).get('name')).toEqual('test3');
       });
 
-      it('Add rules from the new component added as a string with style tag', () => {
+      test('Add rules from the new component added as a string with style tag', () => {
         var comps = domc.getComponents();
         var rules = cssc.getAll();
         comps.add(
@@ -100,13 +100,13 @@ module.exports = {
         expect(rules.length).toEqual(2);
       });
 
-      it('Add raw rule objects with addCollection', () => {
+      test('Add raw rule objects with addCollection', () => {
         cssc.addCollection(rulesSet);
         expect(cssc.getAll().length).toEqual(3);
         expect(clsm.getAll().length).toEqual(3);
       });
 
-      it('Add raw rule objects twice with addCollection do not duplucate rules', () => {
+      test('Add raw rule objects twice with addCollection do not duplucate rules', () => {
         var rulesSet2Copy = JSON.parse(JSON.stringify(rulesSet2));
         var coll1 = cssc.addCollection(rulesSet2);
         var coll2 = cssc.addCollection(rulesSet2Copy);
@@ -115,7 +115,7 @@ module.exports = {
         expect(coll1).toEqual(coll2);
       });
 
-      it('Extend css rule style, if requested', () => {
+      test('Extend css rule style, if requested', () => {
         var style1 = { color: 'red', width: '10px' };
         var style2 = { height: '20px', width: '20px' };
         var rule1 = {
@@ -163,7 +163,7 @@ module.exports = {
         expect(ruleOut).toEqual(ruleResult);
       });
 
-      it('Do not extend with different selectorsAdd', () => {
+      test('Do not extend with different selectorsAdd', () => {
         var style1 = { color: 'red', width: '10px' };
         var style2 = { height: '20px', width: '20px' };
         var rule1 = {
@@ -212,7 +212,7 @@ module.exports = {
         expect(rule2Out).toEqual(rule2Result);
       });
 
-      it('Add raw rule objects with width via addCollection', () => {
+      test('Add raw rule objects with width via addCollection', () => {
         var coll1 = cssc.addCollection(rulesSet2);
         expect(coll1[2].get('mediaText')).toEqual(rulesSet2[2].mediaText);
       });

test/specs/css_composer/index.js

@@ -42,38 +42,38 @@ describe('Css Composer', () => {
       obj = null;
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(CssComposer).toExist();
     });
 
-    it('storageKey returns array', () => {
+    test('storageKey returns array', () => {
       expect(obj.storageKey() instanceof Array).toEqual(true);
     });
 
-    it('storageKey returns correct composition', () => {
+    test('storageKey returns correct composition', () => {
       setSmConfig();
       expect(obj.storageKey()).toEqual(['css', 'styles']);
     });
 
-    it('Store data', () => {
+    test('Store data', () => {
       setSmConfig();
       setEm();
       var expected = { css: 'testCss', styles: '[]' };
       expect(obj.store(1)).toEqual(expected);
     });
 
-    it('Rules are empty', () => {
+    test('Rules are empty', () => {
       expect(obj.getAll().length).toEqual(0);
     });
 
-    it('Create new rule with correct selectors', () => {
+    test('Create new rule with correct selectors', () => {
       var sel = new obj.Selectors();
       var s1 = sel.add({ name: 'test1' });
       var rule = obj.add(sel.models);
       expect(rule.get('selectors').at(0)).toEqual(s1);
     });
 
-    it('Create new rule correctly', () => {
+    test('Create new rule correctly', () => {
       var sel = new obj.Selectors();
       var s1 = sel.add({ name: 'test1' });
       var rule = obj.add(sel.models, 'state1', 'width1');
@@ -81,7 +81,7 @@ describe('Css Composer', () => {
       expect(rule.get('mediaText')).toEqual('width1');
     });
 
-    it('Add rule to collection', () => {
+    test('Add rule to collection', () => {
       var sel = new obj.Selectors([{ name: 'test1' }]);
       var rule = obj.add(sel.models);
       expect(obj.getAll().length).toEqual(1);
@@ -95,14 +95,14 @@ describe('Css Composer', () => {
       ).toEqual('test1');
     });
 
-    it('Returns correct rule with the same selector', () => {
+    test('Returns correct rule with the same selector', () => {
       var sel = new obj.Selectors([{ name: 'test1' }]);
       var rule1 = obj.add(sel.models);
       var rule2 = obj.get(sel.models);
       expect(rule1).toEqual(rule2);
     });
 
-    it('Returns correct rule with the same selectors', () => {
+    test('Returns correct rule with the same selectors', () => {
       var sel1 = new obj.Selectors([{ name: 'test1' }]);
       var rule1 = obj.add(sel1.models);
 
@@ -113,7 +113,7 @@ describe('Css Composer', () => {
       expect(rule3).toEqual(rule2);
     });
 
-    it('Do not create multiple rules with the same name selectors', () => {
+    test('Do not create multiple rules with the same name selectors', () => {
       var sel1 = new obj.Selectors([{ name: 'test21' }, { name: 'test22' }]);
       var rule1 = obj.add(sel1.models);
 
@@ -122,7 +122,7 @@ describe('Css Composer', () => {
       expect(rule2).toEqual(rule1);
     });
 
-    it("Don't duplicate rules", () => {
+    test("Don't duplicate rules", () => {
       var sel = new obj.Selectors([]);
       var s1 = sel.add({ name: 'test1' });
       var s2 = sel.add({ name: 'test2' });
@@ -134,7 +134,7 @@ describe('Css Composer', () => {
       expect(rule2).toEqual(rule1);
     });
 
-    it('Returns correct rule with the same mixed selectors', () => {
+    test('Returns correct rule with the same mixed selectors', () => {
       var sel = new obj.Selectors([]);
       var s1 = sel.add({ name: 'test1' });
       var s2 = sel.add({ name: 'test2' });
@@ -144,7 +144,7 @@ describe('Css Composer', () => {
       expect(rule2).toEqual(rule1);
     });
 
-    it('Returns correct rule with the same selectors and state', () => {
+    test('Returns correct rule with the same selectors and state', () => {
       var sel = new obj.Selectors([]);
       var s1 = sel.add({ name: 'test1' });
       var s2 = sel.add({ name: 'test2' });
@@ -154,7 +154,7 @@ describe('Css Composer', () => {
       expect(rule2).toEqual(rule1);
     });
 
-    it('Returns correct rule with the same selectors, state and width', () => {
+    test('Returns correct rule with the same selectors, state and width', () => {
       var sel = new obj.Selectors([]);
       var s1 = sel.add({ name: 'test1' });
       var rule1 = obj.add([s1], 'hover', '1');
@@ -162,11 +162,11 @@ describe('Css Composer', () => {
       expect(rule2).toEqual(rule1);
     });
 
-    it('Renders correctly', () => {
+    test('Renders correctly', () => {
       expect(obj.render()).toExist();
     });
 
-    it('Create a rule with id selector by using setIdRule()', () => {
+    test('Create a rule with id selector by using setIdRule()', () => {
       const name = 'test';
       obj.setIdRule(name, { color: 'red' });
       expect(obj.getAll().length).toEqual(1);
@@ -181,7 +181,7 @@ describe('Css Composer', () => {
       );
     });
 
-    it('Create a rule with id selector and state by using setIdRule()', () => {
+    test('Create a rule with id selector and state by using setIdRule()', () => {
       const name = 'test';
       const state = 'hover';
       obj.setIdRule(name, { color: 'red' }, { state });
@@ -190,7 +190,7 @@ describe('Css Composer', () => {
       expect(rule.selectorsToString()).toEqual(`#${name}:${state}`);
     });
 
-    it('Create a rule with class selector by using setClassRule()', () => {
+    test('Create a rule with class selector by using setClassRule()', () => {
       const name = 'test';
       obj.setClassRule(name, { color: 'red' });
       expect(obj.getAll().length).toEqual(1);
@@ -199,7 +199,7 @@ describe('Css Composer', () => {
       expect(rule.styleToString()).toEqual(`color:red;`);
     });
 
-    it('Create a rule with class selector and state by using setClassRule()', () => {
+    test('Create a rule with class selector and state by using setClassRule()', () => {
       const name = 'test';
       const state = 'hover';
       obj.setClassRule(name, { color: 'red' }, { state });

test/specs/css_composer/model/CssModels.js

@@ -16,29 +16,29 @@ module.exports = {
         obj = null;
       });
 
-      it('Has selectors property', () => {
+      test('Has selectors property', () => {
         expect(obj.has('selectors')).toEqual(true);
       });
 
-      it('Has style property', () => {
+      test('Has style property', () => {
         expect(obj.has('style')).toEqual(true);
       });
 
-      it('Has state property', () => {
+      test('Has state property', () => {
         expect(obj.has('state')).toEqual(true);
       });
 
-      it('No default selectors', () => {
+      test('No default selectors', () => {
         expect(obj.get('selectors').length).toEqual(0);
       });
 
-      it('Compare returns true with the same selectors', () => {
+      test('Compare returns true with the same selectors', () => {
         var s1 = obj.get('selectors').add({ name: 'test1' });
         var s2 = obj.get('selectors').add({ name: 'test2' });
         expect(obj.compare([s1, s2])).toEqual(true);
       });
 
-      it('Compare with different state', () => {
+      test('Compare with different state', () => {
         var s1 = obj.get('selectors').add({ name: 'test1' });
         var s2 = obj.get('selectors').add({ name: 'test2' });
         obj.set('state', 'hover');
@@ -46,7 +46,7 @@ module.exports = {
         expect(obj.compare([s1, s2], 'hover')).toEqual(true);
       });
 
-      it('Compare with different mediaText', () => {
+      test('Compare with different mediaText', () => {
         var s1 = obj.get('selectors').add({ name: 'test1' });
         var s2 = obj.get('selectors').add({ name: 'test2' });
         obj.set('state', 'hover');
@@ -56,23 +56,23 @@ module.exports = {
         expect(obj.compare([s2, s1], 'hover', '1000')).toEqual(true);
       });
 
-      it('toCSS returns empty if there is no style', () => {
+      test('toCSS returns empty if there is no style', () => {
         var s1 = obj.get('selectors').add({ name: 'test1' });
         expect(obj.toCSS()).toEqual('');
       });
 
-      it('toCSS returns empty if there is no selectors', () => {
+      test('toCSS returns empty if there is no selectors', () => {
         obj.setStyle({ color: 'red' });
         expect(obj.toCSS()).toEqual('');
       });
 
-      it('toCSS returns simple CSS', () => {
+      test('toCSS returns simple CSS', () => {
         obj.get('selectors').add({ name: 'test1' });
         obj.setStyle({ color: 'red' });
         expect(obj.toCSS()).toEqual(`.test1{color:red;}`);
       });
 
-      it('toCSS wraps correctly inside media rule', () => {
+      test('toCSS wraps correctly inside media rule', () => {
         const media = '(max-width: 768px)';
         obj.set('atRuleType', 'media');
         obj.set('mediaText', media);
@@ -81,7 +81,7 @@ module.exports = {
         expect(obj.toCSS()).toEqual(`@media ${media}{.test1{color:red;}}`);
       });
 
-      it('toCSS with a generic at-rule', () => {
+      test('toCSS with a generic at-rule', () => {
         obj.set('atRuleType', 'supports');
         obj.get('selectors').add({ name: 'test1' });
         obj.setStyle({ 'font-family': 'Open Sans' });
@@ -90,14 +90,14 @@ module.exports = {
         );
       });
 
-      it('toCSS with a generic single at-rule', () => {
+      test('toCSS with a generic single at-rule', () => {
         obj.set('atRuleType', 'font-face');
         obj.set('singleAtRule', 1);
         obj.setStyle({ 'font-family': 'Sans' });
         expect(obj.toCSS()).toEqual(`@font-face{font-family:Sans;}`);
       });
 
-      it('toCSS with a generic at-rule and condition', () => {
+      test('toCSS with a generic at-rule and condition', () => {
         obj.set('atRuleType', 'font-face');
         obj.set('mediaText', 'some-condition');
         obj.get('selectors').add({ name: 'test1' });
@@ -109,7 +109,7 @@ module.exports = {
     });
 
     describe('CssRules', () => {
-      it('Creates collection item correctly', () => {
+      test('Creates collection item correctly', () => {
         var c = new CssRules();
         var m = c.add({});
         expect(m instanceof CssRule).toEqual(true);
@@ -117,7 +117,7 @@ module.exports = {
     });
 
     describe('Selectors', () => {
-      it('Creates collection item correctly', () => {
+      test('Creates collection item correctly', () => {
         var c = new Selectors();
         var m = c.add({});
         expect(m instanceof Selector).toEqual(true);

test/specs/css_composer/view/CssRuleView.js

@@ -7,7 +7,7 @@ module.exports = {
       let obj;
       let fixtures;
 
-      beforeEach(function() {
+      beforeEach(() => {
         var m = new CssRule();
         obj = new CssRuleView({
           model: m
@@ -21,15 +21,15 @@ module.exports = {
         obj.model.destroy();
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(CssRuleView).toExist();
       });
 
-      it('Empty style inside', function() {
+      test('Empty style inside', () => {
         expect(fixtures.innerHTML).toEqual('<style></style>');
       });
 
-      it('On update of style always empty as there is no selectors', function() {
+      test('On update of style always empty as there is no selectors', () => {
         obj.model.set('style', { prop: 'value' });
         expect(fixtures.innerHTML).toEqual('<style></style>');
       });
@@ -54,29 +54,29 @@ module.exports = {
           objReg.model.destroy();
         });
 
-        it('Empty with no style', () => {
+        test('Empty with no style', () => {
           expect(objReg.$el.html()).toEqual('');
         });
 
-        it('Not empty on update of style', () => {
+        test('Not empty on update of style', () => {
           objReg.model.set('style', { prop: 'value' });
           expect(objReg.$el.html()).toEqual('.test1.test2{prop:value;}');
         });
 
-        it('State correctly rendered', () => {
+        test('State correctly rendered', () => {
           objReg.model.set('style', { prop: 'value' });
           objReg.model.set('state', 'hover');
           expect(objReg.$el.html()).toEqual('.test1.test2:hover{prop:value;}');
         });
 
-        it('State render changes on update', () => {
+        test('State render changes on update', () => {
           objReg.model.set('style', { prop: 'value' });
           objReg.model.set('state', 'hover');
           objReg.model.set('state', '');
           expect(objReg.$el.html()).toEqual('.test1.test2{prop:value;}');
         });
 
-        it('Render media queries', () => {
+        test('Render media queries', () => {
           objReg.model.set('style', { prop: 'value' });
           objReg.model.set('mediaText', '(max-width: 999px)');
           expect(objReg.$el.html()).toEqual(
@@ -84,7 +84,7 @@ module.exports = {
           );
         });
 
-        it('Empty on clear', () => {
+        test('Empty on clear', () => {
           objReg.model.set('style', { prop: 'value' });
           objReg.model.set('style', {});
           expect(objReg.$el.html()).toEqual('');

test/specs/css_composer/view/CssRulesView.js

@@ -25,7 +25,7 @@ module.exports = {
         }
       ];
 
-      beforeEach(function() {
+      beforeEach(() => {
         const col = new CssRules([]);
         obj = new CssRulesView({
           collection: col,
@@ -45,11 +45,11 @@ module.exports = {
         obj.collection.reset();
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(CssRulesView).toExist();
       });
 
-      it('Collection is empty. Styles structure bootstraped', () => {
+      test('Collection is empty. Styles structure bootstraped', () => {
         expect(obj.$el.html()).toExist();
         const foundStylesContainers = obj.$el.find('div');
         expect(foundStylesContainers.length).toEqual(devices.length);
@@ -68,13 +68,13 @@ module.exports = {
         });
       });
 
-      it('Add new rule', () => {
+      test('Add new rule', () => {
         sinon.stub(obj, 'addToCollection');
         obj.collection.add({});
         expect(obj.addToCollection.calledOnce).toExist(true);
       });
 
-      it('Add correctly rules with different media queries', () => {
+      test('Add correctly rules with different media queries', () => {
         const foundStylesContainers = obj.$el.find('div');
         const rules = [
           {
@@ -98,7 +98,7 @@ module.exports = {
         expect(stylesCont.children.length).toEqual(rules.length);
       });
 
-      it('Render new rule', () => {
+      test('Render new rule', () => {
         obj.collection.add({});
         expect(obj.$el.find(`#${prefix}`).html()).toExist();
       });

test/specs/device_manager/index.js

@@ -17,44 +17,44 @@ describe('DeviceManager', () => {
       obj = null;
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(obj).toExist();
     });
 
-    it('No device inside', () => {
+    test('No device inside', () => {
       var coll = obj.getAll();
       expect(coll.length).toEqual(0);
     });
 
-    it('Add new device', () => {
+    test('Add new device', () => {
       var model = obj.add(testNameDevice, testWidthDevice);
       expect(obj.getAll().length).toEqual(1);
     });
 
-    it('Added device has correct data', () => {
+    test('Added device has correct data', () => {
       var model = obj.add(testNameDevice, testWidthDevice);
       expect(model.get('name')).toEqual(testNameDevice);
       expect(model.get('width')).toEqual(testWidthDevice);
     });
 
-    it('Add device width options', () => {
+    test('Add device width options', () => {
       var model = obj.add(testNameDevice, testWidthDevice, { opt: 'value' });
       expect(model.get('opt')).toEqual('value');
     });
 
-    it('The name of the device is unique', () => {
+    test('The name of the device is unique', () => {
       var model = obj.add(testNameDevice, testWidthDevice);
       var model2 = obj.add(testNameDevice, '2px');
       expect(model).toEqual(model2);
     });
 
-    it('Get device by name', () => {
+    test('Get device by name', () => {
       var model = obj.add(testNameDevice, testWidthDevice);
       var model2 = obj.get(testNameDevice);
       expect(model).toEqual(model2);
     });
 
-    it('Render devices', () => {
+    test('Render devices', () => {
       expect(obj.render()).toExist();
     });
   });

test/specs/device_manager/view/DevicesView.js

@@ -23,15 +23,15 @@ module.exports = {
         view.collection.reset();
       });
 
-      it('The content is not empty', () => {
+      test('The content is not empty', () => {
         expect(view.el.innerHTML).toExist();
       });
 
-      it('No options without devices', () => {
+      test('No options without devices', () => {
         expect(view.getOptions()).toEqual('');
       });
 
-      it('Render new button', () => {
+      test('Render new button', () => {
         view.collection.add({});
         expect(view.$el.html()).toExist();
       });
@@ -50,13 +50,13 @@ module.exports = {
             .appendChild(view.render().el);
         });
 
-        it('Update device on select change', () => {
+        test('Update device on select change', () => {
           view.$el.find('select').val('test2');
           view.updateDevice();
           expect(view.config.em.get('device')).toEqual('test2');
         });
 
-        it('Render options', () => {
+        test('Render options', () => {
           expect(view.getOptions()).toEqual(
             '<option value="test1">test1</option><option value="test2">test2</option>'
           );

test/specs/dom_components/index.js

@@ -58,15 +58,15 @@ describe('DOM Components', () => {
       obj = null;
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(DomComponents).toExist();
     });
 
-    it('storageKey returns array', () => {
+    test('storageKey returns array', () => {
       expect(obj.storageKey() instanceof Array).toEqual(true);
     });
 
-    it('storageKey returns correct composition', () => {
+    test('storageKey returns correct composition', () => {
       config.stm = {
         getConfig() {
           return {
@@ -78,7 +78,7 @@ describe('DOM Components', () => {
       expect(obj.storageKey()).toEqual(['html', 'components']);
     });
 
-    it('Store data', () => {
+    test('Store data', () => {
       setSmConfig();
       setEm();
       //obj.getWrapper().get('components').add({});
@@ -89,7 +89,7 @@ describe('DOM Components', () => {
       expect(obj.store(1)).toEqual(expected);
     });
 
-    it.skip('Store and load data', () => {
+    test.skip('Store and load data', () => {
       setSmConfig();
       setEm();
       const comps = new Components({}, {});
@@ -98,29 +98,29 @@ describe('DOM Components', () => {
       expect(obj.load()).toEqual([{ test: 1 }]);
     });
 
-    it('Wrapper exists', () => {
+    test('Wrapper exists', () => {
       expect(obj.getWrapper()).toExist();
     });
 
-    it('No components inside', () => {
+    test('No components inside', () => {
       expect(obj.getComponents().length).toEqual(0);
     });
 
-    it('Add new component', () => {
+    test('Add new component', () => {
       var comp = obj.addComponent({});
       expect(obj.getComponents().length).toEqual(1);
     });
 
-    it('Add more components at once', () => {
+    test('Add more components at once', () => {
       var comp = obj.addComponent([{}, {}]);
       expect(obj.getComponents().length).toEqual(2);
     });
 
-    it('Render wrapper', () => {
+    test('Render wrapper', () => {
       expect(obj.render()).toExist();
     });
 
-    it('Import propertly components and styles with the same ids', () => {
+    test('Import propertly components and styles with the same ids', () => {
       obj = em.get('DomComponents');
       const cc = em.get('CssComposer');
       const id = 'idtest';

test/specs/dom_components/model/Component.js

@@ -33,11 +33,11 @@ module.exports = {
         obj = null;
       });
 
-      it('Has no children', () => {
+      test('Has no children', () => {
         expect(obj.get('components').length).toEqual(0);
       });
 
-      it('Clones correctly', () => {
+      test('Clones correctly', () => {
         var sAttr = obj.attributes;
         var cloned = obj.clone();
         var eAttr = cloned.attributes;
@@ -48,7 +48,7 @@ module.exports = {
         expect(sAttr.length).toEqual(eAttr.length);
       });
 
-      it('Clones correctly with traits', () => {
+      test('Clones correctly with traits', () => {
         obj
           .get('traits')
           .at(0)
@@ -68,7 +68,7 @@ module.exports = {
         expect(obj.get('stylable')).toEqual(true);
       });
 
-      it('Sets attributes correctly from traits', () => {
+      test('Sets attributes correctly from traits', () => {
         obj.set('traits', [
           {
             label: 'Title',
@@ -83,21 +83,21 @@ module.exports = {
         expect(obj.get('attributes')).toEqual({ title: 'The title' });
       });
 
-      it('Has expected name', () => {
+      test('Has expected name', () => {
         expect(obj.getName()).toEqual('Box');
       });
 
-      it('Has expected name 2', () => {
+      test('Has expected name 2', () => {
         obj.cid = 'c999';
         obj.set('type', 'testType');
         expect(obj.getName()).toEqual('TestType');
       });
 
-      it('Component toHTML', () => {
+      test('Component toHTML', () => {
         expect(obj.toHTML()).toEqual('<div></div>');
       });
 
-      it('Component toHTML with attributes', () => {
+      test('Component toHTML with attributes', () => {
         obj = new Component({
           tagName: 'article',
           attributes: {
@@ -110,7 +110,7 @@ module.exports = {
         );
       });
 
-      it('Component toHTML with value-less attribute', () => {
+      test('Component toHTML with value-less attribute', () => {
         obj = new Component({
           tagName: 'div',
           attributes: {
@@ -120,7 +120,7 @@ module.exports = {
         expect(obj.toHTML()).toEqual('<div data-is-a-test=""></div>');
       });
 
-      it('Component toHTML with classes', () => {
+      test('Component toHTML with classes', () => {
         obj = new Component({
           tagName: 'article'
         });
@@ -132,13 +132,13 @@ module.exports = {
         );
       });
 
-      it('Component toHTML with children', () => {
+      test('Component toHTML with children', () => {
         obj = new Component({ tagName: 'article' }, compOpts);
         obj.get('components').add({ tagName: 'span' });
         expect(obj.toHTML()).toEqual('<article><span></span></article>');
       });
 
-      it('Component toHTML with more children', () => {
+      test('Component toHTML with more children', () => {
         obj = new Component({ tagName: 'article' }, compOpts);
         obj.get('components').add([{ tagName: 'span' }, { tagName: 'div' }]);
         expect(obj.toHTML()).toEqual(
@@ -146,12 +146,12 @@ module.exports = {
         );
       });
 
-      it('Component toHTML with no closing tag', () => {
+      test('Component toHTML with no closing tag', () => {
         obj = new Component({ void: 1 });
         expect(obj.toHTML()).toEqual('<div/>');
       });
 
-      it('Component toHTML with quotes in attribute', () => {
+      test('Component toHTML with quotes in attribute', () => {
         obj = new Component();
         let attrs = obj.get('attributes');
         attrs['data-test'] = '"value"';
@@ -161,7 +161,7 @@ module.exports = {
         );
       });
 
-      it('Manage correctly boolean attributes', () => {
+      test('Manage correctly boolean attributes', () => {
         obj = new Component();
         obj.set('attributes', {
           'data-test': 'value',
@@ -174,19 +174,19 @@ module.exports = {
         );
       });
 
-      it('Component parse empty div', () => {
+      test('Component parse empty div', () => {
         var el = document.createElement('div');
         obj = Component.isComponent(el);
         expect(obj).toEqual({ tagName: 'div' });
       });
 
-      it('Component parse span', () => {
+      test('Component parse span', () => {
         var el = document.createElement('span');
         obj = Component.isComponent(el);
         expect(obj).toEqual({ tagName: 'span' });
       });
 
-      it('setClass single class string', () => {
+      test('setClass single class string', () => {
         obj.setClass('class1');
         const result = obj.get('classes').models;
         expect(result.length).toEqual(1);
@@ -194,73 +194,73 @@ module.exports = {
         expect(result[0].get('name')).toEqual('class1');
       });
 
-      it('setClass multiple class string', () => {
+      test('setClass multiple class string', () => {
         obj.setClass('class1 class2');
         const result = obj.get('classes').models;
         expect(result.length).toEqual(2);
       });
 
-      it('setClass single class array', () => {
+      test('setClass single class array', () => {
         obj.setClass(['class1']);
         const result = obj.get('classes').models;
         expect(result.length).toEqual(1);
       });
 
-      it('setClass multiple class array', () => {
+      test('setClass multiple class array', () => {
         obj.setClass(['class1', 'class2']);
         const result = obj.get('classes').models;
         expect(result.length).toEqual(2);
       });
 
-      it('addClass multiple array', () => {
+      test('addClass multiple array', () => {
         obj.addClass(['class1', 'class2']);
         const result = obj.get('classes').models;
         expect(result.length).toEqual(2);
       });
 
-      it('addClass avoid same name classes', () => {
+      test('addClass avoid same name classes', () => {
         obj.addClass(['class1', 'class2']);
         obj.addClass(['class1', 'class3']);
         const result = obj.get('classes').models;
         expect(result.length).toEqual(3);
       });
 
-      it('removeClass by string', () => {
+      test('removeClass by string', () => {
         obj.addClass(['class1', 'class2']);
         obj.removeClass('class2');
         const result = obj.get('classes').models;
         expect(result.length).toEqual(1);
       });
 
-      it('removeClass by string with multiple classes', () => {
+      test('removeClass by string with multiple classes', () => {
         obj.addClass(['class1', 'class2']);
         obj.removeClass('class2 class1');
         const result = obj.get('classes').models;
         expect(result.length).toEqual(0);
       });
 
-      it('removeClass by array', () => {
+      test('removeClass by array', () => {
         obj.addClass(['class1', 'class2']);
         obj.removeClass(['class1', 'class2']);
         const result = obj.get('classes').models;
         expect(result.length).toEqual(0);
       });
 
-      it('removeClass do nothing with undefined classes', () => {
+      test('removeClass do nothing with undefined classes', () => {
         obj.addClass(['class1', 'class2']);
         obj.removeClass(['class3']);
         const result = obj.get('classes').models;
         expect(result.length).toEqual(2);
       });
 
-      it('removeClass actually removes classes from attributes', () => {
+      test('removeClass actually removes classes from attributes', () => {
         obj.addClass('class1');
         obj.removeClass('class1');
         const result = obj.getAttributes();
         expect(result.class).toEqual(undefined);
       });
 
-      it('setAttributes', () => {
+      test('setAttributes', () => {
         obj.setAttributes({
           id: 'test',
           'data-test': 'value',
@@ -279,20 +279,20 @@ module.exports = {
         });
       });
 
-      it('setAttributes overwrites correctly', () => {
+      test('setAttributes overwrites correctly', () => {
         obj.setAttributes({ id: 'test', 'data-test': 'value' });
         obj.setAttributes({ 'data-test': 'value2' });
         expect(obj.getAttributes()).toEqual({ 'data-test': 'value2' });
       });
 
-      it('append() returns always an array', () => {
+      test('append() returns always an array', () => {
         let result = obj.append('<span>text1</span>');
         expect(result.length).toEqual(1);
         result = obj.append('<span>text1</span><div>text2</div>');
         expect(result.length).toEqual(2);
       });
 
-      it('append() new components as string', () => {
+      test('append() new components as string', () => {
         obj.append('<span>text1</span><div>text2</div>');
         const comps = obj.components();
         expect(comps.length).toEqual(2);
@@ -300,7 +300,7 @@ module.exports = {
         expect(comps.models[1].get('tagName')).toEqual('div');
       });
 
-      it('append() new components as Objects', () => {
+      test('append() new components as Objects', () => {
         obj.append([{}, {}]);
         const comps = obj.components();
         expect(comps.length).toEqual(2);
@@ -308,7 +308,7 @@ module.exports = {
         expect(comps.length).toEqual(3);
       });
 
-      it('components() set new collection', () => {
+      test('components() set new collection', () => {
         obj.append([{}, {}]);
         obj.components('<span>test</div>');
         const result = obj.components();
@@ -316,7 +316,7 @@ module.exports = {
         expect(result.models[0].get('tagName')).toEqual('span');
       });
 
-      it('Propagate properties to children', () => {
+      test('Propagate properties to children', () => {
         obj.append({ propagate: 'removable' });
         const result = obj.components();
         const newObj = result.models[0];
@@ -328,7 +328,7 @@ module.exports = {
         expect(child.get('propagate')).toEqual(['removable']);
       });
 
-      it('Ability to stop/change propagation chain', () => {
+      test('Ability to stop/change propagation chain', () => {
         obj.append({
           removable: false,
           draggable: false,
@@ -379,20 +379,20 @@ module.exports = {
         obj = null;
       });
 
-      it('Has src property', () => {
+      test('Has src property', () => {
         expect(obj.has('src')).toEqual(true);
       });
 
-      it('Not droppable', () => {
+      test('Not droppable', () => {
         expect(obj.get('droppable')).toEqual(false);
       });
 
-      it('ComponentImage toHTML', () => {
+      test('ComponentImage toHTML', () => {
         obj = new ComponentImage();
         expect(obj.toHTML()).toEqual('<img/>');
       });
 
-      it('Component toHTML with attributes', () => {
+      test('Component toHTML with attributes', () => {
         obj = new ComponentImage({
           attributes: { alt: 'AltTest' },
           src: 'testPath'
@@ -400,19 +400,19 @@ module.exports = {
         expect(obj.toHTML()).toEqual('<img alt="AltTest" src="testPath"/>');
       });
 
-      it('Refuse not img element', () => {
+      test('Refuse not img element', () => {
         var el = document.createElement('div');
         obj = ComponentImage.isComponent(el);
         expect(obj).toEqual('');
       });
 
-      it('Component parse img element', () => {
+      test('Component parse img element', () => {
         var el = document.createElement('img');
         obj = ComponentImage.isComponent(el);
         expect(obj).toEqual({ type: 'image' });
       });
 
-      it('Component parse img element with src', () => {
+      test('Component parse img element with src', () => {
         var el = document.createElement('img');
         el.src = 'http://localhost/';
         obj = ComponentImage.isComponent(el);
@@ -429,15 +429,15 @@ module.exports = {
         obj = null;
       });
 
-      it('Has content property', () => {
+      test('Has content property', () => {
         expect(obj.has('content')).toEqual(true);
       });
 
-      it('Not droppable', () => {
+      test('Not droppable', () => {
         expect(obj.get('droppable')).toEqual(false);
       });
 
-      it('Component toHTML with attributes', () => {
+      test('Component toHTML with attributes', () => {
         obj = new ComponentText({
           attributes: { 'data-test': 'value' },
           content: 'test content'
@@ -451,24 +451,24 @@ module.exports = {
     describe('Link Component', () => {
       const aEl = document.createElement('a');
 
-      it('Component parse link element', () => {
+      test('Component parse link element', () => {
         obj = ComponentLink.isComponent(aEl);
         expect(obj).toEqual({ type: 'link' });
       });
 
-      it('Component parse link element with text content', () => {
+      test('Component parse link element with text content', () => {
         aEl.innerHTML = 'some text here ';
         obj = ComponentLink.isComponent(aEl);
         expect(obj).toEqual({ type: 'link' });
       });
 
-      it('Component parse link element with not only text content', () => {
+      test('Component parse link element with not only text content', () => {
         aEl.innerHTML = '<div>Some</div> text <div>here </div>';
         obj = ComponentLink.isComponent(aEl);
         expect(obj).toEqual({ type: 'link' });
       });
 
-      it('Component parse link element with only not text content', () => {
+      test('Component parse link element with only not text content', () => {
         aEl.innerHTML = `<div>Some</div>
         <div>text</div>
         <div>here </div>`;
@@ -476,7 +476,7 @@ module.exports = {
         expect(obj).toEqual({ type: 'link', editable: 0 });
       });
 
-      it('Link element with only an image inside is not editable', () => {
+      test('Link element with only an image inside is not editable', () => {
         aEl.innerHTML = '<img src="##"/>';
         obj = ComponentLink.isComponent(aEl);
         expect(obj).toEqual({ type: 'link', editable: 0 });
@@ -484,7 +484,7 @@ module.exports = {
     });
 
     describe('Map Component', () => {
-      it('Component parse map iframe', () => {
+      test('Component parse map iframe', () => {
         var src =
           'https://maps.google.com/maps?&q=London,UK&z=11&t=q&output=embed';
         var el = $('<iframe src="' + src + '"></iframe>');
@@ -492,7 +492,7 @@ module.exports = {
         expect(obj).toEqual({ type: 'map', src });
       });
 
-      it('Component parse not map iframe', () => {
+      test('Component parse not map iframe', () => {
         var el = $(
           '<iframe src="https://www.youtube.com/watch?v=jNQXAC9IVRw"></iframe>'
         );
@@ -502,21 +502,21 @@ module.exports = {
     });
 
     describe('Video Component', () => {
-      it('Component parse video', () => {
+      test('Component parse video', () => {
         var src = 'http://localhost/';
         var el = $('<video src="' + src + '"></video>');
         obj = ComponentVideo.isComponent(el.get(0));
         expect(obj).toEqual({ type: 'video', src });
       });
 
-      it('Component parse youtube video iframe', () => {
+      test('Component parse youtube video iframe', () => {
         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 });
       });
 
-      it('Component parse vimeo video iframe', () => {
+      test('Component parse vimeo video iframe', () => {
         var src = 'http://player.vimeo.com/video/2?';
         var el = $('<iframe src="' + src + '"></video>');
         obj = ComponentVideo.isComponent(el.get(0));
@@ -532,19 +532,19 @@ module.exports = {
         };
       });
 
-      it('Creates component correctly', () => {
+      test('Creates component correctly', () => {
         var c = new Components({}, compOpts);
         var m = c.add({});
         expect(m instanceof Component).toEqual(true);
       });
 
-      it('Creates image component correctly', () => {
+      test('Creates image component correctly', () => {
         var c = new Components({}, compOpts);
         var m = c.add({ type: 'image' });
         expect(m instanceof ComponentImage).toEqual(true);
       });
 
-      it('Creates text component correctly', () => {
+      test('Creates text component correctly', () => {
         var c = new Components({}, compOpts);
         var m = c.add({ type: 'text' });
         expect(m instanceof ComponentText).toEqual(true);

test/specs/dom_components/view/ComponentImageView.js

@@ -20,21 +20,21 @@ module.exports = {
         view.remove();
       });
 
-      it('Component empty', () => {
+      test('Component empty', () => {
         expect(view.el.getAttribute('onmousedown')).toEqual('return false');
         expect(view.el.getAttribute('class')).toEqual(view.classEmpty);
       });
 
-      it('TagName is <img>', () => {
+      test('TagName is <img>', () => {
         expect(view.el.tagName).toEqual('IMG');
       });
 
-      it('Update src attribute', () => {
+      test('Update src attribute', () => {
         model.set('src', './');
         expect(view.el.getAttribute('src')).toEqual('./');
       });
 
-      it('Renders correctly', () => {
+      test('Renders correctly', () => {
         expect(view.render()).toExist();
       });
     });

test/specs/dom_components/view/ComponentTextView.js

@@ -22,20 +22,20 @@ module.exports = {
         view.remove();
       });
 
-      it('Component empty', () => {
+      test('Component empty', () => {
         expect(fixtures.innerHTML).toEqual(
           '<div data-gjs-type="default" data-highlightable="1"></div>'
         );
       });
 
-      it('Input content is stored in model', () => {
+      test('Input content is stored in model', () => {
         //view.enableEditing();
         view.el.innerHTML = 'test';
         //view.disableEditing();
         //model.get('content').should.equal('test');
       });
 
-      it('Init with content', () => {
+      test('Init with content', () => {
         model = new Component({ content: 'test' });
         view = new ComponentTextView({ model });
         fixtures.appendChild(view.render().el);

test/specs/dom_components/view/ComponentV.js

@@ -34,13 +34,13 @@ module.exports = {
         view.remove();
       });
 
-      it('Component empty', () => {
+      test('Component empty', () => {
         expect(fixtures.innerHTML).toEqual(
           '<div data-gjs-type="default" data-highlightable="1"></div>'
         );
       });
 
-      it('Add helper class on update of state', () => {
+      test('Add helper class on update of state', () => {
         model.set('state', 'test');
         expect(fixtures.innerHTML).toEqual(
           '<div data-gjs-type="default" data-highlightable="1" class="' +
@@ -49,7 +49,7 @@ module.exports = {
         );
       });
 
-      it('Clean form helper state', () => {
+      test('Clean form helper state', () => {
         model.set('state', 'test');
         model.set('state', '');
         expect(fixtures.innerHTML).toEqual(
@@ -57,19 +57,19 @@ module.exports = {
         );
       });
 
-      it('Add helper class on status update', () => {
+      test('Add helper class on status update', () => {
         model.set('status', 'selected');
         expect(fixtures.innerHTML).toEqual(
           '<div data-gjs-type="default" data-highlightable="1" class="selected"></div>'
         );
       });
 
-      it('Get string of classes', () => {
+      test('Get string of classes', () => {
         model.set('attributes', { class: ['test', 'test2'] });
         expect(view.getClasses()).toEqual('test test2');
       });
 
-      it('Update attributes', () => {
+      test('Update attributes', () => {
         model.set('attributes', {
           title: 'value',
           'data-test': 'value2'
@@ -78,7 +78,7 @@ module.exports = {
         expect(view.el.getAttribute('data-test')).toEqual('value2');
       });
 
-      it('Update style', () => {
+      test('Update style', () => {
         model.set('style', {
           color: 'red',
           float: 'left'
@@ -86,30 +86,30 @@ module.exports = {
         expect(view.el.getAttribute('style')).toEqual('color:red;float:left;');
       });
 
-      it('Clean style', () => {
+      test('Clean style', () => {
         model.set('style', { color: 'red' });
         model.set('style', {});
         expect(view.el.getAttribute('style')).toEqual(null);
       });
 
-      it('Add class', () => {
+      test('Add class', () => {
         model.get('classes').add({ name: 'test' });
         expect(view.el.getAttribute('class')).toEqual('test');
       });
 
-      it('Add classes', () => {
+      test('Add classes', () => {
         model.get('classes').add([{ name: 'test' }, { name: 'test2' }]);
         expect(view.el.getAttribute('class')).toEqual('test test2');
       });
 
-      it('Update on remove of some class', () => {
+      test('Update on remove of some class', () => {
         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', () => {
+      test('Init with different tag', () => {
         model = new Component({ tagName: 'span' });
         view = new ComponentView({ model });
         fixtures.innerHTML = '';
@@ -117,7 +117,7 @@ module.exports = {
         expect(view.render().el.tagName).toEqual('SPAN');
       });
 
-      it('Init with nested components', () => {
+      test('Init with nested components', () => {
         model = new Component(
           {
             components: [{ tagName: 'span' }, { attributes: { title: 'test' } }]
@@ -135,7 +135,7 @@ module.exports = {
         );
       });
 
-      it('removeClass removes classes from attributes', () => {
+      test('removeClass removes classes from attributes', () => {
         model.addClass('class1');
         model.removeClass('class1');
         const result = model.getAttributes();

test/specs/dom_components/view/ComponentsView.js

@@ -30,17 +30,17 @@ module.exports = {
         view.collection.reset();
       });
 
-      it('Collection is empty', () => {
+      test('Collection is empty', () => {
         expect(view.$el.html()).toNotExist();
       });
 
-      it('Add new component', () => {
+      test('Add new component', () => {
         sinon.stub(view, 'addToCollection');
         view.collection.add({});
         expect(view.addToCollection.calledOnce).toEqual(true);
       });
 
-      it('Render new component', () => {
+      test('Render new component', () => {
         view.collection.add({});
         expect(view.$el.html()).toExist();
       });

test/specs/grapesjs/index.js

@@ -23,7 +23,7 @@ describe('GrapesJS', () => {
       }
     };
 
-    before(() => {
+    beforeAll(() => {
       editorName = 'editor-fixture';
     });
 
@@ -55,16 +55,16 @@ describe('GrapesJS', () => {
       }
     });
 
-    it('Main object should be loaded', () => {
+    test('Main object should be loaded', () => {
       expect(obj).toExist();
     });
 
-    it('Init new editor', () => {
+    test('Init new editor', () => {
       var editor = obj.init(config);
       expect(editor).toExist();
     });
 
-    it('Init new editor with node for container', () => {
+    test('Init new editor with node for container', () => {
       var configAlt = {
         container: document.createElement('div'),
         storageManager: {
@@ -76,7 +76,7 @@ describe('GrapesJS', () => {
       expect(editor).toExist();
     });
 
-    it('New editor is empty', () => {
+    test('New editor is empty', () => {
       var editor = obj.init(config);
       var html = editor.getHtml();
       //var css = editor.getCss();
@@ -87,7 +87,7 @@ describe('GrapesJS', () => {
       expect(editor.getStyle().length).toEqual(0);
     });
 
-    it('Editor canvas baseCSS can be overwritten', () => {
+    test('Editor canvas baseCSS can be overwritten', () => {
       config.components = htmlString;
       config.baseCss = '#wrapper { background-color: #eee; }';
       config.protectedCss = '';
@@ -102,7 +102,7 @@ describe('GrapesJS', () => {
       margin: 0;`);
     });
 
-    it('Editor canvas baseCSS defaults to sensible values if not defined', () => {
+    test('Editor canvas baseCSS defaults to sensible values if not defined', () => {
       config.components = htmlString;
       config.protectedCss = '';
 
@@ -110,10 +110,10 @@ describe('GrapesJS', () => {
 
       expect(window.frames[0].document.documentElement.outerHTML)
         .toInclude(`body {
-      margin: 0;`);
+        margin: 0;`);
     });
 
-    it('Init editor with html', () => {
+    test('Init editor with html', () => {
       config.components = htmlString;
       var editor = obj.init(config);
       var comps = editor.DomComponents.getComponents();
@@ -127,7 +127,7 @@ describe('GrapesJS', () => {
       ).toEqual('test1');
     });
 
-    it('Init editor with css', () => {
+    test('Init editor with css', () => {
       config.style = cssString;
       var editor = obj.init(config);
       var rules = editor.CssComposer.getAll();
@@ -141,7 +141,7 @@ describe('GrapesJS', () => {
       ).toEqual('test2');
     });
 
-    it('Init editor from element', () => {
+    test('Init editor from element', () => {
       config.fromElement = 1;
       config.storageManager = { type: 0 };
       fixture.innerHTML = documentEl;
@@ -157,7 +157,7 @@ describe('GrapesJS', () => {
       expect(editor.getStyle().length).toEqual(2);
     });
 
-    it('Init editor from element with multiple font-face at-rules', () => {
+    test('Init editor from element with multiple font-face at-rules', () => {
       config.fromElement = 1;
       config.storageManager = { type: 0 };
       fixture.innerHTML =
@@ -178,19 +178,19 @@ describe('GrapesJS', () => {
       expect(styles.length).toEqual(2);
     });
 
-    it('Set components as HTML', () => {
+    test('Set components as HTML', () => {
       var editor = obj.init(config);
       editor.setComponents(htmlString);
       expect(editor.getComponents().length).toEqual(2);
     });
 
-    it('Set components as array of objects', () => {
+    test('Set components as array of objects', () => {
       var editor = obj.init(config);
       editor.setComponents([{}, {}, {}]);
       expect(editor.getComponents().length).toEqual(3);
     });
 
-    it('Set style as CSS', () => {
+    test('Set style as CSS', () => {
       var editor = obj.init(config);
       editor.setStyle(cssString);
       editor.setStyle(cssString);
@@ -205,7 +205,7 @@ describe('GrapesJS', () => {
       ).toEqual('test3');
     });
 
-    it('Set style as as array of objects', () => {
+    test('Set style as as array of objects', () => {
       var editor = obj.init(config);
       editor.setStyle([{ selectors: ['test4'] }, { selectors: ['test5'] }]);
       var styles = editor.getStyle();
@@ -219,7 +219,7 @@ describe('GrapesJS', () => {
       ).toEqual('test5');
     });
 
-    it.skip('Adds new storage as plugin and store data there', done => {
+    test.skip('Adds new storage as plugin and store data there', done => {
       const pluginName = storageId + '-p2';
       obj.plugins.add(pluginName, e =>
         e.StorageManager.add(storageId, storageMock)
@@ -236,7 +236,7 @@ describe('GrapesJS', () => {
       });
     });
 
-    it('Adds a new storage and fetch correctly data from it', done => {
+    test('Adds a new storage and fetch correctly data from it', done => {
       fixture.innerHTML = documentEl;
       const styleResult = { color: 'white', display: 'block' };
       const style = [
@@ -275,7 +275,7 @@ describe('GrapesJS', () => {
       });
     });
 
-    it('Execute plugins with custom options', () => {
+    test('Execute plugins with custom options', () => {
       var pluginName = storageId + '-plugin-opts';
       obj.plugins.add(pluginName, (edt, opts) => {
         var opts = opts || {};
@@ -288,7 +288,7 @@ describe('GrapesJS', () => {
       expect(editor.customValue).toEqual('TEST');
     });
 
-    it('Execute custom command', () => {
+    test('Execute custom command', () => {
       var editor = obj.init(config);
       editor.testVal = '';
       editor.setComponents(htmlString);
@@ -301,7 +301,7 @@ describe('GrapesJS', () => {
       expect(editor.testVal).toEqual(htmlString + '5');
     });
 
-    it('Stop custom command', () => {
+    test('Stop custom command', () => {
       var editor = obj.init(config);
       editor.testVal = '';
       editor.setComponents(htmlString);
@@ -314,7 +314,7 @@ describe('GrapesJS', () => {
       expect(editor.testVal).toEqual(htmlString + '5');
     });
 
-    it('Trigger custom command events', () => {
+    test('Trigger custom command events', () => {
       const id = 'test-command';
       const editor = obj.init(config);
       const result = {};
@@ -340,7 +340,7 @@ describe('GrapesJS', () => {
       });
     });
 
-    it('Set default devices', () => {
+    test('Set default devices', () => {
       config.deviceManager = {};
       config.deviceManager.devices = [
         { name: '1', width: '2' },
@@ -350,19 +350,19 @@ describe('GrapesJS', () => {
       expect(editor.DeviceManager.getAll().length).toEqual(2);
     });
 
-    it('There is no active device', () => {
+    test('There is no active device', () => {
       var editor = obj.init(config);
       expect(editor.getDevice()).toNotExist();
     });
 
-    it('Active another device', () => {
+    test('Active another device', () => {
       var editor = obj.init(config);
       editor.setDevice('Tablet');
       expect(editor.getDevice()).toEqual('Tablet');
     });
 
     // Problems with iframe loading
-    it('Init new editor with custom plugin overrides default commands', () => {
+    test('Init new editor with custom plugin overrides default commands', () => {
       var editor,
         pluginName = 'test-plugin-opts';
 
@@ -377,7 +377,7 @@ describe('GrapesJS', () => {
       expect(editor.Commands.get('export-template').test).toEqual(1);
     });
 
-    it('Keep unused css classes/selectors option for getCSS method', () => {
+    test('Keep unused css classes/selectors option for getCSS method', () => {
       config.fromElement = 1;
       config.storageManager = { type: 0 };
       fixture.innerHTML = documentEl;
@@ -388,7 +388,7 @@ describe('GrapesJS', () => {
       expect(css).toEqual(`${protCss}.test2{color:red;}.test3{color:blue;}`);
     });
 
-    it('Keep unused css classes/selectors option for media rules', () => {
+    test('Keep unused css classes/selectors option for media rules', () => {
       cssString =
         '.test2{color:red}.test3{color:blue} @media only screen and (max-width: 620px) { .notused { color: red; } } ';
       documentEl = '<style>' + cssString + '</style>' + htmlString;
@@ -404,7 +404,7 @@ describe('GrapesJS', () => {
       );
     });
 
-    it('Keep unused css classes/selectors option for init method', () => {
+    test('Keep unused css classes/selectors option for init method', () => {
       config.fromElement = 1;
       config.storageManager = { type: 0 };
       fixture.innerHTML = documentEl;

test/specs/keymaps/index.js

@@ -11,16 +11,16 @@ describe('Keymaps', () => {
       obj = new Keymaps().init({ em });
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(obj).toExist();
     });
 
-    it('No keymaps inside', () => {
+    test('No keymaps inside', () => {
       var coll = obj.getAll();
       expect(coll).toEqual({});
     });
 
-    it('Add new keymap', () => {
+    test('Add new keymap', () => {
       const id = 'test';
       const keys = 'ctrl+a';
       const handler = () => {};
@@ -28,14 +28,14 @@ describe('Keymaps', () => {
       expect(obj.get(id)).toEqual({ id, keys, handler });
     });
 
-    it('Add keymap event triggers', () => {
+    test('Add keymap event triggers', () => {
       let called = 0;
       em.on('keymap:add', () => (called = 1));
       const model = obj.add('tes', 'ctrl+a');
       expect(called).toEqual(1);
     });
 
-    it('Remove keymap', () => {
+    test('Remove keymap', () => {
       const id = 'test';
       const keys = 'ctrl+a';
       const handler = () => {};
@@ -46,7 +46,7 @@ describe('Keymaps', () => {
       expect(removed).toEqual({ id, keys, handler });
     });
 
-    it('Remove keymap event triggers', () => {
+    test('Remove keymap event triggers', () => {
       let called = 0;
       em.on('keymap:remove', () => (called = 1));
       const model = obj.add('tes', 'ctrl+a');

test/specs/modal/index.js

@@ -13,43 +13,43 @@ describe('Modal dialog', () => {
       obj = null;
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(obj).toExist();
     });
 
-    it('Is close by default', () => {
+    test('Is close by default', () => {
       expect(obj.isOpen()).toEqual(false);
     });
 
-    it('Title is empty', () => {
+    test('Title is empty', () => {
       expect(obj.getTitle()).toEqual('');
     });
 
-    it('Content is empty', () => {
+    test('Content is empty', () => {
       expect(obj.getContent()).toEqual('');
     });
 
-    it('Set title', () => {
+    test('Set title', () => {
       obj.setTitle('Test');
       expect(obj.getTitle()).toEqual('Test');
     });
 
-    it('Set content', () => {
+    test('Set content', () => {
       obj.setContent('Test');
       expect(obj.getContent()).toEqual('Test');
     });
 
-    it('Set HTML content', () => {
+    test('Set HTML content', () => {
       obj.setContent('<h1>Test</h1>');
       expect(obj.getContent()).toEqual('<h1>Test</h1>');
     });
 
-    it('Open modal', () => {
+    test('Open modal', () => {
       obj.open();
       expect(obj.isOpen()).toEqual(true);
     });
 
-    it('Close modal', () => {
+    test('Close modal', () => {
       obj.open();
       obj.close();
       expect(obj.isOpen()).toEqual(false);

test/specs/modal/view/ModalView.js

@@ -22,34 +22,34 @@ module.exports = {
         model = null;
       });
 
-      it('The content is not empty', () => {
+      test('The content is not empty', () => {
         expect(view.el.innerHTML).toExist();
       });
 
-      it('Get content', () => {
+      test('Get content', () => {
         expect(view.getContent()).toExist();
       });
 
-      it('Update content', () => {
+      test('Update content', () => {
         model.set('content', 'test');
         expect(view.getContent().get(0).innerHTML).toEqual('test');
       });
 
-      it('Get title', () => {
+      test('Get title', () => {
         expect(view.getTitle()).toExist();
       });
 
-      it('Update title', () => {
+      test('Update title', () => {
         model.set('title', 'test');
         expect(view.getTitle().innerHTML).toEqual('test');
       });
 
-      it('Close by default', () => {
+      test('Close by default', () => {
         view.updateOpen();
         expect(view.el.style.display).toEqual('none');
       });
 
-      it('Open dialog', () => {
+      test('Open dialog', () => {
         model.set('open', 1);
         expect(view.el.style.display).toEqual('');
       });

test/specs/panels/e2e/PanelsE2e.js

@@ -7,7 +7,7 @@ module.exports = {
       var config;
       var editorName = 'panel-fixture';
 
-      before(() => {
+      beforeAll(() => {
         fixtures = $('<div id="#fixtures"></div>').appendTo('body');
       });
 
@@ -27,11 +27,11 @@ module.exports = {
         fixture.remove();
       });
 
-      after(() => {
+      afterAll(() => {
         //fixture.remove();
       });
 
-      it('Command is correctly executed on button click', () => {
+      test('Command is correctly executed on button click', () => {
         var commandId = 'command-test';
         config.commands = {
           defaults: [

test/specs/panels/index.js

@@ -18,45 +18,45 @@ describe('Panels', () => {
       obj = null;
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(obj).toExist();
     });
 
-    it('No panels inside', () => {
+    test('No panels inside', () => {
       expect(obj.getPanels().length).toEqual(3);
     });
 
-    it('Adds new panel correctly via object', () => {
+    test('Adds new panel correctly via object', () => {
       var panel = obj.addPanel({ id: 'test' });
       expect(panel.get('id')).toEqual('test');
     });
 
-    it('New panel has no buttons', () => {
+    test('New panel has no buttons', () => {
       var panel = obj.addPanel({ id: 'test' });
       expect(panel.get('buttons').length).toEqual(0);
     });
 
-    it('Adds new panel correctly via Panel instance', () => {
+    test('Adds new panel correctly via Panel instance', () => {
       var oPanel = new obj.Panel({ id: 'test' });
       var panel = obj.addPanel(oPanel);
       expect(panel).toEqual(oPanel);
       expect(panel.get('id')).toEqual('test');
     });
 
-    it('getPanel returns null in case there is no requested panel', () => {
+    test('getPanel returns null in case there is no requested panel', () => {
       expect(obj.getPanel('test')).toEqual(null);
     });
 
-    it('getPanel returns correctly the panel', () => {
+    test('getPanel returns correctly the panel', () => {
       var panel = obj.addPanel({ id: 'test' });
       expect(obj.getPanel('test')).toEqual(panel);
     });
 
-    it("Can't add button to non existent panel", () => {
+    test("Can't add button to non existent panel", () => {
       expect(obj.addButton('test', { id: 'btn' })).toEqual(null);
     });
 
-    it('Add button correctly', () => {
+    test('Add button correctly', () => {
       var panel = obj.addPanel({ id: 'test' });
       var btn = obj.addButton('test', { id: 'btn' });
       expect(panel.get('buttons').length).toEqual(1);
@@ -68,26 +68,26 @@ describe('Panels', () => {
       ).toEqual('btn');
     });
 
-    it('getButton returns null in case there is no requested panel', () => {
+    test('getButton returns null in case there is no requested panel', () => {
       expect(obj.addButton('test', 'btn')).toEqual(null);
     });
 
-    it('getButton returns null in case there is no requested button', () => {
+    test('getButton returns null in case there is no requested button', () => {
       var panel = obj.addPanel({ id: 'test' });
       expect(obj.getButton('test', 'btn')).toEqual(null);
     });
 
-    it('getButton returns correctly the button', () => {
+    test('getButton returns correctly the button', () => {
       var panel = obj.addPanel({ id: 'test' });
       var btn = obj.addButton('test', { id: 'btn' });
       expect(obj.getButton('test', 'btn')).toEqual(btn);
     });
 
-    it('Renders correctly', () => {
+    test('Renders correctly', () => {
       expect(obj.render()).toExist();
     });
 
-    it('Active correctly activable buttons', () => {
+    test('Active correctly activable buttons', () => {
       var spy = sinon.spy();
       var panel = obj.addPanel({ id: 'test' });
       var btn = obj.addButton('test', { id: 'btn', active: true });
@@ -96,7 +96,7 @@ describe('Panels', () => {
       expect(spy.called).toEqual(true);
     });
 
-    it('Disable correctly buttons flagged as disabled', () => {
+    test('Disable correctly buttons flagged as disabled', () => {
       var spy = sinon.spy();
       var panel = obj.addPanel({ id: 'test' });
       var btn = obj.addButton('test', { id: 'btn', disable: true });
@@ -105,12 +105,12 @@ describe('Panels', () => {
       expect(spy.called).toEqual(true);
     });
 
-    it("Can't remove button to non existent panel", () => {
+    test("Can't remove button to non existent panel", () => {
       expect(obj.removeButton('test', { id: 'btn' })).toEqual(null);
     });
 
     describe('Removes button', () => {
-      it('Remove button correctly with object', () => {
+      test('Remove button correctly with object', () => {
         var panel = obj.addPanel({ id: 'test' });
         var btn = obj.addButton('test', { id: 'btn' });
         expect(panel.get('buttons').length).toEqual(1);
@@ -124,7 +124,7 @@ describe('Panels', () => {
         expect(panel.get('buttons').length).toEqual(0);
       });
 
-      it('Remove button correctly with sting', () => {
+      test('Remove button correctly with sting', () => {
         var panel = obj.addPanel({ id: 'test' });
         var btn = obj.addButton('test', { id: 'btn' });
         expect(panel.get('buttons').length).toEqual(1);
@@ -140,14 +140,14 @@ describe('Panels', () => {
     });
 
     describe('Removes Panel', () => {
-      it('Removes panel correctly via object', () => {
+      test('Removes panel correctly via object', () => {
         var panel = obj.addPanel({ id: 'test' });
         expect(panel.get('id')).toEqual('test');
         obj.removePanel({ id: 'test' });
         expect(panel.get('id')).toEqual('test');
       });
 
-      it('Removes panel correctly via Panel instance', () => {
+      test('Removes panel correctly via Panel instance', () => {
         var oPanel = new obj.Panel({ id: 'test' });
         var panel = obj.addPanel(oPanel);
         expect(panel).toEqual(oPanel);
@@ -156,7 +156,7 @@ describe('Panels', () => {
         expect(obj.getPanels.length).toEqual(0);
       });
 
-      it('Removes panel correctly via id', () => {
+      test('Removes panel correctly via id', () => {
         var oPanel = new obj.Panel({ id: 'test' });
         var panel = obj.addPanel(oPanel);
         expect(panel).toEqual(oPanel);

test/specs/panels/model/PanelModels.js

@@ -16,15 +16,15 @@ module.exports = {
         obj = null;
       });
 
-      it('Has buttons instance', () => {
+      test('Has buttons instance', () => {
         expect(obj.has('buttons')).toEqual(true);
       });
 
-      it('Has no buttons', () => {
+      test('Has no buttons', () => {
         expect(obj.get('buttons').length).toEqual(0);
       });
 
-      it('Init with other buttons inside correctly', () => {
+      test('Init with other buttons inside correctly', () => {
         obj = new Button({
           buttons: [{}]
         });
@@ -32,7 +32,7 @@ module.exports = {
         expect(obj.get('buttons').length).toEqual(1);
       });
 
-      it('Has a disable attribute with default value as false', () => {
+      test('Has a disable attribute with default value as false', () => {
         expect(obj.get('disable')).toEqual(false);
       });
     });
@@ -48,43 +48,43 @@ module.exports = {
         obj = null;
       });
 
-      it('Deactivates buttons', () => {
+      test('Deactivates buttons', () => {
         obj.add({ active: true });
         obj.deactivateAll();
         expect(obj.at(0).get('active')).toEqual(false);
       });
 
-      it('Deactivates buttons with context', () => {
+      test('Deactivates buttons with context', () => {
         obj.add({ active: true });
         obj.deactivateAll('someContext');
         expect(obj.at(0).get('active')).toEqual(true);
       });
 
-      it('Deactivates except one', () => {
+      test('Deactivates except one', () => {
         var btn = obj.add({ active: true });
         obj.deactivateAllExceptOne();
         expect(obj.at(0).get('active')).toEqual(false);
       });
 
-      it('Deactivates except one with model', () => {
+      test('Deactivates except one with model', () => {
         var btn = obj.add({ active: true });
         obj.deactivateAllExceptOne(btn);
         expect(obj.at(0).get('active')).toEqual(true);
       });
 
-      it('Disable all buttons', () => {
+      test('Disable all buttons', () => {
         obj.add({ disable: false });
         obj.disableAllButtons();
         expect(obj.at(0).get('disable')).toEqual(true);
       });
 
-      it('Disables buttons with context', () => {
+      test('Disables buttons with context', () => {
         obj.add({ disable: false, context: 'someContext' });
         obj.disableAllButtons('someContext');
         expect(obj.at(0).get('disable')).toEqual(true);
       });
 
-      it('Disables except one', () => {
+      test('Disables except one', () => {
         var btn = obj.add({ disable: false });
         obj.disableAllButtonsExceptOne(btn);
         expect(obj.at(0).get('disable')).toEqual(false);
@@ -102,16 +102,16 @@ module.exports = {
         obj = null;
       });
 
-      it('Has buttons instance', () => {
+      test('Has buttons instance', () => {
         expect(obj.has('buttons')).toEqual(true);
         expect(obj.get('buttons') instanceof Buttons).toEqual(true);
       });
 
-      it('Has no buttons', () => {
+      test('Has no buttons', () => {
         expect(obj.get('buttons').length).toEqual(0);
       });
 
-      it('Init with buttons inside correctly', () => {
+      test('Init with buttons inside correctly', () => {
         obj = new Panel({
           buttons: [{}]
         });

test/specs/panels/view/ButtonView.js

@@ -23,31 +23,31 @@ module.exports = {
         view.remove();
       });
 
-      it('Button empty', () => {
+      test('Button empty', () => {
         expect(fixtures.innerHTML).toEqual(
           '<span class="' + btnClass + '"></span>'
         );
       });
 
-      it('Update class', () => {
+      test('Update class', () => {
         model.set('className', 'test');
         expect(view.el.getAttribute('class')).toEqual(btnClass + ' test');
       });
 
-      it('Update attributes', () => {
+      test('Update attributes', () => {
         model.set('attributes', {
           'data-test': 'test-value'
         });
         expect(view.el.getAttribute('data-test')).toEqual('test-value');
       });
 
-      it('Check enable active', () => {
+      test('Check enable active', () => {
         model.set('active', true, { silent: true });
         view.checkActive();
         expect(view.el.getAttribute('class')).toContain(btnClass + ' active');
       });
 
-      it('Check disable active', () => {
+      test('Check disable active', () => {
         model.set('active', true, { silent: true });
         view.checkActive();
         model.set('active', false, { silent: true });
@@ -55,13 +55,13 @@ module.exports = {
         expect(view.el.getAttribute('class')).toEqual(btnClass);
       });
 
-      it('Disable the button', () => {
+      test('Disable the button', () => {
         model.set('disable', true, { silent: true });
         view.updateDisable();
         expect(view.el.getAttribute('class')).toEqual(btnClass + ' active');
       });
 
-      it('Enable the disabled button', () => {
+      test('Enable the disabled button', () => {
         model.set('disable', true, { silent: true });
         view.updateDisable();
         expect(view.el.getAttribute('class')).toEqual(btnClass + ' active');
@@ -70,21 +70,21 @@ module.exports = {
         expect(view.el.getAttribute('class')).toEqual(btnClass);
       });
 
-      it('Cancels the click action when button is disabled', () => {
+      test('Cancels the click action when button is disabled', () => {
         const stub = sinon.stub(view, 'toogleActive');
         model.set('disable', true, { silent: true });
         view.clicked();
         expect(stub.called).toEqual(false);
       });
 
-      it('Enable the click action when button is enable', () => {
+      test('Enable the click action when button is enable', () => {
         const stub = sinon.stub(view, 'toogleActive');
         model.set('disable', false, { silent: true });
         view.clicked();
         expect(stub.called).toEqual(true);
       });
 
-      it('Renders correctly', () => {
+      test('Renders correctly', () => {
         expect(view.render()).toExist();
       });
     });

test/specs/panels/view/ButtonsView.js

@@ -22,17 +22,17 @@ module.exports = {
         view.collection.reset();
       });
 
-      it('Collection is empty', () => {
+      test('Collection is empty', () => {
         expect(view.$el.html()).toEqual('');
       });
 
-      it('Add new button', () => {
+      test('Add new button', () => {
         sinon.stub(view, 'addToCollection');
         view.collection.add({});
         expect(view.addToCollection.calledOnce).toEqual(true);
       });
 
-      it('Render new button', () => {
+      test('Render new button', () => {
         view.collection.add({});
         expect(view.$el.html()).toExist();
       });

test/specs/panels/view/PanelView.js

@@ -22,18 +22,18 @@ module.exports = {
         view.remove();
       });
 
-      it('Panel empty', () => {
+      test('Panel empty', () => {
         fixtures.firstChild.className = '';
         expect(fixtures.innerHTML).toEqual('<div class=""></div>');
       });
 
-      it('Append content', () => {
+      test('Append content', () => {
         model.set('appendContent', 'test');
         model.set('appendContent', 'test2');
         expect(view.$el.html()).toEqual('testtest2');
       });
 
-      it('Update content', () => {
+      test('Update content', () => {
         model.set('content', 'test');
         model.set('content', 'test2');
         expect(view.$el.html()).toEqual('test2');

test/specs/panels/view/PanelsView.js

@@ -23,17 +23,17 @@ module.exports = {
         view.collection.reset();
       });
 
-      it('Collection is empty', () => {
+      test('Collection is empty', () => {
         expect(view.$el.html()).toEqual('');
       });
 
-      it('Add new panel', () => {
+      test('Add new panel', () => {
         sinon.stub(view, 'addToCollection');
         view.collection.add({});
         expect(view.addToCollection.calledOnce).toEqual(true);
       });
 
-      it('Render new panel', () => {
+      test('Render new panel', () => {
         view.collection.add({});
         expect(view.$el.html()).toExist();
       });

test/specs/parser/model/ParserCss.js

@@ -14,32 +14,32 @@ module.exports = {
         obj = null;
       });
 
-      it('Parse selector', () => {
+      test('Parse selector', () => {
         var str = '.test';
         var result = [['test']];
         expect(obj.parseSelector(str).result).toEqual(result);
       });
 
-      it('Parse selectors', () => {
+      test('Parse selectors', () => {
         var str = '.test1, .test1.test2, .test2.test3';
         var result = [['test1'], ['test1', 'test2'], ['test2', 'test3']];
         expect(obj.parseSelector(str).result).toEqual(result);
       });
 
-      it('Ignore not valid selectors', () => {
+      test('Ignore not valid selectors', () => {
         var str =
           '.test1.test2, .test2 .test3, div > .test4, #test.test5, .test6';
         var result = [['test1', 'test2'], ['test6']];
         expect(obj.parseSelector(str).result).toEqual(result);
       });
 
-      it('Parse selectors with state', () => {
+      test('Parse selectors with state', () => {
         var str = '.test1. test2, .test2>test3, .test4.test5:hover';
         var result = [['test4', 'test5:hover']];
         expect(obj.parseSelector(str).result).toEqual(result);
       });
 
-      it('Parse simple rule', () => {
+      test('Parse simple rule', () => {
         var str = ' .test1 {color:red; width: 50px  }';
         var result = {
           selectors: ['test1'],
@@ -51,7 +51,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parse rule with more selectors', () => {
+      test('Parse rule with more selectors', () => {
         var str = ' .test1.test2 {color:red; test: value}';
         var result = {
           selectors: ['test1', 'test2'],
@@ -60,7 +60,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parse same rule with more selectors', () => {
+      test('Parse same rule with more selectors', () => {
         var str = ' .test1.test2, .test3{ color:red }';
         var result = [
           {
@@ -75,7 +75,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parse more rules', () => {
+      test('Parse more rules', () => {
         var str =
           ' .test1.test2, .test3{ color:red } .test4, .test5.test6{ width:10px }';
         var result = [
@@ -99,7 +99,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parse rule with state', () => {
+      test('Parse rule with state', () => {
         var str = ' .test1.test2:hover{ color:red }';
         var result = {
           selectors: ['test1', 'test2'],
@@ -109,7 +109,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parse rule with state like after', () => {
+      test('Parse rule with state like after', () => {
         var str = ' .test1.test2::after{ color:red }';
         var result = {
           selectors: ['test1', 'test2'],
@@ -119,7 +119,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parse rule with nth-x state', () => {
+      test('Parse rule with nth-x state', () => {
         var str = ' .test1.test2:nth-of-type(2n){ color:red }';
         var result = {
           selectors: ['test1', 'test2'],
@@ -130,7 +130,7 @@ module.exports = {
       });
 
       // Phantom don't find 'node.conditionText' so will skip it
-      it('Parse rule inside media query', () => {
+      test('Parse rule inside media query', () => {
         var str =
           '@media only screen and (max-width: 992px){ .test1.test2:hover{ color:red }}';
         var result = {
@@ -144,7 +144,7 @@ module.exports = {
       });
 
       // Phantom don't find 'node.conditionText' so will skip it
-      it('Parse rule inside media query', () => {
+      test('Parse rule inside media query', () => {
         var str = '@media (max-width: 992px){ .test1.test2:hover{ color:red }}';
         var result = {
           atRuleType: 'media',
@@ -157,7 +157,7 @@ module.exports = {
       });
 
       // Phantom doesn't find 'node.conditionText' so will skip it
-      it('Parse rules inside media queries', () => {
+      test('Parse rules inside media queries', () => {
         var str =
           '.test1:hover{ color:white }@media (max-width: 992px){ .test1.test2:hover{ color:red } .test2{ color: blue }}';
         var result = [
@@ -183,7 +183,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parse rules with not class-based selectors', () => {
+      test('Parse rules with not class-based selectors', () => {
         var str = ' .class1 .class2, div > .class3 { color:red }';
         var result = {
           selectors: [],
@@ -193,7 +193,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parse rule with mixed selectors', () => {
+      test('Parse rule with mixed selectors', () => {
         var str =
           ' .class1 .class2, .class3, div > .class4, .class5.class6 { color:red }';
         var result = [
@@ -210,7 +210,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parse rule with important styles', () => {
+      test('Parse rule with important styles', () => {
         var str =
           ' .test1 {color:red !important; width: 100px; height: 10px !important}';
         var result = {
@@ -224,7 +224,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parse rule with CSS variables', () => {
+      test('Parse rule with CSS variables', () => {
         var str = `:root {
             --some-color: red;
             --some-width: 55px;
@@ -241,7 +241,7 @@ module.exports = {
       });
 
       // Can't test keyframes https://github.com/NV/CSSOM/issues/95
-      it.skip('Parse rule with a keyframes at-rule', () => {
+      test.skip('Parse rule with a keyframes at-rule', () => {
         var str = `@keyframes {
           from {opacity: 0;}
           to {opacity: 1;}
@@ -263,7 +263,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parse rule with font-face at-rule', () => {
+      test('Parse rule with font-face at-rule', () => {
         var str = `@font-face {
          font-family: "Open Sans";
         }`;
@@ -277,7 +277,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parses multiple font-face at-rules', () => {
+      test('Parses multiple font-face at-rules', () => {
         const str = `
           @font-face {
             font-family: "Open Sans";
@@ -310,7 +310,7 @@ module.exports = {
         expect(parsed).toEqual(result);
       });
 
-      it('Parse ID rule', () => {
+      test('Parse ID rule', () => {
         var str = `#test { color: red }`;
         var result = {
           selectors: ['#test'],
@@ -319,7 +319,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Parse ID rule with state', () => {
+      test('Parse ID rule with state', () => {
         var str = `#test:hover { color: red }`;
         var result = {
           selectors: ['#test'],
@@ -329,7 +329,7 @@ module.exports = {
         expect(obj.parse(str)).toEqual(result);
       });
 
-      it('Avoid composed selectors with ID', () => {
+      test('Avoid composed selectors with ID', () => {
         var str = `#test.class, #test.class:hover, .class  { color: red }`;
         var result = {
           selectors: ['class'],

test/specs/parser/model/ParserHtml.js

@@ -20,19 +20,19 @@ module.exports = {
         obj = null;
       });
 
-      it('Simple div node', () => {
+      test('Simple div node', () => {
         var str = '<div></div>';
         var result = { tagName: 'div' };
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Simple article node', () => {
+      test('Simple article node', () => {
         var str = '<article></article>';
         var result = { tagName: 'article' };
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Node with attributes', () => {
+      test('Node with attributes', () => {
         var str =
           '<div id="test1" class="test2 test3" data-one="test4" strange="test5"></div>';
         var result = {
@@ -47,7 +47,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse style string to object', () => {
+      test('Parse style string to object', () => {
         var str = 'color:black; width:100px; test:value;';
         var result = {
           color: 'black',
@@ -57,7 +57,7 @@ module.exports = {
         expect(obj.parseStyle(str)).toEqual(result);
       });
 
-      it('Parse style string with values containing colon to object', () => {
+      test('Parse style string with values containing colon to object', () => {
         var str =
           'background-image:url("https://some-website.ex"); test:value;';
         var result = {
@@ -67,19 +67,19 @@ module.exports = {
         expect(obj.parseStyle(str)).toEqual(result);
       });
 
-      it('Parse class string to array', () => {
+      test('Parse class string to array', () => {
         var str = 'test1 test2    test3 test-4';
         var result = ['test1', 'test2', 'test3', 'test-4'];
         expect(obj.parseClass(str)).toEqual(result);
       });
 
-      it('Parse class string to array with special classes', () => {
+      test('Parse class string to array with special classes', () => {
         var str = 'test1 test2    test3 test-4 gjs-test';
         var result = ['test1', 'test2', 'test3', 'test-4'];
         expect(obj.parseClass(str)).toEqual(result);
       });
 
-      it('Style attribute is isolated', () => {
+      test('Style attribute is isolated', () => {
         var str =
           '<div id="test1" style="color:black; width:100px; test:value;"></div>';
         var result = {
@@ -94,7 +94,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Class attribute is isolated', () => {
+      test('Class attribute is isolated', () => {
         var str = '<div id="test1" class="test2 test3 test4"></div>';
         var result = {
           tagName: 'div',
@@ -104,7 +104,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse images nodes', () => {
+      test('Parse images nodes', () => {
         var str = '<img id="test1" src="./index.html"/>';
         var result = {
           tagName: 'img',
@@ -117,7 +117,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse text nodes', () => {
+      test('Parse text nodes', () => {
         var str = '<div id="test1">test2 </div>';
         var result = {
           tagName: 'div',
@@ -128,7 +128,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse text with few text tags', () => {
+      test('Parse text with few text tags', () => {
         var str =
           '<div id="test1"><br/> test2 <br/> a b <b>b</b> <i>i</i> <u>u</u> test </div>';
         var result = {
@@ -183,7 +183,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse text with few text tags and nested node', () => {
+      test('Parse text with few text tags and nested node', () => {
         var str =
           '<div id="test1">a b <b>b</b> <i>i</i>c <div>ABC</div> <i>i</i> <u>u</u> test </div>';
         var result = {
@@ -251,7 +251,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse nested nodes', () => {
+      test('Parse nested nodes', () => {
         var str =
           '<article id="test1">   <div></div> <footer id="test2"></footer>  Text mid <div id="last"></div></article>';
         var result = {
@@ -284,7 +284,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse nested text nodes', () => {
+      test('Parse nested text nodes', () => {
         var str = '<div>content1 <div>nested</div> content2</div>';
         var result = {
           tagName: 'div',
@@ -310,7 +310,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse nested span text nodes', () => {
+      test('Parse nested span text nodes', () => {
         var str = '<div>content1 <div><span>nested</span></div> content2</div>';
         var result = {
           tagName: 'div',
@@ -340,20 +340,20 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse multiple nodes', () => {
+      test('Parse multiple nodes', () => {
         var str = '<div></div><div></div>';
         var result = [{ tagName: 'div' }, { tagName: 'div' }];
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Remove script tags', () => {
+      test('Remove script tags', () => {
         var str =
           '<div><script>var test;</script></div><div></div><script>var test2;</script>';
         var result = [{ tagName: 'div' }, { tagName: 'div' }];
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Isolate styles', () => {
+      test('Isolate styles', () => {
         var str =
           '<div><style>.a{color: red}</style></div><div></div><style>.b{color: blue}</style>';
         var resHtml = [{ tagName: 'div' }, { tagName: 'div' }];
@@ -372,7 +372,7 @@ module.exports = {
         expect(res.css).toEqual(resCss);
       });
 
-      it('Respect multiple font-faces contained in styles in html', () => {
+      test('Respect multiple font-faces contained in styles in html', () => {
         const str = `
           <style>
           @font-face {
@@ -416,7 +416,7 @@ module.exports = {
         expect(res.css).toEqual(expected);
       });
 
-      it('Parse nested div with text and spaces', () => {
+      test('Parse nested div with text and spaces', () => {
         var str = '<div> <p>TestText</p> </div>';
         var result = {
           tagName: 'div',
@@ -442,7 +442,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse node with model attributes to fetch', () => {
+      test('Parse node with model attributes to fetch', () => {
         var str =
           '<div id="test1" data-test="test-value" data-gjs-draggable=".myselector" data-gjs-stuff="test">test2 </div>';
         var result = {
@@ -459,7 +459,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse model attributes with true and false', () => {
+      test('Parse model attributes with true and false', () => {
         var str =
           '<div id="test1" data-test="test-value" data-gjs-draggable="true" data-gjs-stuff="false">test2 </div>';
         var result = {
@@ -476,7 +476,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse attributes with object inside', () => {
+      test('Parse attributes with object inside', () => {
         var str = `<div data-gjs-test='{ "prop1": "value1", "prop2": 10, "prop3": true}'>test2 </div>`;
         var result = {
           tagName: 'div',
@@ -492,7 +492,7 @@ module.exports = {
         expect(obj.parse(str).html).toEqual(result);
       });
 
-      it('Parse attributes with arrays inside', () => {
+      test('Parse attributes with arrays inside', () => {
         var str = `<div data-gjs-test='["value1", "value2"]'>test2 </div>`;
         var result = {
           tagName: 'div',

test/specs/plugin_manager/index.js

@@ -16,20 +16,20 @@ describe('PluginManager', () => {
       obj = null;
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(obj).toExist();
     });
 
-    it('No plugins inside', () => {
+    test('No plugins inside', () => {
       expect(obj.getAll()).toEqual({});
     });
 
-    it('Add new plugin', () => {
+    test('Add new plugin', () => {
       obj.add('test', testPlugin);
       expect(obj.get('test')).toExist();
     });
 
-    it('Added plugin is working', () => {
+    test('Added plugin is working', () => {
       obj.add('test', testPlugin);
       var plugin = obj.get('test');
       plugin('tval');

test/specs/selector_manager/e2e/ClassManager.js

@@ -29,7 +29,7 @@ module.exports = {
           this.$fixture   = $('<div id="SelectorManager-fixture"></div>');
         });
 */
-      beforeEach(function() {
+      beforeEach(() => {
         document.body.innerHTML =
           '<div id="fixtures"><div id="SelectorManager-fixture"></div></div>';
         fixtures = document.body.firstChild;
@@ -44,12 +44,12 @@ module.exports = {
       });
 
       describe('Interaction with Components', () => {
-        beforeEach(function() {
+        beforeEach(() => {
           components = gjs.getComponents();
           tagEl = instClassTagViewer(gjs, fixtures);
         });
 
-        it('Assign correctly new class to component', function() {
+        test('Assign correctly new class to component', () => {
           var model = components.add({});
           expect(model.get('classes').length).toEqual(0);
           gjs.select(model);
@@ -63,7 +63,7 @@ module.exports = {
           ).toEqual('test');
         });
 
-        it('Classes from components are correctly imported inside main container', function() {
+        test('Classes from components are correctly imported inside main container', () => {
           var model = components.add([
             { classes: ['test11', 'test12', 'test13'] },
             { classes: ['test11', 'test22', 'test22'] }
@@ -71,7 +71,7 @@ module.exports = {
           expect(gjs.editor.get('SelectorManager').getAll().length).toEqual(4);
         });
 
-        it('Class imported into component is the same model from main container', function() {
+        test('Class imported into component is the same model from main container', () => {
           var model = components.add({ classes: ['test1'] });
           var clModel = model.get('classes').at(0);
           var clModel2 = gjs.editor
@@ -81,7 +81,7 @@ module.exports = {
           expect(clModel).toEqual(clModel2);
         });
 
-        it('Can assign only one time the same class on selected component and the class viewer', function() {
+        test('Can assign only one time the same class on selected component and the class viewer', () => {
           var model = components.add({});
           gjs.editor.set('selectedComponent', model);
           tagEl.addNewTag('test');
@@ -97,7 +97,7 @@ module.exports = {
           expect(tagEl.collection.at(0).get('name')).toEqual('test');
         });
 
-        it('Removing from container removes also from selected component', function() {
+        test('Removing from container removes also from selected component', () => {
           var model = components.add({});
           gjs.editor.set('selectedComponent', model);
           tagEl.addNewTag('test');
@@ -108,7 +108,7 @@ module.exports = {
           expect(model.get('classes').length).toEqual(0);
         });
 
-        it('Trigger correctly event on target with new class add', function() {
+        test('Trigger correctly event on target with new class add', () => {
           var spy = sinon.spy();
           var model = components.add({});
           gjs.editor.set('selectedComponent', model);

test/specs/selector_manager/index.js

@@ -20,32 +20,32 @@ describe('SelectorManager', () => {
       obj = null;
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(obj).toExist();
     });
 
-    it('No selectors inside', () => {
+    test('No selectors inside', () => {
       expect(obj.getAll().length).toEqual(0);
     });
 
-    it('Able to add default selectors', () => {
+    test('Able to add default selectors', () => {
       var cm = new SelectorManager().init({
         selectors: ['test1', 'test2', 'test3']
       });
       expect(cm.getAll().length).toEqual(3);
     });
 
-    it('Add new selector', () => {
+    test('Add new selector', () => {
       obj.add('test');
       expect(obj.getAll().length).toEqual(1);
     });
 
-    it('Default new selector is a class type', () => {
+    test('Default new selector is a class type', () => {
       obj.add('test');
       expect(obj.get('test').get('type')).toEqual(obj.Selector.TYPE_CLASS);
     });
 
-    it('Add a selector as an id', () => {
+    test('Add a selector as an id', () => {
       const name = 'test';
       var sel = obj.add(`#${name}`);
       expect(sel.get('name')).toEqual(name);
@@ -53,59 +53,59 @@ describe('SelectorManager', () => {
       expect(obj.get(`#${name}`).get('type')).toEqual(obj.Selector.TYPE_ID);
     });
 
-    it('Check name property', () => {
+    test('Check name property', () => {
       var name = 'test';
       var sel = obj.add(name);
       expect(sel.get('name')).toEqual(name);
       expect(sel.get('label')).toEqual(name);
     });
 
-    it('Add 2 selectors', () => {
+    test('Add 2 selectors', () => {
       obj.add('test');
       obj.add('test2');
       expect(obj.getAll().length).toEqual(2);
     });
 
-    it('Adding 2 selectors with the same name is not possible', () => {
+    test('Adding 2 selectors with the same name is not possible', () => {
       obj.add('test');
       obj.add('test');
       expect(obj.getAll().length).toEqual(1);
     });
 
-    it('Get selector', () => {
+    test('Get selector', () => {
       var name = 'test';
       var sel = obj.add(name);
       expect(obj.get(name)).toEqual(sel);
     });
 
-    it('Get empty class', () => {
+    test('Get empty class', () => {
       expect(obj.get('test')).toEqual(undefined);
     });
 
-    it('addClass single class string', () => {
+    test('addClass single class string', () => {
       const result = obj.addClass('class1');
       expect(result.length).toEqual(1);
       expect(result[0] instanceof Selector).toEqual(true);
       expect(result[0].get('name')).toEqual('class1');
     });
 
-    it('addClass multiple class string', () => {
+    test('addClass multiple class string', () => {
       const result = obj.addClass('class1 class2');
       expect(result.length).toEqual(2);
       expect(obj.getAll().length).toEqual(2);
     });
 
-    it('addClass single class array', () => {
+    test('addClass single class array', () => {
       const result = obj.addClass(['class1']);
       expect(result.length).toEqual(1);
     });
 
-    it('addClass multiple class array', () => {
+    test('addClass multiple class array', () => {
       const result = obj.addClass(['class1', 'class2']);
       expect(result.length).toEqual(2);
     });
 
-    it('addClass Avoid same name classes', () => {
+    test('addClass Avoid same name classes', () => {
       obj.addClass('class1');
       const result = obj.addClass('class1');
       expect(obj.getAll().length).toEqual(1);

test/specs/selector_manager/model/SelectorModels.js

@@ -14,23 +14,23 @@ module.exports = {
         obj = null;
       });
 
-      it('Has name property', () => {
+      test('Has name property', () => {
         expect(obj.has('name')).toEqual(true);
       });
 
-      it('Has label property', () => {
+      test('Has label property', () => {
         expect(obj.has('label')).toEqual(true);
       });
 
-      it('Has active property', () => {
+      test('Has active property', () => {
         expect(obj.has('active')).toEqual(true);
       });
 
-      it('escapeName test', () => {
+      test('escapeName test', () => {
         expect(Selector.escapeName('@Te sT*')).toEqual('-Te-sT-');
       });
 
-      it('Name is corrected at instantiation', () => {
+      test('Name is corrected at instantiation', () => {
         obj = new Selector({ name: '@Te sT*' });
         expect(obj.get('name')).toEqual('-Te-sT-');
       });
@@ -43,23 +43,23 @@ module.exports = {
         obj = new Selectors();
       });
 
-      it('Creates collection item correctly', () => {
+      test('Creates collection item correctly', () => {
         var c = new Selectors();
         var m = c.add({});
         expect(m instanceof Selector).toEqual(true);
       });
 
-      it('getFullString with single class', () => {
+      test('getFullString with single class', () => {
         obj.add({ name: 'test' });
         expect(obj.getFullString()).toEqual('.test');
       });
 
-      it('getFullString with multiple classes', () => {
+      test('getFullString with multiple classes', () => {
         obj.add([{ name: 'test' }, { name: 'test2' }]);
         expect(obj.getFullString()).toEqual('.test.test2');
       });
 
-      it('getFullString with mixed selectors', () => {
+      test('getFullString with mixed selectors', () => {
         obj.add([{ name: 'test' }, { name: 'test2', type: Selector.TYPE_ID }]);
         expect(obj.getFullString()).toEqual('.test#test2');
       });

test/specs/selector_manager/view/ClassTagView.js

@@ -32,41 +32,41 @@ module.exports = {
         obj.model = null;
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(ClassTagView).toExist();
       });
 
-      it('Not empty', () => {
+      test('Not empty', () => {
         var $el = obj.$el;
         expect($el.html()).toExist();
       });
 
-      it('Not empty', () => {
+      test('Not empty', () => {
         var $el = obj.$el;
         expect($el.html()).toContain(testLabel);
       });
 
       describe('Should be rendered correctly', () => {
-        it('Has close button', () => {
+        test('Has close button', () => {
           var $el = obj.$el;
           expect($el.find('#close')[0]).toExist();
         });
-        it('Has checkbox', () => {
+        test('Has checkbox', () => {
           var $el = obj.$el;
           expect($el.find('#checkbox')[0]).toExist();
         });
-        it('Has label', () => {
+        test('Has label', () => {
           var $el = obj.$el;
           expect($el.find('#tag-label')[0]).toExist();
         });
       });
 
-      it('Could be removed', () => {
+      test('Could be removed', () => {
         obj.$el.find('#close').trigger('click');
         setTimeout(() => expect(fixtures.innerHTML).toNotExist(), 0);
       });
 
-      it('Checkbox toggles status', () => {
+      test('Checkbox toggles status', () => {
         var spy = sinon.spy();
         obj.model.on('change:active', spy);
         obj.model.set('active', true);
@@ -75,16 +75,16 @@ module.exports = {
         expect(spy.called).toEqual(true);
       });
 
-      it('Label input is disabled', () => {
+      test('Label input is disabled', () => {
         expect(obj.getInputEl().contentEditable).toNotEqual(true);
       });
 
-      it('On double click label input is enable', () => {
+      test('On double click label input is enable', () => {
         obj.$el.find('#tag-label').trigger('dblclick');
         expect(obj.getInputEl().contentEditable).toEqual(true);
       });
 
-      it('On blur label input turns back disabled', () => {
+      test('On blur label input turns back disabled', () => {
         obj.$el.find('#tag-label').trigger('dblclick');
         obj.endEditTag();
         expect(obj.getInputEl().contentEditable).toEqual(false);

test/specs/selector_manager/view/ClassTagsView.js

@@ -5,6 +5,12 @@ const Editor = require('editor/model/Editor');
 module.exports = {
   run() {
     describe('ClassTagsView', () => {
+      let testContext;
+
+      beforeEach(() => {
+        testContext = {};
+      });
+
       var view;
       var fixture;
       var fixtures;
@@ -13,17 +19,17 @@ module.exports = {
       var target;
       var em;
 
-      before(() => {
+      beforeAll(() => {
         document.body.innerHTML = '<div id="fixtures"></div>';
         fixtures = document.body.querySelector('#fixtures');
         fixture = $('<div class="classtag-fixture"></div>');
       });
 
-      after(() => {
+      afterAll(() => {
         fixture.remove();
       });
 
-      beforeEach(function() {
+      beforeEach(() => {
         target = new Editor();
         coll = new Selectors();
         view = new ClassTagsView({
@@ -31,13 +37,13 @@ module.exports = {
           collection: coll
         });
 
-        this.targetStub = {
+        testContext.targetStub = {
           add(v) {
             return { name: v };
           }
         };
 
-        this.compTargetStub = {
+        testContext.compTargetStub = {
           get() {
             return { add() {} };
           }
@@ -46,47 +52,47 @@ module.exports = {
         fixtures.innerHTML = '';
         fixture.empty().appendTo(fixtures);
         fixture.append(view.render().el);
-        this.btnAdd = view.$addBtn;
-        this.input = view.$el.find('input#' + view.newInputId);
-        this.$tags = fixture.find('#tags-c');
-        this.$states = fixture.find('#states');
-        this.$statesC = fixture.find('#input-c');
+        testContext.btnAdd = view.$addBtn;
+        testContext.input = view.$el.find('input#' + view.newInputId);
+        testContext.$tags = fixture.find('#tags-c');
+        testContext.$states = fixture.find('#states');
+        testContext.$statesC = fixture.find('#input-c');
       });
 
       afterEach(() => {
         delete view.collection;
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(ClassTagsView).toExist();
       });
 
-      it('Not tags inside', function() {
-        expect(this.$tags.html()).toEqual('');
+      test('Not tags inside', () => {
+        expect(testContext.$tags.html()).toEqual('');
       });
 
-      it('Add new tag triggers correct method', () => {
+      test('Add new tag triggers correct method', () => {
         sinon.stub(view, 'addToClasses');
         coll.add({ name: 'test' });
         expect(view.addToClasses.calledOnce).toEqual(true);
       });
 
-      it('Start new tag creation', function() {
-        this.btnAdd.trigger('click');
-        expect(this.btnAdd.css('display')).toEqual('none');
-        expect(this.input.css('display')).toNotEqual('none');
+      test('Start new tag creation', () => {
+        testContext.btnAdd.trigger('click');
+        expect(testContext.btnAdd.css('display')).toEqual('none');
+        expect(testContext.input.css('display')).toNotEqual('none');
       });
 
-      it('Stop tag creation', function() {
-        this.btnAdd.trigger('click');
-        this.input.val('test');
-        this.input.trigger('blur');
-        expect(this.btnAdd.css('display')).toNotEqual('none');
-        expect(this.input.css('display')).toEqual('none');
-        expect(this.input.val()).toEqual(null);
+      test('Stop tag creation', () => {
+        testContext.btnAdd.trigger('click');
+        testContext.input.val('test');
+        testContext.input.trigger('blur');
+        expect(testContext.btnAdd.css('display')).toNotEqual('none');
+        expect(testContext.input.css('display')).toEqual('none');
+        expect(testContext.input.val()).toEqual(null);
       });
 
-      it.skip('Check keyup of ESC on input', function() {
+      test.skip('Check keyup of ESC on input', function() {
         this.btnAdd.click();
         sinon.stub(view, 'addNewTag');
         this.input.trigger({
@@ -96,7 +102,7 @@ module.exports = {
         expect(view.addNewTag.calledOnce).toEqual(true);
       });
 
-      it.skip('Check keyup on ENTER on input', function() {
+      test.skip('Check keyup on ENTER on input', function() {
         this.btnAdd.click();
         sinon.stub(view, 'endNewTag');
         this.input.trigger({
@@ -106,37 +112,37 @@ module.exports = {
         expect(view.endNewTag.calledOnce).toEqual(true);
       });
 
-      it('Collection changes on update of target', () => {
+      test('Collection changes on update of target', () => {
         coll.add({ name: 'test' });
         target.trigger('change:selectedComponent');
         expect(coll.length).toEqual(0);
       });
 
-      it('Collection reacts on reset', () => {
+      test('Collection reacts on reset', () => {
         coll.add([{ name: 'test1' }, { name: 'test2' }]);
         sinon.stub(view, 'addToClasses');
         coll.trigger('reset');
         expect(view.addToClasses.calledTwice).toEqual(true);
       });
 
-      it("Don't accept empty tags", function() {
+      test("Don't accept empty tags", () => {
         view.addNewTag('');
-        expect(this.$tags.html()).toEqual('');
+        expect(testContext.$tags.html()).toEqual('');
       });
 
-      it('Accept new tags', function() {
-        sinon.stub(target, 'get').returns(this.targetStub);
-        view.compTarget = this.compTargetStub;
+      test('Accept new tags', () => {
+        sinon.stub(target, 'get').returns(testContext.targetStub);
+        view.compTarget = testContext.compTargetStub;
         view.addNewTag('test');
-        view.compTarget = this.compTargetStub;
+        view.compTarget = testContext.compTargetStub;
         view.addNewTag('test2');
-        expect(this.$tags.children().length).toEqual(2);
+        expect(testContext.$tags.children().length).toEqual(2);
       });
 
-      it('New tag correctly added', function() {
+      test('New tag correctly added', () => {
         coll.add({ label: 'test' });
         expect(
-          this.$tags
+          testContext.$tags
             .children()
             .first()
             .find('[data-tag-name]')
@@ -144,35 +150,35 @@ module.exports = {
         ).toEqual('test');
       });
 
-      it('States are hidden in case no tags', function() {
+      test('States are hidden in case no tags', () => {
         view.updateStateVis();
-        expect(this.$statesC.css('display')).toEqual('none');
+        expect(testContext.$statesC.css('display')).toEqual('none');
       });
 
-      it('States are visible in case of more tags inside', function() {
+      test('States are visible in case of more tags inside', () => {
         coll.add({ label: 'test' });
         view.updateStateVis();
-        expect(this.$statesC.css('display')).toEqual('block');
+        expect(testContext.$statesC.css('display')).toEqual('block');
       });
 
-      it('Update state visibility on new tag', function() {
+      test('Update state visibility on new tag', () => {
         sinon.stub(view, 'updateStateVis');
-        sinon.stub(target, 'get').returns(this.targetStub);
-        view.compTarget = this.compTargetStub;
+        sinon.stub(target, 'get').returns(testContext.targetStub);
+        view.compTarget = testContext.compTargetStub;
         view.addNewTag('test');
         expect(view.updateStateVis.called).toEqual(true);
       });
 
-      it('Update state visibility on removing of the tag', function() {
-        sinon.stub(target, 'get').returns(this.targetStub);
-        view.compTarget = this.compTargetStub;
+      test('Update state visibility on removing of the tag', () => {
+        sinon.stub(target, 'get').returns(testContext.targetStub);
+        view.compTarget = testContext.compTargetStub;
         view.addNewTag('test');
         sinon.stub(view, 'updateStateVis');
         coll.remove(coll.at(0));
         expect(view.updateStateVis.calledOnce).toEqual(true);
       });
 
-      it('Output correctly state options', () => {
+      test('Output correctly state options', () => {
         var view = new ClassTagsView({
           config: {
             em: target,
@@ -186,16 +192,16 @@ module.exports = {
       });
 
       describe('Should be rendered correctly', () => {
-        it('Has label', () => {
+        test('Has label', () => {
           expect(view.$el.find('#label')[0]).toExist();
         });
-        it('Has tags container', () => {
+        test('Has tags container', () => {
           expect(view.$el.find('#tags-c')[0]).toExist();
         });
-        it('Has add button', () => {
+        test('Has add button', () => {
           expect(view.$el.find('#add-tag')[0]).toExist();
         });
-        it('Has states input', () => {
+        test('Has states input', () => {
           expect(view.$el.find('#states')[0]).toExist();
         });
       });

test/specs/storage_manager/index.js

@@ -13,47 +13,47 @@ describe('Storage Manager', () => {
       obj = null;
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(StorageManager).toExist();
     });
 
-    it('Autosave is active by default', () => {
+    test('Autosave is active by default', () => {
       expect(obj.isAutosave()).toEqual(true);
     });
 
-    it('Change autosave', () => {
+    test('Change autosave', () => {
       obj.setAutosave(0);
       expect(obj.isAutosave()).toEqual(false);
     });
 
-    it('Steps before save are set as default', () => {
+    test('Steps before save are set as default', () => {
       expect(obj.getStepsBeforeSave()).toEqual(1);
     });
 
-    it('Change steps before save', () => {
+    test('Change steps before save', () => {
       obj.setStepsBeforeSave(5);
       expect(obj.getStepsBeforeSave()).toEqual(5);
     });
 
-    it('Add and get new storage', () => {
+    test('Add and get new storage', () => {
       obj.add('test', 'gen');
       expect(obj.get('test')).toEqual('gen');
     });
 
-    it('LocalStorage is set as default', () => {
+    test('LocalStorage is set as default', () => {
       expect(obj.getCurrent()).toEqual('local');
     });
 
-    it('Change storage type', () => {
+    test('Change storage type', () => {
       obj.setCurrent('remote');
       expect(obj.getCurrent()).toEqual('remote');
     });
 
-    it('Store do not execute if empty', () => {
+    test('Store do not execute if empty', () => {
       expect(obj.store({ item: 'test' })).toEqual(null);
     });
 
-    it('Load default storages ', () => {
+    test('Load default storages ', () => {
       obj.loadDefaultProviders();
       expect(obj.get('local')).toExist();
       expect(obj.get('remote')).toExist();
@@ -84,7 +84,7 @@ describe('Storage Manager', () => {
         obj = null;
       });
 
-      it('Store and load data', () => {
+      test('Store and load data', () => {
         var data = {
           item: 'testData',
           item2: 'testData2'

test/specs/storage_manager/model/Models.js

@@ -21,13 +21,13 @@ module.exports = {
         obj = null;
       });
 
-      it('Store and load items', () => {
+      test('Store and load items', () => {
         obj.store(data);
         var result = obj.load(['item1', 'item2']);
         expect(result).toEqual(data);
       });
 
-      it('Store, update and load items', () => {
+      test('Store, update and load items', () => {
         obj.store(data);
         obj.store({ item3: 'value3' });
         obj.store({ item2: 'value22' });
@@ -39,7 +39,7 @@ module.exports = {
         });
       });
 
-      it('Remove items', () => {
+      test('Remove items', () => {
         var items = ['item1', 'item2', 'item3'];
         obj.store(data);
         obj.remove(items);
@@ -83,14 +83,14 @@ module.exports = {
         obj = null;
       });
 
-      it('Store data', () => {
+      test('Store data', () => {
         obj.store(data);
         const callResult = obj.fetch;
         expect(callResult.called).toEqual(true);
         expect(callResult.firstCall.args[0]).toEqual(endpointStore);
       });
 
-      it('Load data', () => {
+      test('Load data', () => {
         obj.load(['item1', 'item2']);
         const callResult = obj.fetch;
         expect(callResult.called).toEqual(true);

test/specs/style_manager/index.js

@@ -25,15 +25,15 @@ describe('StyleManager', () => {
       obj = null;
     });
 
-    it('Object exists', () => {
+    test('Object exists', () => {
       expect(obj).toExist();
     });
 
-    it('No sectors', () => {
+    test('No sectors', () => {
       expect(obj.getSectors().length).toEqual(0);
     });
 
-    it('Add sector', () => {
+    test('Add sector', () => {
       obj.addSector('test', {
         name: 'Test name'
       });
@@ -43,40 +43,40 @@ describe('StyleManager', () => {
       expect(sector.get('name')).toEqual('Test name');
     });
 
-    it('Add sectors', () => {
+    test('Add sectors', () => {
       obj.addSector('test', {});
       obj.addSector('test2', {});
       expect(obj.getSectors().length).toEqual(2);
     });
 
-    it("Can't create more than one sector with the same id", () => {
+    test("Can't create more than one sector with the same id", () => {
       var sect1 = obj.addSector('test', {});
       var sect2 = obj.addSector('test', {});
       expect(obj.getSectors().length).toEqual(1);
       expect(sect1).toEqual(sect2);
     });
 
-    it('Get inexistent sector', () => {
+    test('Get inexistent sector', () => {
       expect(obj.getSector('test')).toEqual(null);
     });
 
-    it('Get sector', () => {
+    test('Get sector', () => {
       var sect1 = obj.addSector('test', { name: 'Test' });
       var sect2 = obj.getSector('test');
       expect(sect1).toEqual(sect2);
     });
 
-    it('Add property to inexistent sector', () => {
+    test('Add property to inexistent sector', () => {
       expect(obj.addProperty('test', {})).toEqual(null);
     });
 
-    it('Add property', () => {
+    test('Add property', () => {
       obj.addSector('test', {});
       expect(obj.addProperty('test', {})).toExist();
       expect(obj.getProperties('test').length).toEqual(1);
     });
 
-    it('Check added property', () => {
+    test('Check added property', () => {
       obj.addSector('test', {});
       var prop = obj.addProperty('test', {
         name: 'test'
@@ -84,30 +84,30 @@ describe('StyleManager', () => {
       expect(prop.get('name')).toEqual('test');
     });
 
-    it('Add properties', () => {
+    test('Add properties', () => {
       obj.addSector('test', {});
       obj.addProperty('test', [{}, {}]);
       expect(obj.getProperties('test').length).toEqual(2);
     });
 
-    it('Get property from inexistent sector', () => {
+    test('Get property from inexistent sector', () => {
       expect(obj.getProperty('test', 'test-prop')).toEqual(null);
     });
 
-    it("Can't get properties without proper name", () => {
+    test("Can't get properties without proper name", () => {
       obj.addSector('test', {});
       obj.addProperty('test', [{}, {}]);
       expect(obj.getProperty('test', 'test-prop')).toEqual([]);
     });
 
-    it('Get property with proper name', () => {
+    test('Get property with proper name', () => {
       obj.addSector('test', {});
       var prop1 = obj.addProperty('test', { property: 'test-prop' });
       var prop2 = obj.getProperty('test', 'test-prop');
       expect(prop1).toEqual(prop2);
     });
 
-    it('Get properties with proper name', () => {
+    test('Get properties with proper name', () => {
       obj.addSector('test', {});
       var prop1 = obj.addProperty('test', [
         { property: 'test-prop' },
@@ -116,12 +116,12 @@ describe('StyleManager', () => {
       expect(obj.getProperty('test', 'test-prop').length).toEqual(2);
     });
 
-    it('Get inexistent properties', () => {
+    test('Get inexistent properties', () => {
       expect(obj.getProperties('test')).toEqual(null);
       expect(obj.getProperties()).toEqual(null);
     });
 
-    it('Renders correctly', () => {
+    test('Renders correctly', () => {
       expect(obj.render()).toExist();
     });
 
@@ -161,20 +161,20 @@ describe('StyleManager', () => {
         obj = null;
       });
 
-      it('Sectors added', () => {
+      test('Sectors added', () => {
         expect(obj.getSectors().length).toEqual(2);
         var sect1 = obj.getSector('dim');
         expect(sect1.get('name')).toEqual('Dimension');
       });
 
-      it('Properties added', () => {
+      test('Properties added', () => {
         var sect1 = obj.getSector('dim');
         var sect2 = obj.getSector('pos');
         expect(sect1.get('properties').length).toEqual(2);
         expect(sect2.get('properties').length).toEqual(1);
       });
 
-      it('Property is correct', () => {
+      test('Property is correct', () => {
         var prop1 = obj.getProperty('dim', 'width');
         expect(prop1.get('name')).toEqual('Width');
       });

test/specs/style_manager/model/Models.js

@@ -34,22 +34,22 @@ module.exports = {
         obj = null;
       });
 
-      it('Has id property', () => {
+      test('Has id property', () => {
         expect(obj.has('id')).toEqual(true);
       });
 
-      it('Has no properties', () => {
+      test('Has no properties', () => {
         expect(obj.get('properties').length).toEqual(0);
       });
 
-      it('Init with properties', () => {
+      test('Init with properties', () => {
         obj = new Sector({
           properties: [{}, {}]
         });
         expect(obj.get('properties').length).toEqual(2);
       });
 
-      it('Build properties', () => {
+      test('Build properties', () => {
         var res = obj.buildProperties(['display', 'float']);
         expect(res.length).toEqual(2);
         expect(res[0]).toEqual({
@@ -65,7 +65,7 @@ module.exports = {
         });
       });
 
-      it('Extend properties', () => {
+      test('Extend properties', () => {
         obj = new Sector(confToExt);
         expect(obj.get('properties').length).toEqual(3);
         var prop0 = obj.get('properties').at(0);
@@ -73,7 +73,7 @@ module.exports = {
         expect(prop0.get('defaults')).toEqual('block');
       });
 
-      it('Do not extend properties', () => {
+      test('Do not extend properties', () => {
         confToExt.extendBuilded = 0;
         obj = new Sector(confToExt);
         expect(obj.get('properties').length).toEqual(3);
@@ -82,7 +82,7 @@ module.exports = {
         expect(prop0.get('defaults')).toEqual('');
       });
 
-      it('Extend composed properties', () => {
+      test('Extend composed properties', () => {
         obj = new Sector({
           buildProps: ['margin', 'float'],
           properties: [
@@ -123,7 +123,7 @@ module.exports = {
         obj = null;
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(obj).toExist();
       });
     });
@@ -139,21 +139,21 @@ module.exports = {
         obj = null;
       });
 
-      it('Has property field', () => {
+      test('Has property field', () => {
         expect(obj.has('property')).toEqual(true);
       });
 
-      it('parseValue', () => {
+      test('parseValue', () => {
         const result = { value: 'testValue' };
         expect(obj.parseValue('testValue')).toEqual(result);
       });
 
-      it('parseValue with function but without functionName', () => {
+      test('parseValue with function but without functionName', () => {
         const result = { value: 'fn(testValue)' };
         expect(obj.parseValue('fn(testValue)')).toEqual(result);
       });
 
-      it('parseValue with function and functionName', () => {
+      test('parseValue with function and functionName', () => {
         obj = new Property({ functionName: 'fn' });
         const result = { value: 'testValue' };
         expect(obj.parseValue('fn(testValue)')).toEqual(result);
@@ -172,12 +172,12 @@ module.exports = {
         obj = null;
       });
 
-      it('parseValue with units', () => {
+      test('parseValue with units', () => {
         const result = { value: 20, unit: 'px' };
         expect(obj.parseValue('20px')).toEqual(result);
       });
 
-      it('parse input value with function', () => {
+      test('parse input value with function', () => {
         obj = new PropertyInteger({
           units: ['px', 'deg'],
           functionName: 'test'
@@ -186,14 +186,14 @@ module.exports = {
         expect(obj.parseValue('test(55deg)')).toEqual(result);
       });
 
-      it('parse input value with min', () => {
+      test('parse input value with min', () => {
         obj = new PropertyInteger({ units: ['px'], min: 10 });
         const result = { value: 10, unit: 'px' };
         expect(obj.parseValue('1px')).toEqual(result);
         expect(obj.parseValue('15px')).toEqual({ value: 15, unit: 'px' });
       });
 
-      it('parse input value with max', () => {
+      test('parse input value with max', () => {
         obj = new PropertyInteger({ units: ['px'], max: 100 });
         const result = { value: 100, unit: 'px' };
         expect(obj.parseValue('200px')).toEqual(result);
@@ -212,7 +212,7 @@ module.exports = {
         obj = null;
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(obj).toExist();
       });
     });
@@ -233,26 +233,26 @@ module.exports = {
         obj = null;
       });
 
-      it('Has index property', () => {
+      test('Has index property', () => {
         expect(obj.has('index')).toEqual(true);
       });
 
-      it('Is not active', () => {
+      test('Is not active', () => {
         expect(obj.get('active')).toEqual(false);
       });
 
-      it('Has no properties', () => {
+      test('Has no properties', () => {
         expect(obj.get('properties').length).toEqual(0);
       });
 
-      it('Get correct values from properties', () => {
+      test('Get correct values from properties', () => {
         obj = new Layer({
           properties
         });
         expect(obj.getFullValue()).toEqual('val1 val2 test(val3)');
       });
 
-      it('Get correct value from properties', () => {
+      test('Get correct value from properties', () => {
         obj = new Layer({ properties });
         expect(obj.getPropertyValue()).toEqual('');
         expect(obj.getPropertyValue('no-prop')).toEqual('');
@@ -276,22 +276,22 @@ module.exports = {
         obj = null;
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(obj).toExist();
       });
 
-      it('Init index on add', () => {
+      test('Init index on add', () => {
         var model = obj.add({});
         expect(model.get('index')).toEqual(1);
       });
 
-      it('Increment index', () => {
+      test('Increment index', () => {
         var model = obj.add({});
         var model2 = obj.add({});
         expect(model2.get('index')).toEqual(2);
       });
 
-      it('Cache index', () => {
+      test('Cache index', () => {
         var model = obj.add({});
         var model2 = obj.add({});
         obj.remove(model2);
@@ -299,21 +299,21 @@ module.exports = {
         expect(model3.get('index')).toEqual(3);
       });
 
-      it('Reset index on reset', () => {
+      test('Reset index on reset', () => {
         var model = obj.add({});
         var model2 = obj.add({});
         obj.reset();
         expect(obj.idx).toEqual(1);
       });
 
-      it('getFullValue from layers', () => {
+      test('getFullValue from layers', () => {
         obj = new Layers([{ properties }, { properties }, { properties }]);
         expect(obj.getFullValue()).toEqual(
           'val1 val2 test(val3), val1 val2 test(val3), val1 val2 test(val3)'
         );
       });
 
-      it('getPropertyValues from layers', () => {
+      test('getPropertyValues from layers', () => {
         obj = new Layers([{ properties }, { properties }, { properties }]);
         expect(obj.getPropertyValues('prop3')).toEqual(
           'test(val3), test(val3), test(val3)'
@@ -332,11 +332,11 @@ module.exports = {
         obj = null;
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(obj).toExist();
       });
 
-      it('Build single prop', () => {
+      test('Build single prop', () => {
         expect(obj.build('float')).toEqual([
           {
             property: 'float',
@@ -347,7 +347,7 @@ module.exports = {
         ]);
       });
 
-      it('Build display', () => {
+      test('Build display', () => {
         expect(obj.build('display')).toEqual([
           {
             property: 'display',
@@ -363,7 +363,7 @@ module.exports = {
         ]);
       });
 
-      it('Build position', () => {
+      test('Build position', () => {
         expect(obj.build('position')).toEqual([
           {
             property: 'position',
@@ -379,7 +379,7 @@ module.exports = {
         ]);
       });
 
-      it('Build top, left, right, bottom', () => {
+      test('Build top, left, right, bottom', () => {
         var res = {
           type: 'integer',
           units: ['px', '%'],
@@ -395,7 +395,7 @@ module.exports = {
         expect(obj.build('left')).toEqual([res]);
       });
 
-      it('Build width and height family', () => {
+      test('Build width and height family', () => {
         var res = {
           type: 'integer',
           units: ['px', '%'],
@@ -417,7 +417,7 @@ module.exports = {
         expect(obj.build('max-width')).toEqual([res]);
       });
 
-      it('Build margin', () => {
+      test('Build margin', () => {
         var res = {
           property: 'margin',
           type: 'composite',
@@ -455,7 +455,7 @@ module.exports = {
         expect(obj.build('margin')).toEqual([res]);
       });
 
-      it('Build padding', () => {
+      test('Build padding', () => {
         var res = {
           property: 'padding',
           type: 'composite',
@@ -497,7 +497,7 @@ module.exports = {
         expect(obj.build('padding')).toEqual([res]);
       });
 
-      it('Build font-family', () => {
+      test('Build font-family', () => {
         var ss = ', sans-serif';
         var ms = ', monospace';
         var res = {
@@ -526,7 +526,7 @@ module.exports = {
         expect(obj.build('font-family')).toEqual([res]);
       });
 
-      it('Build font-size', () => {
+      test('Build font-size', () => {
         var res = {
           type: 'integer',
           units: ['px', 'em', 'rem', '%'],
@@ -551,7 +551,7 @@ module.exports = {
         expect(obj.build('font-size')).toEqual([res]);
       });
 
-      it('Build letter-spacing', () => {
+      test('Build letter-spacing', () => {
         var res = {
           type: 'integer',
           units: ['px', 'em', 'rem', '%'],
@@ -562,7 +562,7 @@ module.exports = {
         expect(obj.build('letter-spacing')).toEqual([res]);
       });
 
-      it('Build font-weight', () => {
+      test('Build font-weight', () => {
         var res = {
           type: 'select',
           defaults: '400',
@@ -582,7 +582,7 @@ module.exports = {
         expect(obj.build('font-weight')).toEqual([res]);
       });
 
-      it('Build color', () => {
+      test('Build color', () => {
         var res = {
           property: 'color',
           type: 'color',
@@ -591,7 +591,7 @@ module.exports = {
         expect(obj.build('color')).toEqual([res]);
       });
 
-      it('Build line-height', () => {
+      test('Build line-height', () => {
         var res = {
           type: 'integer',
           units: ['px', 'em', 'rem', '%'],
@@ -602,7 +602,7 @@ module.exports = {
         expect(obj.build('line-height')).toEqual([res]);
       });
 
-      it('Build text-align', () => {
+      test('Build text-align', () => {
         var res = {
           type: 'radio',
           defaults: 'left',
@@ -617,7 +617,7 @@ module.exports = {
         expect(obj.build('text-align')).toEqual([res]);
       });
 
-      it('Build text-shadow', () => {
+      test('Build text-shadow', () => {
         var res = {
           type: 'stack',
           preview: true,
@@ -653,7 +653,7 @@ module.exports = {
         expect(obj.build('text-shadow')).toEqual([res]);
       });
 
-      it('Build border-radius-c', () => {
+      test('Build border-radius-c', () => {
         var res = {
           type: 'integer',
           units: ['px', '%'],
@@ -664,7 +664,7 @@ module.exports = {
         expect(obj.build('border-radius-c')).toEqual([res]);
       });
 
-      it('Build border-radius', () => {
+      test('Build border-radius', () => {
         var res = {
           property: 'border-radius',
           type: 'composite',
@@ -703,7 +703,7 @@ module.exports = {
         expect(obj.build('border-radius')).toEqual([res]);
       });
 
-      it('Build background-color', () => {
+      test('Build background-color', () => {
         var res = {
           type: 'color',
           defaults: 'none'
@@ -712,7 +712,7 @@ module.exports = {
         expect(obj.build('background-color')).toEqual([res]);
       });
 
-      it('Build border', () => {
+      test('Build border', () => {
         var res = {
           property: 'border',
           type: 'composite',
@@ -750,7 +750,7 @@ module.exports = {
         expect(obj.build('border')).toEqual([res]);
       });
 
-      it('Build box-shadow', () => {
+      test('Build box-shadow', () => {
         var res = {
           property: 'box-shadow',
           type: 'stack',
@@ -800,7 +800,7 @@ module.exports = {
         expect(obj.build('box-shadow')).toEqual([res]);
       });
 
-      it('Build background', () => {
+      test('Build background', () => {
         var res = {
           property: 'background',
           type: 'stack',
@@ -865,7 +865,7 @@ module.exports = {
         expect(obj.build('background')).toEqual([res]);
       });
 
-      it('Build transition', () => {
+      test('Build transition', () => {
         var res = {
           property: 'transition',
           type: 'stack',
@@ -908,7 +908,7 @@ module.exports = {
         expect(obj.build('transition')).toEqual([res]);
       });
 
-      it('Build perspective', () => {
+      test('Build perspective', () => {
         var res = {
           property: 'perspective',
           type: 'integer',
@@ -919,7 +919,7 @@ module.exports = {
         expect(obj.build('perspective')).toEqual([res]);
       });
 
-      it('Build transform', () => {
+      test('Build transform', () => {
         var res = {
           property: 'transform',
           type: 'composite',
@@ -968,7 +968,7 @@ module.exports = {
         expect(obj.build('transform')).toEqual([res]);
       });
 
-      it('Build cursor', () => {
+      test('Build cursor', () => {
         var res = {
           type: 'select',
           property: 'cursor',
@@ -988,7 +988,7 @@ module.exports = {
         expect(obj.build('cursor')).toEqual([res]);
       });
 
-      it('Build overflow', () => {
+      test('Build overflow', () => {
         var res = {
           type: 'select',
           property: 'overflow',

test/specs/style_manager/view/LayerView.js

@@ -21,13 +21,13 @@ module.exports = {
         fixtures.appendChild(view.render().el);
       });
 
-      after(() => {
+      afterAll(() => {
         component = null;
         view = null;
         model = null;
       });
 
-      it('Rendered correctly', () => {
+      test('Rendered correctly', () => {
         var layer = view.el;
         expect(fixtures.querySelector('.layer')).toExist();
         expect(layer.querySelector('#label')).toExist();
@@ -36,21 +36,21 @@ module.exports = {
         expect(view.getPreviewEl()).toExist();
       });
 
-      it('Is not active by default', () => {
+      test('Is not active by default', () => {
         expect(view.$el.hasClass('active')).toEqual(false);
       });
 
-      it('Is possible to activate it', () => {
+      test('Is possible to activate it', () => {
         view.model.set('active', 1);
         expect(view.$el.hasClass('active')).toEqual(true);
       });
 
-      it('Is possible to activate it with active()', () => {
+      test('Is possible to activate it with active()', () => {
         view.active();
         expect(view.$el.hasClass('active')).toEqual(true);
       });
 
-      it('No preview', () => {
+      test('No preview', () => {
         var style = view.el.querySelector('#preview').style;
         expect(style.cssText).toNotExist();
       });

test/specs/style_manager/view/PropertyColorView.js

@@ -20,7 +20,7 @@ module.exports = {
       var propValue = '#fff';
       var defValue = 'test2value';
 
-      before(() => {
+      beforeAll(() => {
         $.fn.spectrum = function() {
           return this;
         };
@@ -52,51 +52,51 @@ module.exports = {
         //view.remove(); // strange errors ???
       });
 
-      after(() => {
+      afterAll(() => {
         component = null;
         view = null;
         model = null;
       });
 
-      it('Rendered correctly', () => {
+      test('Rendered correctly', () => {
         var prop = view.el;
         expect(fixtures.querySelector('.property')).toExist();
         expect(prop.querySelector('.label')).toExist();
         expect(prop.querySelector('.field')).toExist();
       });
 
-      it('Inputs rendered', () => {
+      test('Inputs rendered', () => {
         var prop = view.el;
         expect(prop.querySelector('input[type=text]')).toExist();
       });
 
-      it('Inputs should exist', () => {
+      test('Inputs should exist', () => {
         expect(view.$input).toExist();
         expect(view.$color).toExist();
       });
 
-      it('Input value is empty', () => {
+      test('Input value is empty', () => {
         expect(view.model.get('value')).toNotExist();
         expect(view.getInputValue()).toNotExist();
       });
 
-      it('Update model on setValue', () => {
+      test('Update model on setValue', () => {
         view.setValue(propValue);
         expect(view.getInputValue()).toEqual(propValue);
       });
 
-      it('Update model on input change', () => {
+      test('Update model on input change', () => {
         view.getInputEl().value = propValue;
         view.inputValueChanged();
         expect(view.model.get('value')).toEqual(propValue);
       });
 
-      it('Update input on value change', () => {
+      test('Update input on value change', () => {
         view.model.set('value', propValue);
         expect(view.getInputValue()).toEqual(propValue);
       });
 
-      it('Update target on value change', () => {
+      test('Update target on value change', () => {
         view.selectedComponent = component;
         view.model.set('value', propValue);
         var compStyle = view.selectedComponent.get('style');
@@ -117,7 +117,7 @@ module.exports = {
           fixtures.appendChild(view.el);
         });
 
-        it('Update value and input on target swap', () => {
+        test('Update value and input on target swap', () => {
           var style = {};
           style[propName] = propValue;
           component.set('style', style);
@@ -126,7 +126,7 @@ module.exports = {
           expect(view.getInputValue()).toEqual(propValue);
         });
 
-        it('Update value after multiple swaps', () => {
+        test('Update value after multiple swaps', () => {
           var style = {};
           style[propName] = propValue;
           component.set('style', style);
@@ -155,11 +155,11 @@ module.exports = {
           fixtures.appendChild(view.el);
         });
 
-        it('Value as default', () => {
+        test('Value as default', () => {
           expect(view.model.get('value')).toEqual(propValue);
         });
 
-        it('Input value is the default', () => {
+        test('Input value is the default', () => {
           expect(view.getInputValue()).toEqual(propValue);
         });
       });

test/specs/style_manager/view/PropertyCompositeView.js

@@ -58,25 +58,25 @@ module.exports = {
         fixtures.appendChild(view.el);
       });
 
-      after(() => {
+      afterAll(() => {
         component = null;
         view = null;
         model = null;
       });
 
-      it('Rendered correctly', () => {
+      test('Rendered correctly', () => {
         var prop = view.el;
         expect(fixtures.querySelector('.property')).toExist();
         expect(prop.querySelector('.label')).toExist();
         expect(prop.querySelector('.field')).toExist();
       });
 
-      it('Properties rendered', () => {
+      test('Properties rendered', () => {
         var prop = view.el;
         expect(prop.querySelector('.properties')).toExist();
       });
 
-      it('Properties rendered correctly', () => {
+      test('Properties rendered correctly', () => {
         var children = view.el.querySelector('.properties').children;
         expect(children.length).toEqual(properties.length);
         expect(children[0].id).toEqual(properties[0].property);
@@ -84,15 +84,15 @@ module.exports = {
         expect(children[2].id).toEqual(properties[2].property);
       });
 
-      it('Props should exist', () => {
+      test('Props should exist', () => {
         expect(view.$props).toExist();
       });
 
-      it('Input value is empty', () => {
+      test('Input value is empty', () => {
         expect(model.getFullValue()).toEqual('0 val2');
       });
 
-      it('Update input on value change', () => {
+      test('Update input on value change', () => {
         view.model.set('value', propValue);
         // Fetch always values from properties
         expect(view.getInputValue()).toEqual('0 val2');
@@ -129,13 +129,13 @@ module.exports = {
           $prop3 = view.$props.find('#' + properties[2].property + ' select');
         });
 
-        it('Update model on input change', () => {
+        test('Update model on input change', () => {
           $prop1.val(propValue).trigger('change');
           $prop3.val(prop3Val).trigger('change');
           expect(model.getFullValue()).toEqual(finalResult);
         });
 
-        it('Update value on models change', () => {
+        test('Update value on models change', () => {
           view.model
             .get('properties')
             .at(0)
@@ -147,7 +147,7 @@ module.exports = {
           expect(view.model.get('value')).toEqual(finalResult);
         });
 
-        it('Update target on value change', () => {
+        test('Update target on value change', () => {
           $prop1.val(propValue).trigger('change');
           var compStyle = view.getTarget().get('style');
           var assertStyle = {};
@@ -155,7 +155,7 @@ module.exports = {
           expect(compStyle).toEqual(assertStyle);
         });
 
-        it('Update target on detached value change', () => {
+        test('Update target on detached value change', () => {
           model = new PropertyComposite({
             type: 'composite',
             property: propName,
@@ -177,7 +177,7 @@ module.exports = {
           expect(compStyle).toEqual(assertStyle);
         });
 
-        it('Update value and input on target swap', () => {
+        test('Update value and input on target swap', () => {
           var style = {};
           style[propName] = finalResult;
           component.set('style', style);
@@ -186,7 +186,7 @@ module.exports = {
           expect($prop3.val()).toEqual(prop3Val);
         });
 
-        it('Update value after multiple swaps', () => {
+        test('Update value after multiple swaps', () => {
           var style = {};
           style[propName] = finalResult;
           component.set('style', style);
@@ -200,7 +200,7 @@ module.exports = {
           expect($prop3.val()).toEqual('val1');
         });
 
-        it('The value is correctly extracted from the composite string', () => {
+        test('The value is correctly extracted from the composite string', () => {
           var style = {};
           style[propName] = 'value1 value2 value3 value4';
           component.set('style', style);
@@ -209,7 +209,7 @@ module.exports = {
           expect(view.valueOnIndex(4)).toEqual(null);
         });
 
-        it('Build value from properties', () => {
+        test('Build value from properties', () => {
           view.model
             .get('properties')
             .at(0)
@@ -238,7 +238,7 @@ module.exports = {
           fixtures.appendChild(view.el);
         });
 
-        it('Value as default', () => {
+        test('Value as default', () => {
           expect(view.model.get('value')).toEqual(defValue);
         });
       });

test/specs/style_manager/view/PropertyIntegerView.js

@@ -53,47 +53,47 @@ module.exports = {
         //view.remove(); // strange errors ???
       });
 
-      after(() => {
+      afterAll(() => {
         component = null;
         view = null;
         model = null;
       });
 
-      it('Rendered correctly', () => {
+      test('Rendered correctly', () => {
         var prop = view.el;
         expect(fixtures.querySelector('.property')).toExist();
         expect(prop.querySelector('.label')).toExist();
         expect(prop.querySelector('.field')).toExist();
       });
 
-      it('Inputs rendered', () => {
+      test('Inputs rendered', () => {
         var prop = view.el;
         expect(prop.querySelector('input[type=text]')).toExist();
         expect(prop.querySelector(unitsElSel)).toExist();
       });
 
-      it('Units rendered', () => {
+      test('Units rendered', () => {
         var select = view.el.querySelector(unitsElSel);
         expect(select.children.length).toEqual(units.length);
       });
 
-      it('Units rendered correctly', () => {
+      test('Units rendered correctly', () => {
         var children = view.el.querySelector(unitsElSel).children;
         expect(children[0].textContent).toEqual(units[0]);
         expect(children[1].textContent).toEqual(units[1]);
         expect(children[2].textContent).toEqual(units[2]);
       });
 
-      it('Inputs should exist', () => {
+      test('Inputs should exist', () => {
         expect(view.input).toExist();
         expect(view.unit).toExist();
       });
 
-      it('Input value is empty', () => {
+      test('Input value is empty', () => {
         expect(view.model.get('value')).toNotExist();
       });
 
-      it('Update model on setValue', () => {
+      test('Update model on setValue', () => {
         view.setValue(intValue + unitValue);
         expect(view.model.get('value')).toEqual(parseFloat(intValue));
         expect(view.model.get('unit')).toEqual(unitValue);
@@ -101,22 +101,22 @@ module.exports = {
         expect(view.unit.value).toEqual(unitValue);
       });
 
-      it('Update model on input change', () => {
+      test('Update model on input change', () => {
         view.$input.val(123).trigger('change');
         expect(view.model.get('value')).toEqual(123);
       });
 
-      it('Update model on unit change', () => {
+      test('Update model on unit change', () => {
         view.$unit.val(units[1]).trigger('change');
         expect(view.model.get('unit')).toEqual(units[1]);
       });
 
-      it('Update input on value change', () => {
+      test('Update input on value change', () => {
         view.model.set('value', intValue);
         expect(view.getInputValue()).toEqual(intValue);
       });
 
-      it('Update target on value change', () => {
+      test('Update target on value change', () => {
         const val = `${intValue}%`;
         view.model.setValue(val);
         expect(view.getTargetValue()).toEqual(val);
@@ -134,7 +134,7 @@ module.exports = {
           fixtures.appendChild(view.el);
         });
 
-        it('Update value and input on target swap', () => {
+        test('Update value and input on target swap', () => {
           var style = {};
           style[propName] = propValue;
           component.set('style', style);
@@ -143,7 +143,7 @@ module.exports = {
           expect(view.getInputValue()).toEqual(intValue);
         });
 
-        it('Update value after multiple swaps', () => {
+        test('Update value after multiple swaps', () => {
           var style = {};
           style[propName] = propValue;
           component.set('style', style);
@@ -177,23 +177,23 @@ module.exports = {
           fixtures.appendChild(view.el);
         });
 
-        it('Value as default', () => {
+        test('Value as default', () => {
           expect(view.model.get('value')).toEqual(parseInt(intValue));
           expect(view.model.get('unit')).toEqual(units[1]);
         });
 
-        it('Input value is as default', () => {
+        test('Input value is as default', () => {
           expect(view.getInputValue()).toEqual(intValue);
           expect(view.$unit.val()).toEqual(units[1]);
         });
 
-        it('Input follows min', () => {
+        test('Input follows min', () => {
           view.$input.val(minValue - 50).trigger('change');
           expect(view.model.get('value')).toEqual(minValue);
           expect(view.getInputValue()).toEqual(minValue + '');
         });
 
-        it('Input follows max', () => {
+        test('Input follows max', () => {
           view.$input.val(maxValue + 50).trigger('change');
           expect(view.model.get('value')).toEqual(maxValue);
           expect(view.getInputValue()).toEqual(maxValue + '');

test/specs/style_manager/view/PropertyRadioView.js

@@ -57,28 +57,28 @@ module.exports = {
         //view.remove(); // strange errors ???
       });
 
-      after(() => {
+      afterAll(() => {
         component = null;
       });
 
-      it('Rendered correctly', () => {
+      test('Rendered correctly', () => {
         var prop = view.el;
         expect(fixtures.querySelector('.property')).toExist();
         expect(prop.querySelector('.label')).toExist();
         expect(prop.querySelector('.field')).toExist();
       });
 
-      it('Radio rendered', () => {
+      test('Radio rendered', () => {
         var prop = view.el;
         expect(prop.querySelector('input[type=radio]')).toExist();
       });
 
-      it('Options rendered', () => {
+      test('Options rendered', () => {
         var input = view.el.querySelector('.field').firstChild;
         expect(input.children.length).toEqual(options.length);
       });
 
-      it('Options rendered correctly', () => {
+      test('Options rendered correctly', () => {
         var children = view.el.querySelector('.field').firstChild.children;
         expect(children[0].querySelector('label').textContent).toEqual(
           'test1value'
@@ -98,25 +98,25 @@ module.exports = {
         ).toEqual(null);
       });
 
-      it('Input should exist', () => {
+      test('Input should exist', () => {
         expect(view.input).toExist();
       });
 
-      it('Input value is empty', () => {
+      test('Input value is empty', () => {
         expect(view.model.get('value')).toNotExist();
       });
 
-      it('Update model on input change', () => {
+      test('Update model on input change', () => {
         view.setValue(propValue);
         expect(getCheckedEl(view).value).toEqual(propValue);
       });
 
-      it('Update input on value change', () => {
+      test('Update input on value change', () => {
         view.model.set('value', propValue);
         expect(getCheckedEl(view).value).toEqual(propValue);
       });
 
-      it('Update target on value change', () => {
+      test('Update target on value change', () => {
         view.selectedComponent = component;
         view.model.set('value', propValue);
         var compStyle = view.selectedComponent.get('style');
@@ -137,7 +137,7 @@ module.exports = {
           fixtures.appendChild(view.el);
         });
 
-        it('Update value and input on target swap', () => {
+        test('Update value and input on target swap', () => {
           var style = {};
           style[propName] = propValue;
           component.set('style', style);
@@ -146,7 +146,7 @@ module.exports = {
           expect(getCheckedEl(view).value).toEqual(propValue);
         });
 
-        it('Update value after multiple swaps', () => {
+        test('Update value after multiple swaps', () => {
           var style = {};
           style[propName] = propValue;
           component.set('style', style);
@@ -176,11 +176,11 @@ module.exports = {
           fixtures.appendChild(view.el);
         });
 
-        it('Value as default', () => {
+        test('Value as default', () => {
           expect(view.model.get('value')).toEqual(defValue);
         });
 
-        it('Input value is as default', () => {
+        test('Input value is as default', () => {
           expect(view.model.getDefaultValue()).toEqual(defValue);
         });
       });

test/specs/style_manager/view/PropertySelectView.js

@@ -52,28 +52,28 @@ module.exports = {
         //view.remove(); // strange errors ???
       });
 
-      after(() => {
+      afterAll(() => {
         component = null;
       });
 
-      it('Rendered correctly', () => {
+      test('Rendered correctly', () => {
         var prop = view.el;
         expect(fixtures.querySelector('.property')).toExist();
         expect(prop.querySelector('.label')).toExist();
         expect(prop.querySelector('.field')).toExist();
       });
 
-      it('Select rendered', () => {
+      test('Select rendered', () => {
         var prop = view.el;
         expect(prop.querySelector('select')).toExist();
       });
 
-      it('Options rendered', () => {
+      test('Options rendered', () => {
         var select = view.el.querySelector('select');
         expect(select.children.length).toEqual(options.length);
       });
 
-      it('Options rendered correctly', () => {
+      test('Options rendered correctly', () => {
         var select = view.el.querySelector('select');
         var children = select.children;
         expect(children[0].value).toEqual(options[0].value);
@@ -84,26 +84,26 @@ module.exports = {
         expect(children[1].getAttribute('style')).toEqual(null);
       });
 
-      it('Input should exist', () => {
+      test('Input should exist', () => {
         expect(view.input).toExist();
       });
 
-      it('Input value is empty', () => {
+      test('Input value is empty', () => {
         expect(view.model.get('value')).toNotExist();
       });
 
-      it('Update model on input change', () => {
+      test('Update model on input change', () => {
         view.getInputEl().value = propValue;
         view.inputValueChanged();
         expect(view.model.get('value')).toEqual(propValue);
       });
 
-      it('Update input on value change', () => {
+      test('Update input on value change', () => {
         view.model.set('value', propValue);
         expect(view.getInputValue()).toEqual(propValue);
       });
 
-      it('Update target on value change', () => {
+      test('Update target on value change', () => {
         view.selectedComponent = component;
         view.model.set('value', propValue);
         var compStyle = view.selectedComponent.get('style');
@@ -124,7 +124,7 @@ module.exports = {
           fixtures.appendChild(view.el);
         });
 
-        it('Update value and input on target swap', () => {
+        test('Update value and input on target swap', () => {
           var style = {};
           style[propName] = propValue;
           component.set('style', style);
@@ -133,7 +133,7 @@ module.exports = {
           expect(view.getInputValue()).toEqual(propValue);
         });
 
-        it('Update value after multiple swaps', () => {
+        test('Update value after multiple swaps', () => {
           var style = {};
           style[propName] = propValue;
           component.set('style', style);
@@ -163,11 +163,11 @@ module.exports = {
           fixtures.appendChild(view.el);
         });
 
-        it('Value as default', () => {
+        test('Value as default', () => {
           expect(view.model.get('value')).toEqual(defValue);
         });
 
-        it('Empty value as default', () => {
+        test('Empty value as default', () => {
           options = [
             { value: '', name: 'test' },
             { value: 'test1value', name: 'test1' },
@@ -190,7 +190,7 @@ module.exports = {
           expect(view.getInputValue()).toEqual('');
         });
 
-        it('Input value is as default', () => {
+        test('Input value is as default', () => {
           expect(view.model.getDefaultValue()).toEqual(defValue);
         });
       });

test/specs/style_manager/view/PropertyStackView.js

@@ -60,13 +60,13 @@ module.exports = {
         fixtures.appendChild(view.el);
       });
 
-      after(() => {
+      afterAll(() => {
         component = null;
         view = null;
         model = null;
       });
 
-      it('Rendered correctly', () => {
+      test('Rendered correctly', () => {
         var prop = view.el;
         expect(fixtures.querySelector('.property')).toExist();
         expect(prop.querySelector('.label')).toExist();
@@ -74,24 +74,24 @@ module.exports = {
         expect(prop.querySelector('#add')).toExist();
       });
 
-      it('Layers rendered', () => {
+      test('Layers rendered', () => {
         expect(view.el.querySelector('.layers')).toExist();
       });
 
-      it('Layers wrapper should exist', () => {
+      test('Layers wrapper should exist', () => {
         expect(view.el.querySelector('[data-layers-wrapper]')).toExist();
       });
 
-      it('Layers rendered correctly', () => {
+      test('Layers rendered correctly', () => {
         var children = view.el.querySelector('[data-layers-wrapper]').children;
         expect(children.length).toEqual(1);
       });
 
-      it('Input value is on default', () => {
+      test('Input value is on default', () => {
         expect(view.model.get('value')).toEqual('0 val2');
       });
 
-      it('Layers container is empty', () => {
+      test('Layers container is empty', () => {
         var layers = view.el.querySelector('.layers');
         expect(layers.innerHTML).toNotExist();
       });
@@ -113,11 +113,11 @@ module.exports = {
           model.get('layers').add(layers);
         });
 
-        it('Layers inserted', () => {
+        test('Layers inserted', () => {
           expect(view.getLayers().length).toEqual(layers.length);
         });
 
-        it('Add layer', () => {
+        test('Add layer', () => {
           view.addLayer();
           expect(view.getLayers().length).toEqual(layers.length + 1);
         });

test/specs/style_manager/view/PropertyView.js

@@ -45,45 +45,45 @@ module.exports = {
         //view.remove(); // strange errors ???
       });
 
-      after(() => {
+      afterAll(() => {
         component = null;
       });
 
-      it('Rendered correctly', () => {
+      test('Rendered correctly', () => {
         var prop = view.el;
         expect(fixtures.querySelector('.property')).toExist();
         expect(prop.querySelector('.label')).toExist();
         expect(prop.querySelector('.field')).toExist();
       });
 
-      it('Input should exist', () => {
+      test('Input should exist', () => {
         expect(view.getInputEl()).toExist();
       });
 
-      it('Input value is empty', () => {
+      test('Input value is empty', () => {
         expect(view.model.get('value')).toNotExist();
         expect(view.getInputValue()).toNotExist();
       });
 
-      it('Model not change without update trigger', () => {
+      test('Model not change without update trigger', () => {
         view.getInputEl().value = propValue;
         expect(view.model.get('value')).toNotExist();
       });
 
       // Tests inputValueChanged()
-      it('Update model on input change', () => {
+      test('Update model on input change', () => {
         view.getInputEl().value = propValue;
         view.inputValueChanged();
         expect(view.model.get('value')).toEqual(propValue);
       });
 
       // Tests modelValueChanged() -> ...
-      it('Update input on value change', () => {
+      test('Update input on value change', () => {
         view.model.set('value', propValue);
         expect(view.getInputValue()).toEqual(propValue);
       });
 
-      it('Update target on value change', () => {
+      test('Update target on value change', () => {
         view.model.set('value', propValue);
         var compStyle = view.getTargetModel().get('style');
         var assertStyle = {};
@@ -91,7 +91,7 @@ module.exports = {
         expect(compStyle).toEqual(assertStyle);
       });
 
-      it('Update target on value change with functionName', () => {
+      test('Update target on value change with functionName', () => {
         view.model.set('functionName', 'testfunc');
         view.model.set('value', propValue);
         var compStyle = view.getTargetModel().get('style');
@@ -100,14 +100,14 @@ module.exports = {
         expect(compStyle).toEqual(assertStyle);
       });
 
-      it('Clean target from the property if its value is empty', () => {
+      test('Clean target from the property if its value is empty', () => {
         view.model.set('value', propValue);
         view.model.set('value', '');
         var compStyle = view.getTargetModel().get('style');
         expect(compStyle).toEqual({});
       });
 
-      it('Check stylable element', () => {
+      test('Check stylable element', () => {
         expect(view.isTargetStylable()).toEqual(true);
         component.set('stylable', false);
         expect(view.isTargetStylable()).toEqual(false);
@@ -119,25 +119,25 @@ module.exports = {
         expect(view.isTargetStylable()).toEqual(false);
       });
 
-      it('Target style is empty without values', () => {
+      test('Target style is empty without values', () => {
         expect(view.getTargetValue()).toNotExist();
       });
 
-      it('Target style is correct', () => {
+      test('Target style is correct', () => {
         var style = {};
         style[propName] = propValue;
         component.set('style', style);
         expect(view.getTargetValue()).toEqual(propValue);
       });
 
-      it('Target style is empty with an other style', () => {
+      test('Target style is empty with an other style', () => {
         var style = {};
         style[propName + '2'] = propValue;
         component.set('style', style);
         expect(view.getTargetValue()).toNotExist();
       });
 
-      it('Fetch value from function', () => {
+      test('Fetch value from function', () => {
         view.selectedComponent = component;
         const val = `testfun(${propValue})`;
         component.set('style', { [propName]: val });
@@ -157,21 +157,21 @@ module.exports = {
           fixtures.appendChild(view.el);
         });
 
-        it('updateTargetStyle', () => {
+        test('updateTargetStyle', () => {
           view.updateTargetStyle(propValue);
           var style = {};
           style[propName] = propValue;
           expect(component.get('style')).toEqual(style);
         });
 
-        it('updateTargetStyle with custom property', () => {
+        test('updateTargetStyle with custom property', () => {
           view.updateTargetStyle(propValue, propName + '2');
           var style = {};
           style[propName + '2'] = propValue;
           expect(component.get('style')).toEqual(style);
         });
 
-        it('Update value and input on target swap', () => {
+        test('Update value and input on target swap', () => {
           var style = {};
           style[propName] = propValue;
           component.set('style', style);
@@ -180,7 +180,7 @@ module.exports = {
           expect(view.getInputValue()).toEqual(propValue);
         });
 
-        it('Update value after multiple swaps', () => {
+        test('Update value after multiple swaps', () => {
           var style = {};
           style[propName] = propValue;
           component.set('style', style);
@@ -208,16 +208,16 @@ module.exports = {
           fixtures.appendChild(view.el);
         });
 
-        it('Value as default', () => {
+        test('Value as default', () => {
           expect(view.model.get('value')).toEqual(defValue);
         });
 
-        it('Placeholder as default', () => {
+        test('Placeholder as default', () => {
           var input = view.getInputEl();
           expect(input.getAttribute('placeholder')).toEqual(defValue);
         });
 
-        it('Input value is set up to default', () => {
+        test('Input value is set up to default', () => {
           expect(view.getInputValue()).toEqual(defValue);
         });
       });

test/specs/style_manager/view/SectorView.js

@@ -22,7 +22,7 @@ module.exports = {
         view.remove();
       });
 
-      it('Rendered correctly', () => {
+      test('Rendered correctly', () => {
         var sector = view.el;
         expect(sector.querySelector('.title')).toExist();
         var props = sector.querySelector('.properties');
@@ -30,12 +30,12 @@ module.exports = {
         expect(sector.classList.contains('open')).toEqual(true);
       });
 
-      it('No properties', () => {
+      test('No properties', () => {
         var props = view.el.querySelector('.properties');
         expect(props.innerHTML).toEqual('');
       });
 
-      it('Update on open', () => {
+      test('Update on open', () => {
         var sector = view.el;
         var props = sector.querySelector('.properties');
         model.set('open', false);
@@ -43,7 +43,7 @@ module.exports = {
         expect(props.style.display).toEqual('none');
       });
 
-      it('Toggle on click', () => {
+      test('Toggle on click', () => {
         var sector = view.el;
         view.$el.find('.title').click();
         expect(sector.classList.contains('open')).toEqual(false);
@@ -70,7 +70,7 @@ module.exports = {
           fixtures.appendChild(view.render().el);
         });
 
-        it('Rendered correctly', () => {
+        test('Rendered correctly', () => {
           var sector = view.el;
           var props = sector.querySelector('.properties');
           expect(sector.querySelector('.title').innerHTML).toContain(
@@ -81,7 +81,7 @@ module.exports = {
           expect(props.style.display).toEqual('none');
         });
 
-        it('Has properties', () => {
+        test('Has properties', () => {
           var props = view.el.querySelector('.properties');
           expect(props.children.length).toEqual(3);
         });

test/specs/style_manager/view/SectorsView.js

@@ -22,11 +22,11 @@ module.exports = {
         view.collection.reset();
       });
 
-      it('Collection is empty', () => {
+      test('Collection is empty', () => {
         expect(view.el.innerHTML).toEqual('');
       });
 
-      it('Add new sectors', () => {
+      test('Add new sectors', () => {
         view.collection.add([{}, {}]);
         expect(view.el.children.length).toEqual(2);
       });

test/specs/trait_manager/model/TraitsModel.js

@@ -20,7 +20,7 @@ module.exports = {
         obj = null;
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(Trait).toExist();
       });
     });

test/specs/trait_manager/view/TraitsView.js

@@ -27,22 +27,22 @@ module.exports = {
         target = null;
       });
 
-      it('Object exists', () => {
+      test('Object exists', () => {
         expect(Trait).toExist();
       });
 
-      it('Target has no attributes on init', () => {
+      test('Target has no attributes on init', () => {
         expect(target.get('attributes')).toEqual({});
       });
 
-      it('On update of the value updates the target attributes', () => {
+      test('On update of the value updates the target attributes', () => {
         model.set('value', 'test');
         var eq = {};
         eq[modelName] = 'test';
         expect(target.get('attributes')).toEqual(eq);
       });
 
-      it('Updates on different models do not alter other targets', () => {
+      test('Updates on different models do not alter other targets', () => {
         var target1 = new Component();
         var target2 = new Component();
         var model1 = new Trait({

test/specs/utils/Sorter.js

@@ -4,7 +4,7 @@ define(function(require, exports, module) {
 
   module.exports = {
     run: function() {
-      describe('Sorter', function() {
+      describe('Sorter', () => {
         var fixtures;
         var fixture;
         var obj;
@@ -12,11 +12,11 @@ define(function(require, exports, module) {
         var plh;
         var html;
 
-        before(function() {
+        beforeAll(function() {
           fixture = $('<div class="sorter-fixture"></div>').get(0);
         });
 
-        beforeEach(function() {
+        beforeEach(() => {
           parent = document.createElement('div');
           parent.setAttribute('class', 'parent1');
           plh = document.createElement('div');
@@ -52,14 +52,14 @@ define(function(require, exports, module) {
             '</div>';
         });
 
-        afterEach(function() {
+        afterEach(() => {
           document.body.removeChild(fixture);
           obj = null;
           parent = null;
           html = null;
         });
 
-        it('matches class', function() {
+        test('matches class', () => {
           var el = document.createElement('div');
           el.setAttribute('class', 'test test2');
           parent.appendChild(el);
@@ -68,7 +68,7 @@ define(function(require, exports, module) {
           obj.matches(el, '.test3').should.equal(false);
         });
 
-        it('matches id', function() {
+        test('matches id', () => {
           var el = document.createElement('div');
           el.setAttribute('id', 'test2');
           parent.appendChild(el);
@@ -77,7 +77,7 @@ define(function(require, exports, module) {
           obj.matches(el, '#test').should.equal(false);
         });
 
-        it('matches tag', function() {
+        test('matches tag', () => {
           var el = document.createElement('span');
           parent.appendChild(el);
           obj.matches(el, 'span').should.equal(true);
@@ -85,17 +85,17 @@ define(function(require, exports, module) {
           obj.matches(el, '*').should.equal(true);
         });
 
-        it('Creates placeholder', function() {
+        test('Creates placeholder', () => {
           obj.createPlaceholder().className.should.equal('placeholder');
         });
 
-        it('isInFlow to overflow hidden', function() {
+        test('isInFlow to overflow hidden', () => {
           parent.innerHTML = html;
           var el = parent.querySelector('#el1');
           obj.isInFlow(el).should.equal(false);
         });
 
-        it('isInFlow inner to overflow', function() {
+        test('isInFlow inner to overflow', () => {
           parent.innerHTML = html;
           var el = parent.querySelector('#el2');
           if (!el) {
@@ -105,13 +105,13 @@ define(function(require, exports, module) {
           obj.isInFlow(el).should.equal(true);
         });
 
-        it('isInFlow for span', function() {
+        test('isInFlow for span', () => {
           parent.innerHTML = html;
           var el = parent.querySelector('#elspan');
           obj.isInFlow(el).should.equal(false);
         });
 
-        it('isInFlow for div #a', function() {
+        test('isInFlow for div #a', () => {
           parent.innerHTML = html;
           var el = parent.querySelector('#a');
           if (!el) {
@@ -121,7 +121,7 @@ define(function(require, exports, module) {
           obj.isInFlow(el).should.equal(true);
         });
 
-        it('isInFlow for div #aa', function() {
+        test('isInFlow for div #aa', () => {
           parent.innerHTML = html;
           var el = parent.querySelector('#aa');
           if (!el) {
@@ -131,7 +131,7 @@ define(function(require, exports, module) {
           obj.isInFlow(el).should.equal(true);
         });
 
-        it('isInFlow for p #aaa', function() {
+        test('isInFlow for p #aaa', () => {
           parent.innerHTML = html;
           var el = parent.querySelector('#aaa');
           if (!el) {
@@ -141,13 +141,13 @@ define(function(require, exports, module) {
           obj.isInFlow(el).should.equal(true);
         });
 
-        it('isInFlow for span #aab', function() {
+        test('isInFlow for span #aab', () => {
           parent.innerHTML = html;
           var el = parent.querySelector('#aab');
           obj.isInFlow(el).should.equal(false);
         });
 
-        it('isInFlow for span #aac with display block', function() {
+        test('isInFlow for span #aac with display block', () => {
           parent.innerHTML = html;
           var el = parent.querySelector('#aac');
           if (!el)
@@ -156,19 +156,19 @@ define(function(require, exports, module) {
           obj.isInFlow(el).should.equal(true);
         });
 
-        it('isInFlow for div #ab with float left', function() {
+        test('isInFlow for div #ab with float left', () => {
           parent.innerHTML = html;
           var el = parent.querySelector('#ab');
           obj.isInFlow(el).should.equal(false);
         });
 
-        it('isInFlow for div #ac in absolute', function() {
+        test('isInFlow for div #ac in absolute', () => {
           parent.innerHTML = html;
           var el = parent.querySelector('#ac');
           obj.isInFlow(el).should.equal(false);
         });
 
-        it('isInFlow for div #acb inside absolute', function() {
+        test('isInFlow for div #acb inside absolute', () => {
           parent.innerHTML = html;
           var el = parent.querySelector('#acb');
           if (!el) {
@@ -178,17 +178,17 @@ define(function(require, exports, module) {
           obj.isInFlow(el).should.equal(true);
         });
 
-        it('isInFlow for div #ad overflow hidden', function() {
+        test('isInFlow for div #ad overflow hidden', () => {
           parent.innerHTML = html;
           var el = parent.querySelector('#ad');
           obj.isInFlow(el).should.equal(false);
         });
 
-        describe('Closest method', function() {
+        describe('Closest method', () => {
           var parent2;
           var parent3;
 
-          beforeEach(function() {
+          beforeEach(() => {
             parent2 = document.createElement('span');
             parent2.setAttribute('class', 'parent2');
             parent3 = document.createElement('div');
@@ -197,7 +197,7 @@ define(function(require, exports, module) {
             parent2.appendChild(parent3);
           });
 
-          it('Closest by class', function() {
+          test('Closest by class', () => {
             var el = document.createElement('div');
             parent3.appendChild(el);
             obj.closest(el, '.parent2').should.deep.equal(parent2);
@@ -205,7 +205,7 @@ define(function(require, exports, module) {
             obj.closest(el, '.parent1').should.deep.equal(parent);
           });
 
-          it('Closest by tag', function() {
+          test('Closest by tag', () => {
             var el = document.createElement('div');
             el.setAttribute('class', 'el');
             parent3.appendChild(el);
@@ -215,7 +215,7 @@ define(function(require, exports, module) {
           });
         });
 
-        describe('With elements', function() {
+        describe('With elements', () => {
           var vertDims;
           var parent2;
           var parent3;
@@ -225,7 +225,7 @@ define(function(require, exports, module) {
           var sib4;
           var el;
 
-          beforeEach(function() {
+          beforeEach(() => {
             parent2 = document.createElement('span');
             parent2.setAttribute('class', 'parent2');
             parent3 = document.createElement('div');
@@ -263,13 +263,13 @@ define(function(require, exports, module) {
             ];
           });
 
-          it('startSort inits correctly inits', function() {
+          test('startSort inits correctly inits', () => {
             obj.startSort(el);
             obj.moved.should.equal(0);
             obj.plh.style.display.should.equal('none');
           });
 
-          it('onMove', function() {
+          test('onMove', () => {
             var target = document.createElement('div');
             obj.startSort(el);
             obj.onMove({
@@ -280,7 +280,7 @@ define(function(require, exports, module) {
             obj.moved.should.equal(1);
           });
 
-          it('getDim from element', function() {
+          test('getDim from element', () => {
             var subPos = obj.offset(sib1);
             var top = subPos.top;
             var left = subPos.left;
@@ -288,7 +288,7 @@ define(function(require, exports, module) {
             obj.getDim(sib1).should.deep.equal(result);
           });
 
-          it('getChildrenDim from element', function() {
+          test('getChildrenDim from element', () => {
             el.style.position = 'absolute';
             el.style.top = '0';
             var ch = obj.getChildrenDim(el);
@@ -307,7 +307,7 @@ define(function(require, exports, module) {
             ch.should.deep.equal(result);
           });
 
-          it('nearBorders', function() {
+          test('nearBorders', () => {
             obj.borderOffset = 10;
             var dim = [0, 0, 100, 200];
             obj.nearBorders(dim, 20, 15).should.equal(false);
@@ -315,7 +315,7 @@ define(function(require, exports, module) {
             obj.nearBorders(dim, 500, 500).should.equal(true);
           });
 
-          it('dimsFromTarget', function() {
+          test('dimsFromTarget', () => {
             var child1 = document.createElement('div');
             var child2 = document.createElement('div');
             child1.style.width = '30px';
@@ -378,10 +378,10 @@ define(function(require, exports, module) {
             dims.should.deep.equal(resultParent);
           });
 
-          describe('findPosition', function() {
-            beforeEach(function() {});
+          describe('findPosition', () => {
+            beforeEach(() => {});
 
-            it('Vertical dimensions', function() {
+            test('Vertical dimensions', () => {
               var result = { index: 0, method: 'before' };
               obj.findPosition(vertDims, -10, -10).should.deep.equal(result);
               obj.findPosition(vertDims, 0, 0).should.deep.equal(result);
@@ -403,8 +403,8 @@ define(function(require, exports, module) {
             });
           });
 
-          describe('movePlaceholder', function() {
-            beforeEach(function() {
+          describe('movePlaceholder', () => {
+            beforeEach(() => {
               vertDims = [
                 [0, 10, 50, 100, true],
                 [50, 20, 50, 70, true],
@@ -413,7 +413,7 @@ define(function(require, exports, module) {
               ];
             });
 
-            it('Vertical dimensions with before position', function() {
+            test('Vertical dimensions with before position', () => {
               var pos = { index: 2, method: 'before' };
               obj.movePlaceholder(plh, vertDims, pos);
               var style = plh.style;
@@ -422,7 +422,7 @@ define(function(require, exports, module) {
               style.width.should.equal('100px');
             });
 
-            it('Vertical dimensions with after position', function() {
+            test('Vertical dimensions with after position', () => {
               var pos = { index: 1, method: 'after' };
               obj.movePlaceholder(plh, vertDims, pos);
               var style = plh.style;