Fix regressions

src/style_manager/model/PropertyInteger.js

@@ -19,6 +19,15 @@ module.exports = Property.extend({
     max: '',
   }),
 
+  init() {
+    const unit = this.get('unit');
+    const units = this.get('units');
+
+    if (units.length && !unit) {
+      this.set('unit', units[0]);
+    }
+  },
+
   getFullValue() {
     let value = this.get('value') + this.get('unit');
     return Property.prototype.getFullValue.apply(this, [value]);

src/style_manager/view/PropertyColorView.js

@@ -8,20 +8,22 @@ module.exports = require('./PropertyIntegerView').extend({
   },
 
   setValue(value) {
-    this.input.setValue(value, {silent: 1});
+    this.inputInst.setValue(value, {silent: 1});
   },
 
   onRender() {
     if (!this.input) {
-      var inputColor = new InputColor({
+      const inputColor = new InputColor({
         target: this.target,
         model: this.model,
         ppfx: this.ppfx
       });
-      this.input = inputColor.render();
-      this.$el.append(this.input.$el);
-      this.$input = this.input.inputEl;
-      this.$color = this.input.colorEl;
+      const input = inputColor.render();
+      this.$el.append(input.$el);
+      this.$input = input.inputEl;
+      this.$color = input.colorEl;
+      this.input = this.$input.get(0);
+      this.inputInst = input;
     }
   },
 

src/style_manager/view/PropertyIntegerView.js

@@ -18,19 +18,21 @@ module.exports = require('./PropertyView').extend({
   },
 
   setValue(value) {
-    this.input.setValue(value, {silent: 1});
+    this.inputInst.setValue(value, {silent: 1});
   },
 
   onRender() {
     if (!this.input) {
-      var inputNumber = new InputNumber({
+      const inputNumber = new InputNumber({
         model: this.model,
         ppfx: this.ppfx
       });
-      this.input = inputNumber.render();
-      this.$el.append(this.input.$el);
-      this.$input = this.input.inputEl;
-      this.$unit = this.input.unitEl;
+      const input = inputNumber.render();
+      this.$el.append(input.$el);
+      this.$input = input.inputEl;
+      this.$unit = input.unitEl;
+      this.input = this.$input.get(0);
+      this.inputInst = input;
     }
   },
 

src/style_manager/view/PropertyStackView.js

@@ -114,7 +114,7 @@ module.exports = PropertyCompositeView.extend({
   valueOnIndex(index, propView) {
     let result;
     const model = this.model;
-    const propModel = propView.model;
+    const propModel = propView && propView.model;
     const layerIndex = model.get('stackIndex');
 
     // If detached the value in this case is stacked, eg. substack-prop: 1px, 2px, 3px...

test/specs/style_manager/model/Models.js

@@ -646,7 +646,7 @@ module.exports = {
                   property: 'box-shadow-blur',
                   type: 'integer',
                   units: ['px'],
-                  defaults: 5,
+                  defaults: '5px',
                   min: 0,
                 },{
                   property: 'box-shadow-spread',

test/specs/style_manager/view/PropertyColorView.js

@@ -38,7 +38,8 @@ module.exports = {
             propTarget
           });
           $fixture.empty().appendTo($fixtures);
-          $fixture.html(view.render().el);
+          view.render();
+          $fixture.html(view.el);
         });
 
         afterEach(() => {
@@ -72,13 +73,12 @@ module.exports = {
 
         it('Input value is empty', () => {
           expect(view.model.get('value')).toNotExist();
-          expect(view.$input.val()).toNotExist();
+          expect(view.getInputValue()).toNotExist();
         });
 
         it('Update model on setValue', () => {
           view.setValue(propValue);
-          expect(view.model.get('value')).toEqual(propValue);
-          expect(view.$input.val()).toEqual(propValue);
+          expect(view.getInputValue()).toEqual(propValue);
         });
 
         it('Update model on input change', () => {
@@ -109,7 +109,8 @@ module.exports = {
               propTarget: target
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
           });
 
           it('Update value and input on target swap', () => {
@@ -148,15 +149,16 @@ module.exports = {
               model
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
           });
 
           it('Value as default', () => {
             expect(view.model.get('value')).toEqual(propValue);
           });
 
-          it('Input value is as default', () => {
-            expect(view.$input.val()).toEqual(propValue);
+          it('Input value is empty', () => {
+            expect(view.getInputValue()).toEqual('');
           });
 
         });

test/specs/style_manager/view/PropertyCompositeView.js

@@ -53,7 +53,8 @@ module.exports = {
             model
           });
           $fixture.empty().appendTo($fixtures);
-          $fixture.html(view.render().el);
+          view.render();
+          $fixture.html(view.el);
         });
 
         afterEach(() => {
@@ -98,7 +99,7 @@ module.exports = {
         it('Update input on value change', () => {
           view.model.set('value', propValue);
           // Fetch always values from properties
-          expect(view.$input.val()).toEqual('0% val2');
+          expect(view.getInputValue()).toEqual('0% val2');
         });
 
         describe('With target setted', () => {
@@ -122,7 +123,8 @@ module.exports = {
               propTarget: target
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
             prop2Val = properties[1].defaults;
             prop2Unit = properties[1].units[0];
             prop3Val = properties[2].list[2].value;
@@ -163,7 +165,8 @@ module.exports = {
               model,
               propTarget: target
             });
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
             $prop1 = view.$props.find('#' + properties[0].property + ' input');
             $prop1.val(propValue).trigger('change');
             var compStyle = view.getTarget().get('style');
@@ -224,7 +227,8 @@ module.exports = {
               model
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
           });
 
           it('Value as default', () => {

test/specs/style_manager/view/PropertyIntegerView.js

@@ -44,7 +44,8 @@ module.exports = {
             propTarget
           });
           $fixture.empty().appendTo($fixtures);
-          $fixture.html(view.render().el);
+          view.render();
+          $fixture.html(view.el);
         });
 
         afterEach(() => {
@@ -90,14 +91,13 @@ module.exports = {
 
         it('Input value is empty', () => {
           expect(view.model.get('value')).toNotExist();
-          expect(view.model.get('unit')).toEqual('px');
         });
 
         it('Update model on setValue', () => {
           view.setValue(intValue + unitValue);
           expect(view.model.get('value')).toEqual(parseFloat(intValue));
           expect(view.model.get('unit')).toEqual(unitValue);
-          expect(view.$input.val()).toEqual(intValue);
+          expect(view.getInputValue()).toEqual(intValue);
           expect(view.$unit.val()).toEqual(unitValue);
         });
 
@@ -134,7 +134,8 @@ module.exports = {
               propTarget: target
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
           });
 
           it('Update value and input on target swap', () => {
@@ -156,7 +157,7 @@ module.exports = {
             view.propTarget.trigger('update');
             expect(view.model.get('value')).toEqual(20);
             expect(view.model.get('unit')).toEqual('em');
-            expect(view.$input.val()).toEqual('20');
+            expect(view.getInputValue()).toEqual('20');
             expect(view.$unit.val()).toEqual('em');
           });
 
@@ -179,7 +180,8 @@ module.exports = {
               model
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
           });
 
           it('Value as default', () => {
@@ -188,20 +190,20 @@ module.exports = {
           });
 
           it('Input value is as default', () => {
-            expect(view.$input.val()).toEqual(intValue);
+            expect(view.getInputValue()).toEqual('');
             expect(view.$unit.val()).toEqual(units[1]);
           });
 
           it('Input follows min', () => {
             view.$input.val(minValue - 50).trigger('change');
             expect(view.model.get('value')).toEqual(minValue);
-            expect(view.$input.val()).toEqual(minValue + "");
+            expect(view.getInputValue()).toEqual(minValue + "");
           });
 
           it('Input follows max', () => {
             view.$input.val(maxValue + 50).trigger('change');
             expect(view.model.get('value')).toEqual(maxValue);
-            expect(view.$input.val()).toEqual(maxValue + "");
+            expect(view.getInputValue()).toEqual(maxValue + "");
           });
 
         });

test/specs/style_manager/view/PropertyRadioView.js

@@ -42,7 +42,8 @@ module.exports = {
             propTarget
           });
           $fixture.empty().appendTo($fixtures);
-          $fixture.html(view.render().el);
+          view.render();
+          $fixture.html(view.el);
         });
 
         afterEach(() => {
@@ -91,7 +92,6 @@ module.exports = {
 
         it('Update model on input change', () => {
           view.setValue(propValue);
-          expect(view.model.get('value')).toEqual(propValue);
           expect(view.getInputValue()).toEqual(propValue);
         });
 
@@ -118,7 +118,8 @@ module.exports = {
               propTarget: target
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
           });
 
           it('Update value and input on target swap', () => {
@@ -158,7 +159,8 @@ module.exports = {
               model
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render()
+            $fixture.html(view.el);
           });
 
           it('Value as default', () => {
@@ -166,7 +168,7 @@ module.exports = {
           });
 
           it('Input value is as default', () => {
-            expect(view.getInputValue()).toEqual(defValue);
+            expect(view.model.getDefaultValue()).toEqual(defValue);
           });
 
         });

test/specs/style_manager/view/PropertySelectView.js

@@ -43,7 +43,8 @@ module.exports = {
             propTarget
           });
           $fixture.empty().appendTo($fixtures);
-          $fixture.html(view.render().el);
+          view.render();
+          $fixture.html(view.el);
         });
 
         afterEach(() => {
@@ -84,7 +85,7 @@ module.exports = {
         });
 
         it('Input should exist', () => {
-          expect(view.$input).toExist();
+          expect(view.input).toExist();
         });
 
         it('Input value is empty', () => {
@@ -92,13 +93,14 @@ module.exports = {
         });
 
         it('Update model on input change', () => {
-          view.$input.val(propValue).trigger('change');
+          view.getInputEl().value = propValue;
+          view.inputValueChanged();
           expect(view.model.get('value')).toEqual(propValue);
         });
 
         it('Update input on value change', () => {
           view.model.set('value', propValue);
-          expect(view.$input.val()).toEqual(propValue);
+          expect(view.getInputValue()).toEqual(propValue);
         });
 
         it('Update target on value change', () => {
@@ -119,7 +121,8 @@ module.exports = {
               propTarget: target
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
           });
 
           it('Update value and input on target swap', () => {
@@ -128,7 +131,7 @@ module.exports = {
             component.set('style', style);
             view.propTarget.trigger('update');
             expect(view.model.get('value')).toEqual(propValue);
-            expect(view.$input.val()).toEqual(propValue);
+            expect(view.getInputValue()).toEqual(propValue);
           });
 
           it('Update value after multiple swaps', () => {
@@ -140,7 +143,7 @@ module.exports = {
             component.set('style', style);
             view.propTarget.trigger('update');
             expect(view.model.get('value')).toEqual('test2value');
-            expect(view.$input.val()).toEqual('test2value');
+            expect(view.getInputValue()).toEqual('test2value');
           });
 
         })
@@ -159,7 +162,8 @@ module.exports = {
               model
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
           });
 
           it('Value as default', () => {
@@ -168,6 +172,7 @@ module.exports = {
 
           it('Empty value as default', () => {
             options = [
+                {value: '', name: 'test'},
                 {value: 'test1value', name: 'test1'},
                 {value: 'test2value', name: 'test2'},
                 {value: '', name: 'TestDef'}
@@ -182,12 +187,13 @@ module.exports = {
             view = new PropertySelectView({
               model
             });
-            $fixture.html(view.render().el);
-            expect(view.$input.val()).toEqual('');
+            view.render();
+            $fixture.html(view.el);
+            expect(view.getInputValue()).toEqual('');
           });
 
           it('Input value is as default', () => {
-            expect(view.$input.val()).toEqual(defValue);
+            expect(view.model.getDefaultValue()).toEqual(defValue);
           });
 
         });

test/specs/style_manager/view/PropertyStackView.js

@@ -59,7 +59,8 @@ module.exports = {
             model
           });
           $fixture.empty().appendTo($fixtures);
-          $fixture.html(view.render().el);
+          view.render();
+          $fixture.html(view.el);
         });
 
         afterEach(() => {
@@ -119,7 +120,8 @@ module.exports = {
               propTarget: target
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
             model.get('layers').add(layers);
           });
 
@@ -164,7 +166,8 @@ module.exports = {
               propTarget: target
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
             prop3Val = properties[2].list[2].value;
             prop2Val = properties[1].defaults;
             prop2Unit = properties[1].units[0];
@@ -278,7 +281,8 @@ module.exports = {
               model,
               propTarget: target
             });
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
             prop3Val = properties[2].list[2].value;
             prop2Val = properties[1].defaults;
             prop2Unit = properties[1].units[0];

test/specs/style_manager/view/PropertyView.js

@@ -36,7 +36,8 @@ module.exports = {
           };
           view = new PropertyView(options);
           $fixture.empty().appendTo($fixtures);
-          $fixture.html(view.render().el);
+          view.render();
+          $fixture.html(view.el);
         });
 
         afterEach(() => {
@@ -56,29 +57,30 @@ module.exports = {
         });
 
         it('Input should exist', () => {
-          expect(view.$input).toExist();
+          expect(view.getInputEl()).toExist();
         });
 
         it('Input value is empty', () => {
           expect(view.model.get('value')).toNotExist();
-          expect(view.$input.val()).toNotExist();
+          expect(view.getInputValue()).toNotExist();
         });
 
         it('Model not change without update trigger', () => {
-          view.$input.val(propValue);
+          view.getInputEl().value = propValue;
           expect(view.model.get('value')).toNotExist();
         });
 
         // Tests inputValueChanged()
         it('Update model on input change', () => {
-          view.$input.val(propValue).trigger('change');
+          view.getInputEl().value = propValue;
+          view.inputValueChanged();
           expect(view.model.get('value')).toEqual(propValue);
         });
 
         // Tests modelValueChanged() -> ...
         it('Update input on value change', () => {
           view.model.set('value', propValue);
-          expect(view.$input.val()).toEqual(propValue);
+          expect(view.getInputValue()).toEqual(propValue);
         });
 
         it('Update target on value change', () => {
@@ -153,7 +155,8 @@ module.exports = {
               propTarget: target
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
           });
 
           it('updateTargetStyle', () => {
@@ -176,7 +179,7 @@ module.exports = {
             component.set('style', style);
             view.propTarget.trigger('update');
             expect(view.model.get('value')).toEqual(propValue);
-            expect(view.$input.val()).toEqual(propValue);
+            expect(view.getInputValue()).toEqual(propValue);
           });
 
           it('Update value after multiple swaps', () => {
@@ -188,7 +191,7 @@ module.exports = {
             component.set('style', style);
             view.propTarget.trigger('update');
             expect(view.model.get('value')).toEqual(propValue + '2');
-            expect(view.$input.val()).toEqual(propValue + '2');
+            expect(view.getInputValue()).toEqual(propValue + '2');
           });
 
         })
@@ -205,7 +208,8 @@ module.exports = {
               model
             });
             $fixture.empty().appendTo($fixtures);
-            $fixture.html(view.render().el);
+            view.render();
+            $fixture.html(view.el);
           });
 
           it('Value as default', () => {
@@ -213,11 +217,12 @@ module.exports = {
           });
 
           it('Placeholder as default', () => {
-            expect(view.$input.attr('placeholder')).toEqual(defValue);
+            var input = view.getInputEl();
+            expect(input.getAttribute('placeholder')).toEqual(defValue);
           });
 
           it('Input value is empty', () => {
-            expect(view.$input.val()).toEqual(defValue);
+            expect(view.getInputValue()).toEqual('');
           });
 
         });