Ember - Search box test

search-box-test.js

import { moduleForComponent, test } from 'ember-qunit';
import hbs from 'htmlbars-inline-precompile';
import Ember from 'ember';

const routerStub = Ember.Service.extend({
  transitionTo() {
    return '';
  }
});

moduleForComponent('search-box', 'Integration | Component | search box', {
  integration: true,

  beforeEach: function () {
    this.register('router', routerStub);
    this.inject.service('router', { as: 'router' });
  }
});

test('it renders', function(assert) {
  // Set any properties with this.set('myProperty', 'value');
  // Handle any actions with this.on('myAction', function(val) { ... });

  this.render(hbs`{{search-box}}`);

  // Template block usage:
  this.render(hbs`
    {{#search-box}}
      template block text
    {{/search-box}}
  `);

  assert.equal(this.$().find('.searchbox__form .searchbox__input-group').length, 1);
});

test('when X is clicked, it clears the input', function(assert) {
  var inputText = 'qwerty';

  this.render(hbs`{{search-box}}`);

  this.$().find('input').val(inputText);

  assert.equal(this.$().find('input').val(), inputText);

  this.$().find('.searchbox__clear-icon').click();

  assert.equal(this.$().find('input').val(), '');
});

test('Click "search icon" calls the method to go to the page', function(assert) {
  this.on('doSearch', function() {
    assert.ok();
  });

  var inputText = 'qwerty';

  this.render(hbs`{{search-box}}`);

  this.$().find('input').val(inputText);

  this.$().find('.searchbox__search-icon').click();
});