Add tests

.gitignore

@@ -10,5 +10,6 @@ grapes.sublime-workspace
 img/
 private/
 vendor/
+coverage/
 node_modules/
 bower_components/

src/class_manager/view/ClassTagsView.js

@@ -7,13 +7,11 @@ define(['backbone', 'text!./../template/classTags.html', './ClassTagView'],
 
     template: _.template(tagsTemplate),
 
-    events:{
+    events: {},
-      'click .add': 'startNewClass',
-    },
 
     initialize: function(o) {
       this.config = o.config || {};
-      this.pfx = this.config.stylePrefix;
+      this.pfx = this.config.stylePrefix || '';
       this.className = this.pfx + 'tags';
       this.addBtnId = this.pfx + 'add-tag';
       this.newInputId = this.pfx + 'new';
@@ -59,16 +57,6 @@ define(['backbone', 'text!./../template/classTags.html', './ClassTagView'],
       this.$input.hide().val('');
     },
 
-
-    /**
-     * Add new class tag
-     * @param {Object} model
-     *
-     */
-    addTag: function(model){
-
-    },
-
     /**
      * Triggered when component is changed
      * @param  {Object} e

test/specs/class_manager/main.js

@@ -4,12 +4,14 @@ define([
 				'ClassManager',
 				modulePath + '/model/ClassModels',
 				modulePath + '/view/ClassTagView',
+				modulePath + '/view/ClassTagsView',
 				modulePath + '/e2e/ClassManager'
 				 ],
 	function(
 					ClassManager,
 					Models,
 					ClassTagView,
+					ClassTagsView,
 					e2e
 					) {
 
@@ -84,6 +86,7 @@ define([
 
 			Models.run();
 			ClassTagView.run();
+			ClassTagsView.run();
 			e2e.run();
 
 		});

test/specs/class_manager/view/ClassTagsView.js

@@ -0,0 +1,68 @@
+var path = 'ClassManager/view/';
+define([path + 'ClassTagsView', 'ClassManager/model/ClassTags'],
+  function(ClassTagsView, ClassTags) {
+
+    return {
+      run : function(){
+          describe('ClassTagsView', function() {
+
+            before(function () {
+              this.$fixtures  = $("#fixtures");
+              this.$fixture   = $('<div class="classtag-fixture"></div>');
+            });
+
+            beforeEach(function () {
+              var target = {};
+              this.coll  = new ClassTags();
+              _.extend(target, Backbone.Events);
+
+              this.view = new ClassTagsView({
+                config : { target: target },
+                collection: this.coll
+              });
+
+              this.$fixture.empty().appendTo(this.$fixtures);
+              this.$fixture.html(this.view.render().el);
+              this.btnAdd = this.view.$el.find('#' + this.view.addBtnId);
+              this.input = this.view.$el.find('input#' + this.view.newInputId);
+            });
+
+            afterEach(function () {
+              delete this.view.collection;
+            });
+
+            after(function () {
+              this.$fixture.remove();
+            });
+
+            it('Object exists', function() {
+              ClassTagsView.should.be.exist;
+            });
+
+            it('Add new tag triggers correct method', function() {
+              sinon.stub(this.view, "addToClasses");
+              this.coll.add({ name: 'test' });
+              this.view.addToClasses.calledOnce.should.equal(true);
+            });
+
+            it('Start new tag creation', function() {
+              this.btnAdd.click();
+              (this.btnAdd.css('display') == 'none').should.equal(true);
+              (this.input.css('display') !== 'none').should.equal(true);
+            });
+
+            it('Stop tag creation', function() {
+              this.btnAdd.click();
+              this.input.val('test')
+              this.input.blur();
+              (this.btnAdd.css('display') !== 'none').should.equal(true);
+              (this.input.css('display') == 'none').should.equal(true);
+              this.input.val().should.equal('');
+            });
+
+            //this.$el.find('#' + this.addBtnId);
+        });
+      }
+    };
+
+});