moq-ui/src/__tests__/button-test.js

Simple, customizable UI components built with React

jest.autoMockOff();

describe('Button', function() {

  it('sets the text with label', function() {
    var React = require('react/addons');
    var Button = require('../button.jsx');
    var TestUtils = React.addons.TestUtils;

    // Render a button with label
    var btn = TestUtils.renderIntoDocument(
      <Button label="Hello" />
    );

    // Check that the label is set and DOM updated
    var label = TestUtils.findRenderedDOMComponentWithTag(btn, 'span');
    expect(label.props.children).toBe('Hello');
    expect(label.getDOMNode().textContent).toEqual('Hello');
  });

  it('overrides children with label', function() {
    var React = require('react/addons');
    var Button = require('../button.jsx');
    var TestUtils = React.addons.TestUtils;

    var btn = TestUtils.renderIntoDocument(
      <Button label="World">Hello</Button>
    );

    var label = TestUtils.findRenderedDOMComponentWithTag(btn, 'span');

    expect(label.props.children).not.toBe('Hello');
    expect(label.props.children).toBe('World');

    expect(label.getDOMNode().textContent).not.toEqual('Hello');
    expect(label.getDOMNode().textContent).toEqual('World');
  });

  it('should warn if lacking children and label', function() {
    var React = require('react/addons');
    var Button = require('../button.jsx');
    var TestUtils = React.addons.TestUtils;

    var createEmptyBtn = function(){
      TestUtils.renderIntoDocument(
        <Button />
      );
    }

    createEmptyBtn();
    // should warn:
    // 'Failed propType: Required prop `label` or `children` was not specified in `Button`.'
  });

  it('changes state when hovered', function() {
    var React = require('react/addons');
    var Button = require('../button.jsx');
    var TestUtils = React.addons.TestUtils;

    var btn = TestUtils.renderIntoDocument(
      <Button label="Hello" />
    );

    var el = TestUtils.findRenderedDOMComponentWithTag(btn, 'button');

    TestUtils.SimulateNative.mouseOver(el);
    expect(btn.state.hovered).toBe(true);
    TestUtils.SimulateNative.mouseOut(el);
    expect(btn.state.hovered).toBe(false);
  });

});