A high-level introduction to testing in EmberJS. This talk explains the difference between unit, integration and acceptance tests, when to use each and how to get started with ember-cli-mocha.
Ben LimmerEmberJS Meetup - 7/29/2015 ember.party
write better code
less need for
manual qa
confidence when
refactoring
living documentation
confidence when
upgrading
Ben LimmerEmberJS Meetup - 7/29/2015 ember.party
ember acceptance tests
• rendered routes
• transitions between routes
• communicating with the (fake) server
Ben LimmerEmberJS Meetup - 7/29/2015 ember.party
ember acceptance tests
application
interaction
expected
state
application
interaction
expected
state
mixins/authenticated-route-test.js
describe('beforeModel', function() {
const signInRoute = 'sign-in';
let subject, replaceWithStub, session;
beforeEach(function() {
const AuthenticatedRouteObject = Ember.Route.extend(
AuthenticatedRouteMixin);
replaceWithStub = sinon.stub();
session = Ember.Object.create();
subject = AuthenticatedRouteObject.create({
session: session,
signInRoute: signInRoute,
replaceWith: replaceWithStub
});
});
it('does nothing if logged in');
it('transitions to the sign in route if not logged in');
});
it('does nothing if logged in', function() {
session.set(‘isLoggedIn’, true);
subject.beforeModel();
expect(replaceWithStub.called).to.be.false;
});
it('transitions to the sign in route if not logged in',
function() {
session.set('isLoggedIn', false);
subject.beforeModel();
expect(replaceWithStub.withArgs(signInRoute).calledOnce).to.be.true;
});
mixins/authenticated-route-test.js
components/sign-in-form-
test.js
it('shows the user's email address', function() {
this.set('user', Ember.Object.create({
email: 'foo@bar.com'
}));
this.render(hbs`{{sign-in-form user=user}}`);
expect(this.$('#sign-in-greeting').text()).to.contain('foo@bar.com');
});
it('has a button to login', function() {
this.render(hbs`{{sign-in-form}}`);
expect(this.$('button#sign-in-cta').length).to.equal(1);
});
components/sign-in-form-
test.js
it('sends the login action with the user when clicking the button',
function(done) {
const user = Ember.Object.create({
email: 'foo@bar.com'
});
this.set('user', user);
this.on('signIn', function(actionUser) {
expect(actionUser).to.equal(user);
done();
});
this.render(hbs`{{sign-in-form user=user signIn='signIn'}}`);
this.$('button#sign-in-cta').click();
});