Integration Testing in Action

let's take an example of a components name sign-in-form.hbs which shows the email when user clicks the Sign In button.

 <h4 id='sign-in-greeting'>
  Click the Button Below to Login as {{user.email}}
 </h4>
 <button id='sign-in-cta' class='button' {{action 'signIn'}}>
    Sign In
 </button>

And this is our sign-in-form.js file which triggers action signIn

export default Ember.Component.extend({
  actions: {
   signIn() {
   this.sendAction(‘signIn', this.get('user'));
  }

Then our test case components/sign-in-formtest.js would be somewhat like this.

it('shows the user\'s email address', function() {
 this.set('user', Ember.Object.create({
 email: '[email protected]'
 }));
 this.render(hbs`{{sign-in-form user=user}}`);
 expect(this.$('#sign-in-greeting').text()).to.contain('[email protected]');
 });
 it('has a button to login', function() {
 this.render(hbs`{{sign-in-form}}`);
 expect(this.$('button#sign-in-cta').length).to.equal(1);
 });