Testing Controllers
Container testing methods and computed properties follow previous patterns shown in Testing Basics because Ember.Controller extends Ember.Object.
Controllers can be tested using the setupTest
helper which is part of the ember-qunit framework. The tests written for instances like Ember.Controller
are also described as container tests.
Testing Controller Actions
Here we have a controller PostsController
with two properties, a method that sets one of those properties, and an action named setProps
.
You can follow along by generating your own controller with
ember generate controller posts
.
import Controller from '@ember/controller';
import { action } from '@ember/object';
export default class PostsController extends Controller {
propA = 'You need to write tests';
propB = 'And write one for me too';
setPropB(str) {
this.propB = str;
}
@action
setProps(str) {
this.propA = 'Testing is cool';
this.setPropB(str);
}
}
The setProps
action directly sets one property, and calls the method to set the other. In our generated test file, Ember CLI already uses the module
and the setupTest
helpers to set up a test container:
import { module, test } from 'qunit';
import { setupTest } from 'ember-qunit';
module('Unit | Controller | posts', function(hooks) {
setupTest(hooks);
});
Next we use the owner API to gain access to the controller we'd like to test. Using the this.owner.lookup
method we get the instance of the PostsController
and can check the action in our test. The this.owner.lookup
helper returns objects generated by the framework in your applications and is also exposed in tests for your usage. Here it will return a singleton instance of the PostsController
.
import { module, test } from 'qunit';
import { setupTest } from 'ember-qunit';
module('Unit | Controller | posts', function(hooks) {
setupTest(hooks);
test('should update A and B on setProps action', function(assert) {
assert.expect(4);
// get the controller instance
let controller = this.owner.lookup('controller:posts');
// check the properties before the action is triggered
assert.equal(
controller.propA,
'You need to write tests',
'propA initialized'
);
assert.equal(
controller.propB,
'And write one for me too',
'propB initialized'
);
// trigger the action on the controller by using the `send` method,
// passing in any params that our action may be expecting
controller.send('setProps', 'Testing Rocks!');
// finally we assert that our values have been updated
// by triggering our action.
assert.equal(controller.propA, 'Testing is cool', 'propA updated');
assert.equal(controller.propB, 'Testing Rocks!', 'propB updated');
});
});
© 2020 Yehuda Katz, Tom Dale and Ember.js contributors
Licensed under the MIT License.
https://guides.emberjs.com/v3.25.0/testing/testing-controllers