/* jshint expr:true */
import { expect } from 'chai';
import {
  describeComponent,
  it
} from 'ember-mocha';
import Ember from 'ember';
import hbs from 'htmlbars-inline-precompile';
import sinon from 'sinon';

const { run } = Ember;

describeComponent(
  'react-component',
  'Integration: ReactComponentComponent',
  {
    integration: true
  },
  function() {
    it('renders', function() {
      this.render(hbs`{{react-component "say-hi"}}`);
      expect(this.$()).to.have.length(1);
    });

    it('throws error when no component found', function() {
      expect(() => {
        this.render(hbs`{{react-component "missing-component"}}`);
      }).to.throw(/Could not find react component/);
    });

    it('passes state', function() {
      this.render(hbs`{{react-component "say-hi" name="Alex"}}`);
      expect(this.$().text()).to.equal("Hello Alex");
    });

    it('rerenders on state change', function() {
      this.render(hbs`{{react-component "say-hi" name="Alex"}}`);
      this.set('name', 'Owen');
      expect(this.$().text()).to.equal("Hello Alex");
    });

    it('rerenders when mutable state changes', function() {
      this.render(hbs`
        {{input value=name}}

        {{react-component "say-hi" name=name}}
      `);

      this.$('input').val('Noah').trigger('change');
      run.next(() => {
        expect(this.$().text()).to.contain("Hello Noah");
      });
    });

    it('can use actions from action helper', function() {
      const clickActionHandler = sinon.stub();
      this.on('didClickButton', clickActionHandler);

      this.render(hbs`{{react-component "fancy-button"
        onClick=(action "didClickButton")
      }}`);

      this.$('button').click();

      expect(clickActionHandler.called).to.be.true;
    });
  }
);

/* jshint expr:true */
import { expect } from 'chai';
import {
  describeComponent,
  it
} from 'ember-mocha';
import Ember from 'ember';
import hbs from 'htmlbars-inline-precompile';
import sinon from 'sinon';

const { run } = Ember;

describeComponent(
  'react-component',
  'Integration: ReactComponentComponent',
  {
    integration: true
  },
  function() {
    it('renders', function() {
      this.render(hbs`{{react-component "say-hi"}}`);
      expect(this.$()).to.have.length(1);
    });

    it('throws error when no component found', function() {
      expect(() => {
        this.render(hbs`{{react-component "missing-component"}}`);
      }).to.throw(/Could not find react component/);
    });

    it('passes state', function() {
      this.render(hbs`{{react-component "say-hi" name="Alex"}}`);
      expect(this.$().text()).to.equal("Hello Alex");
    });

    it('rerenders on state change', function() {
      this.render(hbs`{{react-component "say-hi" name=name}}`);
      this.set('name', 'Owen');
      expect(this.$().text()).to.equal('Hello Owen');
    });

    it('rerenders when mutable state changes', function(done) {
      this.render(hbs`
        {{input value=name}}

        {{react-component "say-hi" name=name}}
      `);

      this.$('input').val('Noah').trigger('change');
      run.next(() => {
        expect(this.$().text()).to.contain("Hello Noah");
        done();
      });
    });

    it('can use actions from action helper', function() {
      const clickActionHandler = sinon.stub();
      this.on('didClickButton', clickActionHandler);

      this.render(hbs`{{react-component "fancy-button"
        onClick=(action "didClickButton")
      }}`);

      this.$('button').click();

      expect(clickActionHandler.called).to.be.true;
    });
  }
);

Fix bad tests