@salesforce/design-system-react/lib/components/button-group/__tests__/button-group.browser-test.js

Salesforce Lightning Design System for React

"use strict";

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

var _reactDom = _interopRequireDefault(require("react-dom"));

var _testUtils = _interopRequireDefault(require("react-dom/test-utils"));

var _chai = require("chai");

var _iconSettings = _interopRequireDefault(require("../../icon-settings"));

var _buttonGroup = _interopRequireDefault(require("../../button-group"));

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

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

/* eslint-disable react/no-render-return-value */

/* eslint-disable react/no-find-dom-node */
describe('SLDSButtonGroup: ', function () {
  var generateButtonGroup = function generateButtonGroup(buttonGroupInstance) {
    var reactCmp = _testUtils.default.renderIntoDocument(_react.default.createElement(_iconSettings.default, {
      iconPath: "/assets/icons"
    }, _react.default.createElement("div", null, buttonGroupInstance)));

    return _reactDom.default.findDOMNode(reactCmp).children[0];
  };

  describe('component renders', function () {
    it('buttonGroup renders', function () {
      var instance = _react.default.createElement(_buttonGroup.default, null, _react.default.createElement(_button.default, {
        label: "Chart",
        variant: "icon",
        iconCategory: "utility",
        iconName: "chart",
        iconVariant: "border"
      }), _react.default.createElement(_button.default, {
        label: "Filter",
        variant: "icon",
        iconCategory: "utility",
        iconName: "filter",
        iconVariant: "border"
      }), _react.default.createElement(_button.default, {
        label: "Sort",
        variant: "icon",
        iconCategory: "utility",
        iconName: "sort",
        iconVariant: "more"
      }));

      var buttonGroup = generateButtonGroup(instance);
      (0, _chai.expect)(buttonGroup).to.not.equal(undefined);
    });
    it('renders proper attributes', function () {
      var instance = _react.default.createElement(_buttonGroup.default, null, _react.default.createElement(_button.default, {
        label: "Chart",
        variant: "icon",
        iconCategory: "utility",
        iconName: "chart",
        iconVariant: "border"
      }), _react.default.createElement(_button.default, {
        label: "Filter",
        variant: "icon",
        iconCategory: "utility",
        iconName: "filter",
        iconVariant: "border"
      }), _react.default.createElement(_button.default, {
        label: "Sort",
        variant: "icon",
        iconCategory: "utility",
        iconName: "sort",
        iconVariant: "more"
      }));

      var buttonGroup = generateButtonGroup(instance);
      var role = buttonGroup.getAttribute('role');
      (0, _chai.expect)(role).to.equal('group');
    });
    it('renders children', function () {
      var instance = _react.default.createElement(_buttonGroup.default, null, _react.default.createElement(_button.default, {
        label: "Chart",
        variant: "icon",
        iconCategory: "utility",
        iconName: "chart",
        iconVariant: "border"
      }), _react.default.createElement(_button.default, {
        label: "Filter",
        variant: "icon",
        iconCategory: "utility",
        iconName: "filter",
        iconVariant: "border"
      }), _react.default.createElement(_button.default, {
        label: "Sort",
        variant: "icon",
        iconCategory: "utility",
        iconName: "sort",
        iconVariant: "more"
      }));

      var buttonGroup = generateButtonGroup(instance);
      var children = buttonGroup.getElementsByTagName('button');
      (0, _chai.expect)(children.length).to.equal(3);
    });
  });
  describe('component behavior works', function () {
    it('first button in group invokes method from props', function () {
      var onClick = sinon.spy();

      var instance = _react.default.createElement(_buttonGroup.default, null, _react.default.createElement(_button.default, {
        label: "Refresh",
        variant: "neutral",
        onClick: onClick
      }), _react.default.createElement(_button.default, {
        label: "Edit",
        variant: "neutral"
      }), _react.default.createElement(_button.default, {
        label: "Save",
        variant: "neutral"
      }), _react.default.createElement(_button.default, {
        label: "More Options",
        variant: "icon",
        iconCategory: "utility",
        iconName: "down",
        iconVariant: "border-filled"
      }));

      var buttonGroup = generateButtonGroup(instance);
      var firstBtn = buttonGroup.getElementsByTagName('button')[0];

      _testUtils.default.Simulate.click(firstBtn);

      (0, _chai.expect)(onClick.calledOnce).to.be.true;
    });
  });
});