How to unit test view bindings and templates on Emberjs?

Question

I'm trying to use TDD / BDD in ember, and I was wondering how do you unit test template bindings or view bindings?

And what is the best way to check your steering patterns, if it should be tested at all ??

Thanks Shay

Answer 1

I did not find anyone talking about this subject directly, so I wrote a post about my results .

I also opened a new open source project designed to test emberjs modules called emberjs-tdd

I mainly used the View function. $ () to check that my template elements are connected to my view, and for the bindings I used the data input layout, and then compared my input value with the layout data.

Something like:

describe("Given a login view it", function(){ var loginView = null; beforeEach(function(){ loginView = LoginView.create(); Ember.run(function(){ loginView.append(); }); }); afterEach(function(){ Ember.run(function(){ loginView.remove(); }); loginView = null; }); it("Should be defined", function(){ expect(loginView).toBeDefined(); }); it ("Should have a user property", function(){ expect(loginView.get("user")).toBeDefined(); }); describe("Should have a template and it", function(){ it("Should have an user input", function(){ expect(loginView.$("input.userInput").length).toEqual(1); }); it("Should bind the username input value to the user.name property", function(){ Ember.run(function(){ loginView.set("user", Em.Object.create({name:"mockValue"})); }); expect(loginView.$("input.userInput").val()).toEqual("mockValue"); }); it("Should have a login button", function(){ expect(loginView.$("button.loginButton").length).toEqual(1); }); }); }); 

And my view code:

 define(["text!templates/LoginView.handlebars","ember"],function(LoginTemplate){ var loginView = Em.View.extend({ template: Em.Handlebars.compile(LoginTemplate), user: null }); return loginView; }); 

And my template:

 {{view Ember.TextField class="userInput" valueBinding="user.name"}} <button class="loginButton">Login</button> 

Again, the full project can be found in the emberjs-tdd project , so please fill out for free to contribute to this project so that I will have a better idea on how to do this effectively.