How to do integration test with router service?

Testing
1

My component has a button that will navigate to different page when clicked. When i do integration test, I want to make sure the page it navigates, however I get

Cannot read property 'transitionTo' of undefined.

Here is a snippet of my component:

  actions:{
    go(){
      this.get('router').transitionTo(this.get("route"), this.get('inputValue');
    }
  }

Probably because I don’t have the router service in my integration test. Should I stub it or what? I heard people say integration test should not mess with route but acceptance test can. Should I do this in acceptance test?

2

At first glance I was thinking this seems like more of an acceptance test use case to me, but the line is pretty blurry and stubbing the service is probably also well within reason. I mean there’s even a docs section about it. In fact I’d probably start with stubbing the service approach, especially since your use case seems pretty straightforward. You can view the router service as a “black box” per se, so as long as you can stub the functionality without actually making a transition/route change (there are no routes in an integration test per se) I think it’s totally acceptable.

1 Like
3

I injected the service by the following:

const routerStub = Ember.Service.extend({
  transitionTo() {
    return true;
  },
});

moduleForComponent('date-navigation-bar', 'Integration | Component | date navigation bar', {
  integration: true,
  beforeEach(){
    this.register('service:router', routerStub);
    this.inject.service('router');
  }
});

But I was still having Cannot read property 'transitionTo' of undefined. error, until I added

router: Ember.inject.service(),

to my component file. This is definitely a bug in Ember.