From c211bff647e69eadc85919705132bcfce429c35e Mon Sep 17 00:00:00 2001 From: Amjad Masad Date: Thu, 14 Jun 2012 21:14:06 -0400 Subject: [PATCH] Make package with dev deps. Create test page that runs Backbone tets + own tests. --- .gitignore | 1 + backbone.declarative.js | 17 ++--- package.json | 18 +++++ test/test.html | 38 +++++++++++ test/test.js | 148 ++++++++++++++++++++++++++++++++++++++++ 5 files changed, 214 insertions(+), 8 deletions(-) create mode 100644 .gitignore create mode 100644 package.json create mode 100644 test/test.html create mode 100644 test/test.js diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..3c3629e --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +node_modules diff --git a/backbone.declarative.js b/backbone.declarative.js index 317c391..7013d82 100644 --- a/backbone.declarative.js +++ b/backbone.declarative.js @@ -30,6 +30,7 @@ constructor: function () { _View.apply(this, Array.prototype.slice.call(arguments)); this.bindModelEvents(); + this.bindCollectionEvents(); } , _bindDeclarativeEvents: function (prop, events) { @@ -52,23 +53,23 @@ , bindModelEvents: function (modelEvents) { if (!(modelEvents || (modelEvents = getValue(this, 'modelEvents')))) return; - if (!this.model) throw new Erorr('View model does not exist'); - this.unBindModelEvents(); - this.bindDeclarativeEvents('model', modelEvents); + if (!this.model) throw new Error('View model does not exist'); + this.unbindModelEvents(); + this._bindDeclarativeEvents('model', modelEvents); } - , unBindModelEvents: function () { + , unbindModelEvents: function () { this._unbindDeclarativeEvents('model') } , bindCollectionEvents: function (collectionEvents) { if (!(collectionEvents || (collectionEvents = getValue(this, 'collectionEvents')))) return; - if (!this.collection) throw new Erorr('View collection does not exist'); - this.unBindCollectionEvents(); - this.bindDeclerativeEvents('collection', collectionEvents); + if (!this.collection) throw new Error('View collection does not exist'); + this.unbindCollectionEvents(); + this._bindDeclarativeEvents('collection', collectionEvents); } - , unBindCollectionEvents: function () { + , unbindCollectionEvents: function () { this._unbindDeclarativeEvents('collection'); } }); diff --git a/package.json b/package.json new file mode 100644 index 0000000..0d5ee14 --- /dev/null +++ b/package.json @@ -0,0 +1,18 @@ +{ + "author": "Amjad Masad (http://amasad.me)", + "name": "backbone.declarative", + "description": "Adds declarative model and collection binding for Backbone Views", + "version": "0.0.0", + "repository": { + "type": "git", + "url": "git://github.com/Codecademy/backbone.declarative.git" + }, + "engines": { + "node": "~0.6.2" + }, + "dependencies": { + "underscore": "latest", + "backbone": "0.9.2" + }, + "devDependencies": {} +} diff --git a/test/test.html b/test/test.html new file mode 100644 index 0000000..7979f97 --- /dev/null +++ b/test/test.html @@ -0,0 +1,38 @@ + + + + Backbone Test Suite + + + + + + + + + + + + + + +

Backbone Test Suite

+
+

+

+
    +

    +

    Backbone Speed Suite

    +
    + + diff --git a/test/test.js b/test/test.js new file mode 100644 index 0000000..e9fbf88 --- /dev/null +++ b/test/test.js @@ -0,0 +1,148 @@ +$(function () { + + var model, collection, view; + module('Backbone.declarative', { + setup: function () { + model = new Backbone.Model({ + foo: '' + }); + + collection = new Backbone.Collection({ + model: Backbone.Model + }); + collection.add(model); + + view = new Backbone.View({ + model: model + , collection: collection + }); + } + }); + + test('View: bindModelEvents', function () { + var count = 0; + view.bindModelEvents({ + 'change:foo': function (m, v, changed) { + equal(this, view); + equal(m, model); + equal(v, 'bar'); + deepEqual(changed, {changes: {foo: true}}); + count++; + } + , 'change': function () { + count++; + } + , 'fooEvent': function () { + count++; + } + }); + + model.set('foo', 'bar'); + model.trigger('fooEvent'); + equal(count, 3); + }); + + test('View: unbindModelEvents', function () { + var count = 0; + view.bindModelEvents({ + 'fooEvent': function () { + count++; + } + }) + model.trigger('fooEvent') + + view.unbindModelEvents(); + model.trigger('fooEvent'); + + equal(count, 1); + }); + + test('View: bindCollectionEvents', function () { + var count = 0; + view.bindCollectionEvents({ + 'change:foo': function (m, v, changed) { + equal(this, view); + equal(m, model); + equal(v, 'bar'); + deepEqual(changed, {changes: {foo: true}}); + count++; + } + , 'change': function () { + count++; + } + , 'fooEvent': function () { + count++; + } + }); + + model.set('foo', 'bar'); + model.trigger('fooEvent'); + collection.trigger('fooEvent'); + equal(count, 4); + }); + + test('View: unbindModelEvents', function () { + var count = 0; + view.bindCollectionEvents({ + 'fooEvent': function () { + count++; + } + }) + collection.trigger('fooEvent') + + view.unbindCollectionEvents(); + model.trigger('fooEvent'); + + equal(count, 1); + }); + + test('Use in declarative format', function () { + var ThrowerView = Backbone.View.extend({ + collectionEvents: { + 'change:foo': 'onFooChange' + } + , modelEvents: { + 'change:foo': 'onFooChange' + } + }); + + raises(function () { + new ThrowerView(); + }); + + raises(function () { + new ThrowerView({ + model: model + }); + }); + + raises(function () { + new ThrowerView({ + model: model + , collection: collection + }) + }); + + var count = 0; + var SomeView = Backbone.View.extend({ + collectionEvents: { + 'change:foo': 'onFooChange' + } + , modelEvents: { + 'change:foo': 'onFooChange' + } + + , onFooChange: function () { + count++; + } + }); + + new SomeView({ + model: model + , collection: collection + }) + model.set('foo', 'bar'); + equal(count, 2); + }); + +});