Q:

Backbone JS / Jasmine / Sinon : test if model has changed after event

How can I test if a backbone view has triggered an event and then a model has been changed?

A:

If your view is generating the el itself, you can cause it to trigger an event easily, through the view's $el.

describe("my test", function(){

  var MyModel = Backbone.Model.extend({});

  var MyView = Backbone.View.extend({
    events: {
      "click a": "aClicked"
    },

    aClicked: function(e){
      e.preventDefault();
      this.model.set({foo: "bar"});
    },

    render: function(){
      this.$el.html("<a href='#foo' id='fooLink'>foo</a>");
    }
  });

  var myModel;

  beforeEach(function(){
    myModel = new MyModel();
    var myView = new MyView({
      model: myModel
    });

    myView.render();

    // this will "click" the link
    myView.$("#fooLink").trigger("click");
  })

  it("should do that stuff", function(){
    expect(myModel.get("foo")).toBe("bar");
  });

});

