Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
Test event binding / unbinding with Jasmine
App.ItemPresenter = (function() {
var ItemPresenter = function($element, options) {
var self = this;
this.$element = $element;
this.bus = options.bus;
this.model = options.model;
this.clasName = "item";
this.listen = function() {
this.bus.on("list:view:unload", self.unload);
};
this.unlisten = function() {
this.bus.off("list:view:unload", self.unload);
};
this.domListen = function(element) {
(element || this.$element).on("click", ".close", null, self.unload);
}
this.domUnlisten = function(element) {
(element || this.$element).off("click", ".close")
}
this.render = function() {
var $oldElement = this.$element;
this.hydrate();
this.domUnlisten($oldElement);
$oldElement.replaceWith(this.$element);
this.domListen(this.$element);
};
this.hydrate = function() {
this.$element = $(
$.render(this.template, { name: this.model.name })
).addClass(this.className);
};
this.remove = function() {
this.$element.remove();
};
this.$close = function() {
return $(".close", this.$element);
}
this.template = '<li>{name} <a href="#" class="close">x</a></li>';
this.load = function() {
self.render.call(self);
self.listen.call(self);
};
this.unload = function(e) {
if (e) { e.preventDefault(); };
self.unlisten.call(self);
self.domUnlisten.call(self);
self.remove.call(self);
};
};
return ItemPresenter;
})();
describe("item presenter", function() {
var bus;
var model;
var $element;
var presenter;
beforeEach(function() {
$page = $("<ul><li></li></ul>");
bus = $.observable({});
model = { name: "Item 1" };
$element = $("li", $page);
presenter = new App.ItemPresenter($element, {
bus: bus,
model: model
});
});
describe("#listen", function() {
it("binds to list:view:unload on the bus", function() {
var timesTriggered = 0;
presenter.unload = function() { timesTriggered += 1; }
bus.trigger("list:view:unload");
expect(timesTriggered).toBe(0);
presenter.listen();
bus.trigger("list:view:unload");
expect(timesTriggered).toBe(1);
});
});
describe("#domListen", function() {
it("binds to click on .close", function() {
var timesTriggered = 0;
presenter.unload = function() { timesTriggered = 1; };
presenter.render();
presenter.listen();
presenter.$close().trigger('click');
expect(timesTriggered).toBe(1);
});
});
describe("#unlisten", function() {
it("unbinds from list:view:unload on the bus", function() {
var timesTriggered = 0;
presenter.unload = function() { timesTriggered += 1; };
presenter.listen();
bus.trigger("list:view:unload");
expect(timesTriggered).toBe(1);
timesTriggered = 0;
presenter.unlisten();
bus.trigger("list:view:unload");
expect(timesTriggered).toBe(0);
});
});
describe("#domUnlisten", function() {
it("unbinds from click on .close", function() {
var timesTriggered = 0;
presenter.unload = function() { timesTriggered += 1; };
presenter.render();
presenter.$close().trigger('click');
expect(timesTriggered).toBe(1);
timesTriggered = 0;
presenter.domUnlisten();
presenter.$close().trigger('click');
expect(timesTriggered).toBe(0);
});
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment