@carbon/ibm-cloud-cognitive-cdai/lib/components/IdeHome/IdeHome.spec.js

Carbon for Cloud & Cognitive CD&AI UI components

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _ = require(".");
var _testProps = require("./test_assets/testProps.js");
var _IDHelper = require("../../component_helpers/IDHelper");
var jth = _interopRequireWildcard(require("../../component_helpers/jest_test_helper_functions.js"));
var _carbonComponents = require("carbon-components");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
//
// 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('IdeHome unit tests', function () {
  var component, unmount;
  var mountTestComponent = function mountTestComponent() {
    var defaultProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
    var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
    var test = jth.mountComponent(jth.getJSXForComponent(_.IdeHome, defaultProps, props));
    component = test.component;
    unmount = test.unmount;
    return test;
  };
  afterEach(function () {
    // if unmount defined, call it to clear up any mounted component
    unmount && unmount();
  });
  it('IdeHome tollerates no props being provided, and renders with defaults', function () {
    var testClassNames = {
      'IdeHome-Header-Text': ['ide-home-heading-container', "".concat(prefix, "--col-sm-1"), "".concat(prefix, "--col-md-2"), "".concat(prefix, "--col-lg-6"), "".concat(prefix, "--col-xlg-6"), "".concat(prefix, "--col-max-6")],
      'IdeHome-Header-Image': ['ide-home-image-container', "".concat(prefix, "--col-sm-3"), "".concat(prefix, "--col-md-6"), "".concat(prefix, "--col-lg-10"), "".concat(prefix, "--col-xlg-10"), "".concat(prefix, "--col-max-10")]
    };
    mountTestComponent();
    expect(component.getElements()).toMatchSnapshot();
    var _loop = function _loop() {
      var _Object$entries$_i = (0, _slicedToArray2.default)(_Object$entries[_i], 2),
        id = _Object$entries$_i[0],
        classNames = _Object$entries$_i[1];
      classNames.map(function (className) {
        expect(component.find((0, _IDHelper.idAttributeSelector)(id)).hasClass(className)).toEqual(true);
      });
    };
    for (var _i = 0, _Object$entries = Object.entries(testClassNames); _i < _Object$entries.length; _i++) {
      _loop();
    }
  });
  it('IdeHome renders user custom content when render function is provided', function () {
    var props = (0, _testProps.withCustomSetTabFunc)();
    mountTestComponent(null, props);
    expect(component.exists((0, _IDHelper.idAttributeSelector)('tab1')));
    expect(component.exists((0, _IDHelper.idAttributeSelector)('tab2')));
  });
  it('IdeHome renders task image when valid react element is provided', function () {
    var props = (0, _testProps.tasksValidImage)();
    mountTestComponent(null, props);
    expect(component.exists('ide-home-tile-img'));
  });
  it('IdeHome renders default sets when render function is not provided', function () {
    var props = (0, _testProps.withNoTasksOrRenderFunc)();
    mountTestComponent(null, props);
    expect(component.exists((0, _IDHelper.idAttributeSelector)('tab1')));
    expect(component.exists((0, _IDHelper.idAttributeSelector)('tab2')));
  });
  it('IdeHome renders sets as sections when multipleSetType prop is `section`', function () {
    var props = (0, _testProps.withCustomSetSectionFunc)();
    mountTestComponent(null, props);
    expect(component.exists((0, _IDHelper.idAttributeSelector)('section1')));
    expect(component.exists((0, _IDHelper.idAttributeSelector)('section2')));
  });
  it('IdeHome renders just 1 set if 1 provided', function () {
    var props = (0, _testProps.withOneSetToRender)();
    mountTestComponent(null, props);
    expect(component.exists((0, _IDHelper.idAttributeSelector)('tab1')));
  });
  it('IdeHome renders collapsible version of the banner', function () {
    var testClassNames = {
      'IdeHome-Header-Text': ['ide-home-heading-container', "".concat(prefix, "--col-sm-2"), "".concat(prefix, "--col-md-3"), "".concat(prefix, "--col-lg-6"), "".concat(prefix, "--col-xlg-6"), "".concat(prefix, "--col-max-6")],
      'IdeHome-Header-Image': ['ide-home-image-container', "".concat(prefix, "--col-sm-2"), "".concat(prefix, "--col-md-3"), "".concat(prefix, "--col-lg-8"), "".concat(prefix, "--col-xlg-8"), "".concat(prefix, "--col-max-8")],
      'IdeHome-header-toggle-container': ['ide-home-header-toggle-container', "".concat(prefix, "--col-sm-1"), "".concat(prefix, "--col-md-2"), "".concat(prefix, "--col-lg-2"), "".concat(prefix, "--col-xlg-2"), "".concat(prefix, "--col-max-2")]
    };
    var props = (0, _testProps.withCollapsibleAbility)();
    mountTestComponent(null, props);
    expect(component.exists((0, _IDHelper.idAttributeSelector)('IdeHome-header-toggle')));
    var _loop2 = function _loop2() {
      var _Object$entries2$_i = (0, _slicedToArray2.default)(_Object$entries2[_i2], 2),
        id = _Object$entries2$_i[0],
        classNames = _Object$entries2$_i[1];
      classNames.map(function (className) {
        expect(component.find((0, _IDHelper.idAttributeSelector)(id)).hasClass(className)).toEqual(true);
      });
    };
    for (var _i2 = 0, _Object$entries2 = Object.entries(testClassNames); _i2 < _Object$entries2.length; _i2++) {
      _loop2();
    }
  });
  it('renders the collapsed banner when the toggle is pressed', function () {
    var testClassNames = {
      'IdeHome-Header-Text': ['ide-home-heading-container', "".concat(prefix, "--col-sm-3"), "".concat(prefix, "--col-md-6"), "".concat(prefix, "--col-lg-14"), "".concat(prefix, "--col-xlg-14"), "".concat(prefix, "--col-max-14")],
      'IdeHome-header-toggle-container': ['ide-home-header-toggle-container', "".concat(prefix, "--col-sm-1"), "".concat(prefix, "--col-md-2"), "".concat(prefix, "--col-lg-2"), "".concat(prefix, "--col-xlg-2"), "".concat(prefix, "--col-max-2")]
    };
    var props = (0, _testProps.withCollapsibleAbility)();
    props.headerCollapsed = true;
    mountTestComponent(null, props);
    expect(component.find((0, _IDHelper.idAttributeSelector)('IdeHome-Header')).prop('className')).toEqual("collapsed ide-home-header ".concat(prefix, "--row"));
    var _loop3 = function _loop3() {
      var _Object$entries3$_i = (0, _slicedToArray2.default)(_Object$entries3[_i3], 2),
        id = _Object$entries3$_i[0],
        classNames = _Object$entries3$_i[1];
      classNames.map(function (className) {
        expect(component.find((0, _IDHelper.idAttributeSelector)(id)).hasClass(className)).toEqual(true);
      });
    };
    for (var _i3 = 0, _Object$entries3 = Object.entries(testClassNames); _i3 < _Object$entries3.length; _i3++) {
      _loop3();
    }
  });
  it('collapses the banner when the toggle is pressed and calls the callback', function () {
    var props = (0, _testProps.withCollapsibleAbility)();
    var mockHeaderHandleCollapseFunc = jest.fn();
    props.headerHandleCollapseFunc = mockHeaderHandleCollapseFunc;
    mountTestComponent(null, props);
    expect(component.exists((0, _IDHelper.idAttributeSelector)('IdeHome-header-toggle')));
    component.find((0, _IDHelper.idAttributeSelector)('IdeHome-header-toggle')).simulate('click');
    expect(mockHeaderHandleCollapseFunc).toHaveBeenCalled();
  });
  it('collapses the banner and calls the callback twice when the toggle is pressed twice', function () {
    var props = (0, _testProps.withCollapsibleAbility)();
    var mockHeaderHandleCollapseFunc = jest.fn();
    props.headerHandleCollapseFunc = mockHeaderHandleCollapseFunc;
    mountTestComponent(null, props);
    expect(component.exists((0, _IDHelper.idAttributeSelector)('IdeHome-header-toggle')));
    component.find((0, _IDHelper.idAttributeSelector)('IdeHome-header-toggle')).simulate('click');
    expect(mockHeaderHandleCollapseFunc).toHaveBeenCalled();
    component.find((0, _IDHelper.idAttributeSelector)('IdeHome-header-toggle')).simulate('click');
    expect(mockHeaderHandleCollapseFunc).toHaveBeenCalled();
  });
});