From 2c52b3d7f3a75802d564f654600fb6395eb02ac0 Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Tue, 11 Jan 2022 13:35:42 +0100 Subject: [PATCH] Update PropertyView tests --- test/specs/style_manager/view/LayerView.js | 55 ------- test/specs/style_manager/view/PropertyView.js | 145 ++---------------- 2 files changed, 15 insertions(+), 185 deletions(-) delete mode 100644 test/specs/style_manager/view/LayerView.js diff --git a/test/specs/style_manager/view/LayerView.js b/test/specs/style_manager/view/LayerView.js deleted file mode 100644 index ad35b8159..000000000 --- a/test/specs/style_manager/view/LayerView.js +++ /dev/null @@ -1,55 +0,0 @@ -import LayerView from 'style_manager/view/LayerView'; -import Layers from 'style_manager/model/Layers'; - -describe('LayerView', () => { - var component; - var fixtures; - var target; - var model; - var view; - - beforeEach(() => { - var coll = new Layers(); - model = coll.add({}); - view = new LayerView({ - model - }); - document.body.innerHTML = '
'; - fixtures = document.body.firstChild; - fixtures.appendChild(view.render().el); - }); - - afterAll(() => { - component = null; - view = null; - model = null; - }); - - test('Rendered correctly', () => { - var layer = view.el; - expect(fixtures.querySelector('.layer')).toBeTruthy(); - expect(layer.querySelector('#label')).toBeTruthy(); - expect(layer.querySelector('#close-layer')).toBeTruthy(); - expect(view.getPropertiesWrapper()).toBeTruthy(); - expect(view.getPreviewEl()).toBeTruthy(); - }); - - test('Is not active by default', () => { - expect(view.$el.hasClass('active')).toEqual(false); - }); - - test('Is possible to activate it', () => { - view.model.set('active', 1); - expect(view.$el.hasClass('active')).toEqual(true); - }); - - test('Is possible to activate it with active()', () => { - view.active(); - expect(view.$el.hasClass('active')).toEqual(true); - }); - - test('No preview', () => { - var style = view.el.querySelector('#preview').style; - expect(style.cssText).toBeFalsy(); - }); -}); diff --git a/test/specs/style_manager/view/PropertyView.js b/test/specs/style_manager/view/PropertyView.js index da8b8bee7..a07f94942 100644 --- a/test/specs/style_manager/view/PropertyView.js +++ b/test/specs/style_manager/view/PropertyView.js @@ -1,4 +1,3 @@ -import Backbone from 'backbone'; import PropertyView from 'style_manager/view/PropertyView'; import Property from 'style_manager/model/Property'; import Editor from 'editor/model/Editor'; @@ -14,8 +13,6 @@ describe('PropertyView', () => { var target; var model; var view; - var propTarget; - var options; var propName = 'testprop'; var propValue = 'testvalue'; var defValue = 'testDefault'; @@ -24,16 +21,13 @@ describe('PropertyView', () => { em = new Editor({}); dcomp = new DomComponents(); compOpts = { em, componentTypes: dcomp.componentTypes }; - propTarget = { ...Backbone.Events }; target = new Component({}, compOpts); component = new Component({}, compOpts); - model = new Property({ property: propName }); - propTarget.model = component; - options = { + model = new Property({ property: propName }, { em }); + view = new PropertyView({ model, - propTarget - }; - view = new PropertyView(options); + config: { em }, + }); document.body.innerHTML = '
'; fixtures = document.body.firstChild; view.render(); @@ -61,7 +55,7 @@ describe('PropertyView', () => { test('Input value is empty', () => { expect(view.model.get('value')).toBeFalsy(); - expect(view.getInputValue()).toBeFalsy(); + expect(view.getInputEl().value).toBeFalsy(); }); test('Model not change without update trigger', () => { @@ -69,127 +63,18 @@ describe('PropertyView', () => { expect(view.model.get('value')).toBeFalsy(); }); - // Tests inputValueChanged() test('Update model on input change', () => { view.getInputEl().value = propValue; - view.inputValueChanged(); + view.inputValueChanged({ target: { value: propValue }, stopPropagation() {} }); expect(view.model.get('value')).toEqual(propValue); }); - // Tests modelValueChanged() -> ... - test('Update input on value change', () => { - view.model.set('value', propValue); - expect(view.getInputValue()).toEqual(propValue); - }); - - test('Update target on value change', () => { - view.model.set('value', propValue); - var compStyle = view.getTargetModel().get('style'); - var assertStyle = {}; - assertStyle[propName] = propValue; - expect(compStyle).toEqual(assertStyle); - }); - - test('Update target on value change with functionName', () => { - view.model.set('functionName', 'testfunc'); - view.model.set('value', propValue); - var compStyle = view.getTargetModel().get('style'); - var assertStyle = {}; - assertStyle[propName] = 'testfunc(' + propValue + ')'; - expect(compStyle).toEqual(assertStyle); - }); - - test('Clean target from the property if its value is empty', () => { + test('Update input on value change', done => { view.model.set('value', propValue); - view.model.set('value', ''); - var compStyle = view.getTargetModel().get('style'); - expect(compStyle).toEqual({}); - }); - - test('Check stylable element', () => { - expect(view.isTargetStylable()).toEqual(true); - component.set('stylable', false); - expect(view.isTargetStylable()).toEqual(false); - component.set('stylable', [propName]); - expect(view.isTargetStylable()).toEqual(true); - component.set('stylable', ['test1', propName]); - expect(view.isTargetStylable()).toEqual(true); - component.set('stylable', ['test1', 'test2']); - expect(view.isTargetStylable()).toEqual(false); - }); - - test('Target style is empty without values', () => { - expect(view.getTargetValue()).toBeFalsy(); - }); - - test('Target style is correct', () => { - var style = {}; - style[propName] = propValue; - component.set('style', style); - expect(view.getTargetValue()).toEqual(propValue); - }); - - test('Target style is empty with an other style', () => { - var style = {}; - style[propName + '2'] = propValue; - component.set('style', style); - expect(view.getTargetValue()).toBeFalsy(); - }); - - test('Fetch value from function', () => { - view.selectedComponent = component; - const val = `testfun(${propValue})`; - component.set('style', { [propName]: val }); - view.model.set('functionName', 'testfun'); - expect(view.getTargetValue()).toEqual(val); - }); - - describe('With target setted', () => { - beforeEach(() => { - target.model = component; - view = new PropertyView({ - model, - propTarget: target - }); - fixtures.innerHTML = ''; - view.render(); - fixtures.appendChild(view.el); - }); - - test('updateTargetStyle', () => { - view.updateTargetStyle(propValue); - var style = {}; - style[propName] = propValue; - expect(component.get('style')).toEqual(style); - }); - - test('updateTargetStyle with custom property', () => { - view.updateTargetStyle(propValue, propName + '2'); - var style = {}; - style[propName + '2'] = propValue; - expect(component.get('style')).toEqual(style); - }); - - test('Update value and input on target swap', () => { - var style = {}; - style[propName] = propValue; - component.set('style', style); - view.propTarget.trigger('update'); - expect(view.model.get('value')).toEqual(propValue); - expect(view.getInputValue()).toEqual(propValue); - }); - - test('Update value after multiple swaps', () => { - var style = {}; - style[propName] = propValue; - component.set('style', style); - view.propTarget.trigger('update'); - style[propName] = propValue + '2'; - component.set('style', style); - view.propTarget.trigger('update'); - expect(view.model.get('value')).toEqual(propValue + '2'); - expect(view.getInputValue()).toEqual(propValue + '2'); - }); + setTimeout(() => { + expect(view.getInputEl().value).toEqual(propValue); + done(); + }, 11); }); describe('Init property', () => { @@ -197,10 +82,10 @@ describe('PropertyView', () => { component = new Component(); model = new Property({ property: propName, - defaults: defValue + default: defValue, }); view = new PropertyView({ - model + model, }); fixtures.innerHTML = ''; view.render(); @@ -208,7 +93,7 @@ describe('PropertyView', () => { }); test('Value as default', () => { - expect(view.model.get('value')).toEqual(defValue); + expect(view.model.getValue()).toEqual(defValue); }); test('Placeholder as default', () => { @@ -217,7 +102,7 @@ describe('PropertyView', () => { }); test('Input value is set up to default', () => { - expect(view.getInputValue()).toEqual(defValue); + expect(view.getInputEl().value).toEqual(defValue); }); }); });