Old Guides - You are viewing the guides for Ember v5.11.0.

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.

app/controllers/posts.js

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:

tests/unit/controllers/posts-test.js

import { module, test } from 'qunit';
import { setupTest } from 'my-app-name/tests/helpers';

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.

tests/unit/controllers/posts-test.js

import { module, test } from 'qunit';
import { setupTest } from 'my-app-name/tests/helpers';

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');
  });
});

Testing Controller Actions