Diego Castillo
Diego Castillo

Reputation: 175

How To Test route.navigate on Backbone View

I'm currently developing a Backbone.js application which uses the Mocha, Chai, and Sinon libraries for testing. I'm struggling to code the following test: When a user clicks a button it should redirect the user to home.

Here's how the view looks like:

events: {
    'click #navigate-home': 'goHome'
},

initialize: function(options) {
    this.router = options.router;
},

goHome: function(event) {
  event.preventDefault();
  this.router.navigate('home', { trigger: true });
}

And here's the test:

beforeEach(function() {
  this.router = new Backbone.Router();
  this.myView = new MyView({
    router: this.router
  });
  this.myView.render();
});

afterEach(function() {
  this.router = null;
  this.myView = null;
});

it('redirects to home', sinon.test(function() {
  var spy = sinon.spy();
  this.router.on({
    'home': spy
  });
  this.myView.$el.find('#navigate-home').trigger('click');
  expect(spy.called).to.be.true;
}));

The code works as expected on the browser, but I can't get the test to pass. I would highly appreciate any help.

Upvotes: 1

Views: 522

Answers (1)

Sachin Jain
Sachin Jain

Reputation: 21842

Based on my limited experience with Backbone and Unit Testing, I consider this kind of test as an invalid test case.

What you are trying to test in not actually your code but you are trying to add a test case for Backbone library. Similar test cases should actually be part of your Automation (Read about Selenium).

I think the correct way to write a Unit Test in your case would be:

it('should redirect to home', sinon.test(function() {
  var spy = sinon.spy();
  this.router.on({
    'home': spy
  });

  // This is the difference
  this.myView.goHome({preventDefault: function() { } });

  expect(spy.called).to.be.true;
});

Upvotes: 1

Related Questions