mercredi 12 avril 2017

Ember component test -- how unit test component's action when it doesn't invoke an external action?

I'm somewhat new to Ember and trying to test a pager component. Simplified component looks like this:

export default Ember.Component.extend({
    index: 0,
    actions: {
        next() {
            this.incrementProperty('index');
        }
    }
});

I'm trying to test that the next() action does indeed increment the index property as expected. I wrote a unit test like this:

test('next should increment the index by 1', function (assert) {
  const component = this.subject();

  assert.equal(component.get('index'), 0, 'Index should be 0');

  component.get('actions').next();
  assert.equal(component.get('index'), 1, 'index should be 1');
});

But it fails with the error "this.incrementProperty is not a function". Debugging, the "this" in the test, when inside the next() function, isn't the context of the component -- it is an object with next() as its only property.

I'm wondering if this is because of how I'm invoking the nextPlace action in the test. I know I could write an integration test that clicks the button that fires this action and compares some UI to make sure it changed, but that seems very convoluted when all I'm trying to test is that the function itself performs as expected. If it were an action passed to this component (closure action) I know I could set up a dummy function in the integration test, pass that to the component, and see how it responds. But this action doesn't call an action passed down to it.

I realize the function I'm testing is really basic, but partly this is to understand how to test actions in components that don't call an external (to the component) action.




Aucun commentaire:

Enregistrer un commentaire