@brightleaf/elements/lib/__tests__/button.test.js

React UI elements styled with Bulma CSS

"use strict";

var _react = _interopRequireDefault(require("react"));

var _react2 = require("@testing-library/react");

var _jestDom = require("@testing-library/jest-dom");

var _button = require("../button");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

expect.extend({
  toHaveClass: _jestDom.toHaveClass,
  toHaveAttribute: _jestDom.toHaveAttribute
});
describe('Button components', function () {
  afterEach(_react2.cleanup);
  it('should render', function () {
    var _render = (0, _react2.render)(_react.default.createElement(_button.Button, null, "Button")),
        container = _render.container;

    expect(container.firstChild).toMatchSnapshot();
    expect(container.firstChild).toHaveClass('button');
  });
  it('should render with colored classes applied', function () {
    var _render2 = (0, _react2.render)(_react.default.createElement(_button.Buttons, null, _react.default.createElement(_button.Button, {
      isPrimary: true
    }, "Primary"), _react.default.createElement(_button.Button, {
      isInfo: true
    }, "Info"), _react.default.createElement(_button.Button, {
      isDanger: true
    }, "Danger"), _react.default.createElement(_button.Button, {
      isLink: true
    }, "Link"), _react.default.createElement(_button.Button, {
      isWarning: true
    }, "Warning"), _react.default.createElement(_button.Button, {
      isSuccess: true
    }, "Success"))),
        container = _render2.container;

    expect(container.firstChild).toMatchSnapshot();
    expect(container.firstChild).toHaveClass('buttons');
    expect(container.firstChild.firstChild).toHaveClass('button');
    var buttonEls = Array.from(container.firstChild.childNodes);
    expect(buttonEls[0]).toHaveClass('is-primary');
    expect(buttonEls[1]).toHaveClass('is-info');
    expect(buttonEls[2]).toHaveClass('is-danger');
    expect(buttonEls[3]).toHaveClass('is-link');
    expect(buttonEls[4]).toHaveClass('is-warning');
    expect(buttonEls[5]).toHaveClass('is-success');
  });
  it('should render as correct elements', function () {
    var _render3 = (0, _react2.render)(_react.default.createElement(_button.Buttons, null, _react.default.createElement(_button.Button, null, "Button"), _react.default.createElement(_button.Button, {
      isSubmit: true
    }, "Submit"), _react.default.createElement(_button.Button, {
      isAnchor: true,
      href: "#"
    }, "Anchor"), _react.default.createElement(_button.Button, {
      isReset: true
    }, "Reset"))),
        container = _render3.container;

    expect(container.firstChild).toMatchSnapshot();
    expect(container.firstChild.firstChild).toHaveClass('button');
    var buttonEls = Array.from(container.firstChild.childNodes);
    expect(buttonEls[1]).toHaveAttribute('type', 'submit');
    expect(buttonEls[2]).toHaveAttribute('href', '#');
    expect(buttonEls[3]).toHaveAttribute('type', 'reset');
  });
});