tsai
/
grapesjs
mirror of https://github.com/artf/grapesjs.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Add PropertyIntegerView tests

pull/36/head
Artur Arseniev 10 years ago
parent
983401800c
commit
d8520c318f
3 changed files with 192 additions and 7 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 12
      src/style_manager/view/PropertyIntegerView.js
  2. 5
      test/specs/style_manager/main.js
  3. 182
      test/specs/style_manager/view/PropertyIntegerView.js

12
src/style_manager/view/PropertyIntegerView.js
View File

@ -14,9 +14,9 @@ define(['backbone','./PropertyView', 'text!./../templates/propertyInteger.html']
this.max = this.model.get('max') || this.model.get('max')===0 ? this.model.get('max') : 5000;
this.units = this.model.get('units');
this.unit = this.model.get('unit') ? this.model.get('unit') : (this.units.length ? this.units[0] : '');
this.events['click .'+this.pfx+'u-arrow'] = 'upArrowClick';
this.events['click .'+this.pfx+'d-arrow'] = 'downArrowClick';
this.events['mousedown .'+this.pfx+'int-arrows'] = 'downIncrement';
this.events['click .'+this.pfx+'u-arrow'] = 'upArrowClick';
this.events['click .'+this.pfx+'d-arrow'] = 'downArrowClick';
this.events['mousedown .'+this.pfx+'int-arrows'] = 'downIncrement';
this.listenTo( this.model ,'change:unit', this.valueChanged);
this.delegateEvents();
},
@ -111,8 +111,8 @@ define(['backbone','./PropertyView', 'text!./../templates/propertyInteger.html']
if(this.units && this.units.length){
this.unitS = '<select class="' + pfx + 'unit">';
_.each(this.units,function(unit){
var selected = unit == this.selectedUnit ? 'selected': '';
this.unitS += '<option '+selected+' >'+unit+'</option>';
var selected = unit == this.selectedUnit ? 'selected': '';
this.unitS += '<option ' + selected + ' >' + unit + '</option>';
},this);
this.unitS += '</select>';
this.$unit = $(this.unitS);
@ -145,7 +145,7 @@ define(['backbone','./PropertyView', 'text!./../templates/propertyInteger.html']
if(this.$unit)
this.$unit.val(u);
this.model.set({value: v, unit: u,},{silent: true});
this.model.set({value: v, unit: u,}, {silent: true});
},
});

5
test/specs/style_manager/main.js
View File

@ -8,6 +8,7 @@ define([
modulePath + '/view/PropertyView',
modulePath + '/view/PropertySelectView',
modulePath + '/view/PropertyRadioView',
modulePath + '/view/PropertyIntegerView',
],
function(
StyleManager,
@ -16,7 +17,8 @@ define([
SectorsView,
PropertyView,
PropertySelectView,
PropertyRadioView
PropertyRadioView,
PropertyIntegerView
) {
describe('StyleManager', function() {
@ -188,6 +190,7 @@ define([
PropertyView.run();
PropertySelectView.run();
PropertyRadioView.run();
PropertyIntegerView.run();
});

182
test/specs/style_manager/view/PropertyIntegerView.js
View File

@ -0,0 +1,182 @@
var path = 'StyleManager/view/';
define([path + 'PropertyIntegerView', 'StyleManager/model/Property', 'DomComponents/model/Component'],
function(PropertyIntegerView, Property, Component) {
return {
run : function(){
describe('PropertyIntegerView', function() {
var component;
var $fixtures;
var $fixture;
var target;
var model;
var view;
var propName = 'testprop';
var intValue = '55';
var unitValue = 'px';
var propValue = intValue + unitValue;
var defValue = 'test2value';
var units = ['px', '%', 'em'];
before(function () {
$fixtures = $("#fixtures");
$fixture = $('<div class="sm-fixture"></div>');
});
beforeEach(function () {
target = new Component();
component = new Component();
model = new Property({
type: 'integer',
units: units,
property: propName
});
view = new PropertyIntegerView({
model: model
});
$fixture.empty().appendTo($fixtures);
$fixture.html(view.render().el);
});
afterEach(function () {
//view.remove(); // strange errors ???
});
after(function () {
$fixture.remove();
delete component;
delete view;
delete model;
});
it('Rendered correctly', function() {
var prop = view.el;
$fixture.get(0).querySelector('.property').should.be.ok;
prop.querySelector('.label').should.be.ok;
prop.querySelector('.field').should.be.ok;
});
it('Inputs rendered', function() {
var prop = view.el;
prop.querySelector('input[type=text]').should.be.ok;
prop.querySelector('select.unit').should.be.ok;
});
it('Units rendered', function() {
var select = view.el.querySelector('select.unit');
select.children.length.should.equal(units.length);
});
it('Units rendered correctly', function() {
var children = view.el.querySelector('select.unit').children;
children[0].textContent.should.equal(units[0]);
children[1].textContent.should.equal(units[1]);
children[2].textContent.should.equal(units[2]);
});
it('Inputs should exist', function() {
view.$input.should.be.ok;
view.$unit.should.be.ok;
});
it('Input value is empty', function() {
view.model.get('value').should.be.empty;
view.model.get('unit').should.equal('px');
});
it('Update model on input change', function() {
view.setValue(intValue + unitValue);
view.model.get('value').should.equal(parseFloat(intValue));
view.model.get('unit').should.equal(unitValue);
view.$input.val().should.equal(intValue);
view.$unit.val().should.equal(unitValue);
});
it('Update input on value change', function() {
view.model.set('value', intValue);
view.getInputValue().should.equal(intValue);
});
it('Update target on value change', function() {
view.selectedComponent = component;
view.model.set('value', propValue);
var compStyle = view.selectedComponent.get('style');
var assertStyle = {};
assertStyle[propName] = propValue;
compStyle.should.deep.equal(assertStyle);
});
describe('With target setted', function() {
beforeEach(function () {
target.model = component;
view = new PropertyIntegerView({
model: model,
propTarget: target
});
$fixture.empty().appendTo($fixtures);
$fixture.html(view.render().el);
});
it('Update value and input on target swap', function() {
var style = {};
style[propName] = propValue;
component.set('style', style);
view.propTarget.trigger('update');
view.model.get('value').should.equal(parseFloat(intValue));
view.getInputValue().should.equal(intValue);
});
it('Update value after multiple swaps', function() {
var style = {};
style[propName] = propValue;
component.set('style', style);
view.propTarget.trigger('update');
style[propName] = '20em';
component.set('style', style);
view.propTarget.trigger('update');
view.model.get('value').should.equal(20);
view.model.get('unit').should.equal('em');
view.$input.val().should.equal('20');
view.$unit.val().should.equal('em');
});
})
describe('Init property', function() {
beforeEach(function () {
component = new Component();
model = new Property({
type: 'integer',
units: units,
property: propName,
defaults: intValue,
unit: units[1],
});
view = new PropertyIntegerView({
model: model
});
$fixture.empty().appendTo($fixtures);
$fixture.html(view.render().el);
});
it('Value as default', function() {
view.model.get('value').should.equal(intValue);
view.model.get('unit').should.equal(units[1]);
});
it('Input value is as default', function() {
view.$input.val().should.equal(intValue);
view.$unit.val().should.equal(units[1]);
});
});
});
}
};
});
Write Preview
Loading…
Cancel
Save