Add PanelsView tests

src/panels/view/PanelsView.js

@@ -7,12 +7,12 @@ define(['backbone','./PanelView'],
 	return Backbone.View.extend({
 
 		initialize: function(o) {
-			this.opt 		= o;
-			this.config		= o.config;
-			this.pfx		= o.config.stylePrefix;
+			this.opt = o || {};
+			this.config = this.opt.config || {};
+			this.pfx = this.config.stylePrefix || '';
 			this.listenTo( this.collection, 'add', this.addTo );
 			this.listenTo( this.collection, 'reset', this.render );
-			this.className 	= this.pfx + 'panels';
+			this.className = this.pfx + 'panels';
 		},
 
 		/**
@@ -36,14 +36,14 @@ define(['backbone','./PanelView'],
 		 * @private
 		 * */
 		addToCollection: function(model, fragmentEl){
-			var fragment	= fragmentEl || null;
-			var viewObject	= PanelView;
+			var fragment = fragmentEl || null;
+			var viewObject = PanelView;
 
-			var view 		= new viewObject({
-				model 	: model,
-				config	: this.config,
+			var view = new viewObject({
+				model: model,
+				config: this.config,
 			});
-			var rendered	= view.render().el;
+			var rendered = view.render().el;
 
 			if(fragment){
 				fragment.appendChild(rendered);

test/specs/panels/main.js

@@ -3,12 +3,14 @@ var modulePath = './../../../test/specs/panels';
 define([
 				'Panels',
 				modulePath + '/model/PanelModels',
-				modulePath + '/view/PanelView'
+				modulePath + '/view/PanelView',
+				modulePath + '/view/PanelsView'
 				 ],
 	function(
 					Panels,
 					Models,
-					PanelView
+					PanelView,
+					PanelsView
 					) {
 
 		describe('Panels', function() {
@@ -102,6 +104,7 @@ define([
 
 			Models.run();
 			PanelView.run();
+			PanelsView.run();
 
 		});
 });

test/specs/panels/view/PanelsView.js

@@ -0,0 +1,55 @@
+var path = 'Panels/view/';
+define([path + 'PanelsView', 'Panels/model/Panels'],
+  function(PanelsView, Panels) {
+
+    return {
+      run : function(){
+          describe('PanelsView', function() {
+
+            var $fixtures;
+            var $fixture;
+            var model;
+            var view;
+
+            before(function () {
+              $fixtures  = $("#fixtures");
+              $fixture   = $('<div class="cssrules-fixture"></div>');
+            });
+
+            beforeEach(function () {
+              model = new Panels([]);
+              view = new PanelsView({
+                collection: model
+              });
+              $fixture.empty().appendTo($fixtures);
+              $fixture.html(view.render().el);
+            });
+
+            afterEach(function () {
+              view.collection.reset();
+            });
+
+            after(function () {
+              $fixture.remove();
+            });
+
+            it("Collection is empty", function (){
+              view.$el.html().should.be.empty;
+            });
+
+            it("Add new panel", function (){
+              sinon.stub(view, "addToCollection");
+              view.collection.add({});
+              view.addToCollection.calledOnce.should.equal(true);
+            });
+
+            it("Render new panel", function (){
+              view.collection.add({});
+              view.$el.html().should.not.be.empty;
+            });
+
+        });
+      }
+    };
+
+});