"use strict";

require("@testing-library/jest-dom");
var _react = require("@testing-library/react");
var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
var _Button = _interopRequireDefault(require("../../Button"));
var _TabGroup = _interopRequireDefault(require("../TabGroup"));
var _ThemeDecorator = _interopRequireDefault(require("../../ThemeDecorator"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
describe('TabGroup Specs', function () {
  test('should fire `onTabClick` with `onTabClick` type when a tab is clicked', /*#__PURE__*/_asyncToGenerator(function* () {
    var handleTabClick = jest.fn();
    var user = _userEvent["default"].setup();
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabGroup["default"], {
      tabPosition: "before",
      tabs: [{
        title: 'Home',
        icon: 'home',
        onTabClick: handleTabClick
      }, {
        title: 'Settings',
        icon: 'setting'
      }, {
        title: 'Theme',
        icon: 'display'
      }]
    }));
    yield user.click(_react.screen.getByRole('group').children[0]); // clicking tab

    expect(handleTabClick).toHaveBeenCalled();
  }));
  test('should render three tabs when given three objects in `tabs` prop', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabGroup["default"], {
      tabPosition: "before",
      tabs: [{
        title: 'Home',
        icon: 'home'
      }, {
        title: 'Settings',
        icon: 'setting'
      }, {
        title: 'Theme',
        icon: 'display'
      }]
    }));
    var expectedClass = 'tabGroup';
    var expectedTabNumber = 3 * 2; // each tab has two children due to a dummy sibling by Spottable
    var tabGroup = _react.screen.getByRole('group');
    expect(tabGroup).toHaveClass(expectedClass);
    expect(tabGroup.children).toHaveLength(expectedTabNumber);
  });
  test('should render icons', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabGroup["default"], {
      tabPosition: "before",
      tabs: [{
        title: 'Home',
        icon: 'home',
        'data-testid': 'homeIcon'
      }, {
        title: 'Settings',
        icon: 'setting',
        'data-testid': 'settingIcon'
      }, {
        title: 'Theme',
        icon: 'display',
        'data-testid': 'displayIcon'
      }]
    }));
    var actualHomeIcon = _react.screen.getByTestId('homeIcon').textContent.codePointAt();
    var expectedHomeIcon = 983231; // decimal converted charCode of Unicode 'home' character
    var actualSettingsIcon = _react.screen.getByTestId('settingIcon').textContent.codePointAt();
    var expectedSettingsIcon = 983083; // decimal converted charCode of Unicode 'setting' character
    var actualDisplayIcon = _react.screen.getByTestId('displayIcon').textContent.codePointAt();
    var expectedDisplayIcon = 983244; // decimal converted charCode of Unicode 'display' character

    expect(actualHomeIcon).toBe(expectedHomeIcon);
    expect(actualSettingsIcon).toBe(expectedSettingsIcon);
    expect(actualDisplayIcon).toBe(expectedDisplayIcon);
  });
  test('should have positionAfter when given `tabPosition=after`', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabGroup["default"], {
      tabPosition: "after",
      tabs: [{
        title: 'Home',
        icon: 'home'
      }, {
        title: 'Settings',
        icon: 'setting'
      }, {
        title: 'Theme',
        icon: 'display'
      }]
    }));
    var expected = 'positionAfter';
    var actual = _react.screen.getByRole('group').parentElement.parentElement;
    expect(actual).toHaveClass(expected);
  });
  test('should render two buttons when given children', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TabGroup["default"], {
      tabPosition: "before",
      tabs: [{
        title: 'Home',
        icon: 'home'
      }, {
        title: 'Settings',
        icon: 'setting'
      }, {
        title: 'Theme',
        icon: 'display'
      }],
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("beforeTabs", {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button["default"], {
          icon: "arrowlargeleft",
          size: "small",
          type: "grid"
        })
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("afterTabs", {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button["default"], {
          icon: "arrowlargeright",
          size: "small",
          type: "grid"
        })
      })]
    }));
    var expected = 2;
    var actual = _react.screen.getAllByRole('button');
    expect(actual).toHaveLength(expected);
  });
  test('should apply className `vertical` when `orientation=vertical`', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabGroup["default"], {
      orientation: "vertical",
      tabPosition: "before",
      tabs: [{
        title: 'Home',
        icon: 'home'
      }, {
        title: 'Settings',
        icon: 'setting'
      }, {
        title: 'Theme',
        icon: 'display'
      }]
    }));
    var expected = 'vertical';
    var actual = _react.screen.getByRole('group').parentElement.parentElement;
    expect(actual).toHaveClass(expected);
  });
  test('should apply className `horizontal` when `orientation=horizontal`', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabGroup["default"], {
      orientation: "horizontal",
      tabPosition: "before",
      tabs: [{
        title: 'Home',
        icon: 'home'
      }, {
        title: 'Settings',
        icon: 'setting'
      }, {
        title: 'Theme',
        icon: 'display'
      }]
    }));
    var expected = 'horizontal';
    var actual = _react.screen.getByRole('group').parentElement.parentElement;
    expect(actual).toHaveClass(expected);
  });
  test('should apply className `after` to the label when `orientation=vertical` and `tabPosition=before`', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabGroup["default"], {
      orientation: "vertical",
      tabPosition: "before",
      tabs: [{
        title: 'Home',
        icon: 'home'
      }, {
        title: 'Settings',
        icon: 'setting'
      }, {
        title: 'Theme',
        icon: 'display'
      }]
    }));
    var expected = 'after';
    var actual = _react.screen.getByRole('group').children.item(0).children.item(0);
    expect(actual).toHaveClass(expected);
  });
  test('should apply className `before` to the label when `orientation=vertical` and `tabPosition=after`', function () {
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabGroup["default"], {
      orientation: "vertical",
      tabPosition: "after",
      tabs: [{
        title: 'Home',
        icon: 'home'
      }, {
        title: 'Settings',
        icon: 'setting'
      }, {
        title: 'Theme',
        icon: 'display'
      }]
    }));
    var expected = 'before';
    var actual = _react.screen.getByRole('group').children.item(0).children.item(0);
    expect(actual).toHaveClass(expected);
  });
  test('should include a ToggleButton inside TabLabel when the skin is `copper`', function () {
    var TabGroupComponent = function TabGroupComponent() {
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabGroup["default"], {
        orientation: "vertical",
        tabPosition: "after",
        tabs: [{
          title: 'Home',
          icon: 'home'
        }, {
          title: 'Settings',
          icon: 'setting'
        }, {
          title: 'Theme',
          icon: 'display'
        }]
      });
    };
    var App = (0, _ThemeDecorator["default"])(TabGroupComponent);
    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(App, {
      skin: "copper"
    }));
    var tabLabel = _react.screen.getByLabelText('Home');
    var expected = 'toggleButton';
    var actual = tabLabel.children.item(0);
    expect(actual).toHaveClass(expected);
  });
});