Add SectorView tests

src/style_manager/view/PropertiesView.js

@@ -8,8 +8,8 @@ define(['backbone','./PropertyView', './PropertyIntegerView', './PropertyRadioVi
 	return Backbone.View.extend({
 
 		initialize: function(o) {
-			this.config 		= o.config;
+			this.config 		= o.config || {};
-			this.pfx 			= this.config.stylePrefix;
+			this.pfx 			= this.config.stylePrefix || '';
 			this.target			= o.target || {};
 			this.propTarget = o.propTarget || {};
 			this.onChange		= o.onChange || {};

src/style_manager/view/SectorView.js

@@ -10,8 +10,8 @@ define(['backbone', './PropertiesView', 'text!./../templates/sector.html'],
 		events:{},
 
 		initialize: function(o) {
-			this.config 	= o.config;
+			this.config 	= o.config || {};
-			this.pfx 			= this.config.stylePrefix;
+			this.pfx 			= this.config.stylePrefix || '';
 			this.target		= o.target || {};
 			this.propTarget = o.propTarget || {};
 			this.open 		= this.model.get('open');

test/specs/style_manager/main.js

@@ -3,10 +3,12 @@ var modulePath = './../../../test/specs/style_manager';
 define([
         'StyleManager',
         modulePath + '/model/Models',
+        modulePath + '/view/SectorView',
          ],
   function(
           StyleManager,
-          Models
+          Models,
+          SectorView
           ) {
 
     describe('StyleManager', function() {
@@ -173,6 +175,7 @@ define([
         });
 
         Models.run();
+        SectorView.run();
 
       });
 

test/specs/style_manager/view/SectorView.js

@@ -0,0 +1,108 @@
+var path = 'StyleManager/view/';
+define([path + 'SectorView', 'StyleManager/model/Sector'],
+  function(SectorView, Sector) {
+
+    return {
+      run : function(){
+
+          describe('SectorView', function() {
+
+            var $fixtures;
+            var $fixture;
+            var model;
+            var view;
+
+            before(function () {
+              $fixtures  = $("#fixtures");
+              $fixture   = $('<div class="cssrule-fixture"></div>');
+            });
+
+            beforeEach(function () {
+              model = new Sector();
+              view = new SectorView({
+                model: model
+              });
+              $fixture.empty().appendTo($fixtures);
+              $fixture.html(view.render().el);
+            });
+
+            afterEach(function () {
+              view.remove();
+            });
+
+            after(function () {
+              $fixture.remove();
+            });
+
+            it('Rendered correctly', function() {
+              var sector = view.el;
+              sector.should.be.ok;
+              sector.querySelector('.title').should.be.ok;
+              var props = sector.querySelector('.properties');
+              props.should.be.ok;
+              sector.classList.contains('open').should.equal(true);
+              props.style.display.should.equal('block');
+            });
+
+            it('No properties', function() {
+              var props = view.el.querySelector('.properties');
+              props.innerHTML.should.equal('<div class="clear"></div>');
+            });
+
+            it('Update on open', function() {
+              var sector = view.el;
+              var props = sector.querySelector('.properties');
+              model.set('open', false);
+              sector.classList.contains('open').should.equal(false);
+              props.style.display.should.equal('none');
+            });
+
+            it('Toggle on click', function() {
+              var sector = view.el;
+              view.$el.find('.title').click();
+              sector.classList.contains('open').should.equal(false);
+            });
+
+            describe('Init with options', function() {
+              beforeEach(function () {
+                model = new Sector({
+                  open: false,
+                  name: 'TestName',
+                  properties: [
+                    {type:'integer'},
+                    {type:'integer'},
+                    {type:'integer'},
+                  ]
+                });
+                view = new SectorView({
+                  model: model
+                });
+                $fixture.empty().appendTo($fixtures);
+                $fixture.html(view.render().el);
+              });
+
+              afterEach(function () {
+                view.remove();
+              });
+
+              it('Rendered correctly', function() {
+                var sector = view.el;
+                var props = sector.querySelector('.properties');
+                sector.querySelector('.title').innerHTML.should.contain('TestName');
+                props.should.be.ok;
+                sector.classList.contains('open').should.equal(false);
+                props.style.display.should.equal('none');
+              });
+
+              it('Has properties', function() {
+                var props = view.el.querySelector('.properties');
+                props.children.length.should.equal(4); // Last one is 'clear' element
+              });
+
+            });
+
+        });
+      }
+    };
+
+});