@carbon/ibm-cloud-cognitive-cdai
Version:
Carbon for Cloud & Cognitive CD&AI UI components
242 lines (239 loc) • 9.73 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _react = _interopRequireDefault(require("react"));
var _iconsReact = require("@carbon/icons-react");
var _IdeButton = require("../IdeButton");
var _enzyme = require("enzyme");
var _carbonComponents = require("carbon-components");
//
// Copyright IBM Corp. 2020, 2020
//
// This source code is licensed under the Apache-2.0 license found in the
// LICENSE file in the root directory of this source tree.
//
var prefix = _carbonComponents.settings.prefix;
describe('IdeButton', function () {
describe('Renders common props as expected', function () {
var wrapper = (0, _enzyme.shallow)(
/*#__PURE__*/
// eslint-disable-next-line jsx-a11y/tabindex-no-positive
_react.default.createElement(_IdeButton.IdeButton, {
tabIndex: 2,
className: "extra-class"
}, /*#__PURE__*/_react.default.createElement("div", {
className: "child"
}, "child"), /*#__PURE__*/_react.default.createElement("div", {
className: "child"
}, "child")));
var wrapperHref = (0, _enzyme.shallow)(
/*#__PURE__*/
// eslint-disable-next-line jsx-a11y/tabindex-no-positive
_react.default.createElement(_IdeButton.IdeButton, {
tabIndex: 2,
className: "extra-class",
href: "/home"
}, /*#__PURE__*/_react.default.createElement("div", {
className: "child"
}, "child"), /*#__PURE__*/_react.default.createElement("div", {
className: "child"
}, "child")));
it('Renders children as expected', function () {
expect(wrapper.dive().find('.child').length).toBe(2);
expect(wrapperHref.find('.child').length).toBe(2);
});
it('Should set tabIndex if one is passed via props', function () {
expect(wrapper.dive().props().tabIndex).toEqual(2);
expect(wrapperHref.props().tabIndex).toEqual(2);
});
it('Should add extra classes via className', function () {
expect(wrapper.dive().hasClass('extra-class')).toBe(true);
expect(wrapperHref.hasClass('extra-class')).toBe(true);
});
});
describe('Renders <button> props as expected', function () {
var wrapper = (0, _enzyme.shallow)(
/*#__PURE__*/
// eslint-disable-next-line jsx-a11y/tabindex-no-positive
_react.default.createElement(_IdeButton.IdeButton, {
tabIndex: 2
}, /*#__PURE__*/_react.default.createElement("div", {
className: "child"
}, "child"), /*#__PURE__*/_react.default.createElement("div", {
className: "child"
}, "child")));
it('Renders as a <button>', function () {
expect(wrapper.is('Button')).toBe(true);
expect(wrapper.dive().is('button')).toBe(true);
});
it('Should set disabled to false by default', function () {
expect(wrapper.dive().props().disabled).toBe(false);
});
it('Should set disabled if one is passed via props', function () {
wrapper.setProps({
disabled: true
});
expect(wrapper.dive().props().disabled).toBe(true);
});
it('Should set type to button by default', function () {
expect(wrapper.dive().props().type).toEqual('button');
});
it('Should only set type to [button, reset or submit] if one is passed via props', function () {
wrapper.setProps({
type: 'reset'
});
expect(wrapper.dive().props().type).toEqual('reset');
wrapper.setProps({
type: 'submit'
});
expect(wrapper.dive().props().type).toEqual('submit');
});
});
describe('Renders <a> props as expected', function () {
var wrapper = (0, _enzyme.shallow)(
/*#__PURE__*/
// eslint-disable-next-line jsx-a11y/tabindex-no-positive
_react.default.createElement(_IdeButton.IdeButton, {
href: "#",
tabIndex: 2
}, /*#__PURE__*/_react.default.createElement("div", {
className: "child"
}, "child"), /*#__PURE__*/_react.default.createElement("div", {
className: "child"
}, "child")));
it('Renders as an <a> element with an href', function () {
expect(wrapper.is('Button')).toBe(true);
expect(wrapper.dive().is('a')).toBe(true);
});
});
describe('Renders icon buttons', function () {
var iconButton = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(_IdeButton.IdeButton, {
renderIcon: _iconsReact.Add16,
iconDescription: "Search"
}, "Search"));
var icon = iconButton.find('svg');
it('should have the appropriate icon', function () {
expect(icon.hasClass("".concat(prefix, "--btn__icon"))).toBe(true);
});
});
describe('Renders custom icon buttons', function () {
var iconButton = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(_IdeButton.IdeButton, {
renderIcon: _iconsReact.Add16,
iconDescription: "Search"
}, "Search")).childAt(0); // move past ForwardRef
var originalIcon = (0, _enzyme.mount)(/*#__PURE__*/_react.default.createElement(_iconsReact.Add16, null)).find('svg');
var icon = iconButton.find('svg');
it('should have the appropriate icon', function () {
expect(icon.hasClass("".concat(prefix, "--btn__icon"))).toBe(true);
expect(icon.find(':not(svg):not(title)').html()).toBe(originalIcon.children().html());
});
});
describe('Animates icons', function () {
var iconButton = (0, _enzyme.shallow)(/*#__PURE__*/_react.default.createElement(_IdeButton.IdeButton, {
renderIcon: _iconsReact.Add16,
iconDescription: "Search"
}, "Search"));
it('Should add an appropriate class to trigger animation', function () {
iconButton.setProps({
iconAnimation: 'rotate-180-anti'
});
expect(iconButton.dive().hasClass('ide-btn--rotate-180-anti')).toBe(true);
});
});
});
describe('Primary Button', function () {
describe('Renders as expected', function () {
var wrapper = (0, _enzyme.shallow)(/*#__PURE__*/_react.default.createElement(_IdeButton.IdeButton, {
className: "extra-class"
}));
it('Has the expected classes', function () {
expect(wrapper.dive().hasClass("".concat(prefix, "--btn"))).toEqual(true);
});
it('Should add extra classes that are passed via className', function () {
expect(wrapper.dive().hasClass('extra-class')).toEqual(true);
});
});
});
describe('Secondary Button', function () {
describe('Renders as expected', function () {
var wrapper = (0, _enzyme.shallow)(/*#__PURE__*/_react.default.createElement(_IdeButton.IdeButton, {
kind: "secondary",
className: "extra-class"
}));
it('Has the expected classes', function () {
expect(wrapper.dive().hasClass("".concat(prefix, "--btn--secondary"))).toEqual(true);
});
it('Should add extra classes that are passed via className', function () {
expect(wrapper.dive().hasClass('extra-class')).toEqual(true);
});
});
});
describe('Ghost Button', function () {
describe('Renders as expected', function () {
var wrapper = (0, _enzyme.shallow)(/*#__PURE__*/_react.default.createElement(_IdeButton.IdeButton, {
kind: "ghost",
className: "extra-class"
}));
it('Has the expected classes', function () {
expect(wrapper.dive().hasClass("".concat(prefix, "--btn--ghost"))).toEqual(true);
});
it('Should add extra classes that are passed via className', function () {
expect(wrapper.dive().hasClass('extra-class')).toEqual(true);
});
});
});
describe('Small Button', function () {
describe('Renders as expected', function () {
var wrapper = (0, _enzyme.shallow)(/*#__PURE__*/_react.default.createElement(_IdeButton.IdeButton, {
size: 'small',
className: "extra-class"
}));
it('Has the expected classes for small', function () {
expect(wrapper.dive().hasClass("".concat(prefix, "--btn--sm"))).toEqual(true);
});
it('Should add extra classes that are passed via className', function () {
expect(wrapper.dive().hasClass('extra-class')).toEqual(true);
});
});
});
describe('DangerButton', function () {
describe('Renders as expected', function () {
var wrapper = (0, _enzyme.shallow)(/*#__PURE__*/_react.default.createElement(_IdeButton.IdeButton, {
kind: "danger",
className: "extra-class"
}));
it('Has the expected classes', function () {
expect(wrapper.dive().hasClass("".concat(prefix, "--btn--danger"))).toEqual(true);
});
it('Should add extra classes that are passed via className', function () {
expect(wrapper.dive().hasClass('extra-class')).toEqual(true);
});
});
});
describe('danger--primaryButton', function () {
describe('Renders as exptected', function () {
var wrapper = (0, _enzyme.shallow)(/*#__PURE__*/_react.default.createElement(_IdeButton.IdeButton, {
kind: "danger--primary",
className: "extra-class"
}));
it('Has the expected classes', function () {
expect(wrapper.dive().hasClass("".concat(prefix, "--btn--danger--primary"))).toEqual(true);
});
it('Should add extra classes that are passed via className', function () {
expect(wrapper.dive().hasClass('extra-class')).toEqual(true);
});
});
});
describe('TertiaryButton', function () {
describe('Renders as exptected', function () {
var wrapper = (0, _enzyme.shallow)(/*#__PURE__*/_react.default.createElement(_IdeButton.IdeButton, {
kind: "tertiary",
className: "extra-class"
}));
it('Has the expected classes', function () {
expect(wrapper.dive().hasClass("".concat(prefix, "--btn--tertiary"))).toEqual(true);
});
it('Should add extra classes that are passed via className', function () {
expect(wrapper.dive().hasClass('extra-class')).toEqual(true);
});
});
});