@netdata/netdata-ui/dist/components/tabs/tabs.test.js

netdata UI kit

"use strict";

var _react = _interopRequireWildcard(require("react"));
var _testUtilities = require("testUtilities");
var _ = require(".");
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; }
/**
 * @jest-environment jsdom
 */

describe("Tabs states", function () {
  it(" * should render uncontrolled", function () {
    var _renderWithProviders = (0, _testUtilities.renderWithProviders)(/*#__PURE__*/_react["default"].createElement(_.Tabs, null, /*#__PURE__*/_react["default"].createElement(_.Tab, {
        label: "hi"
      }, "Hello"), /*#__PURE__*/_react["default"].createElement(_.Tab, {
        label: "Hi again"
      }, "Hello again"), /*#__PURE__*/_react["default"].createElement(_.Tab, {
        label: "Bye"
      }, "Goodbye"), /*#__PURE__*/_react["default"].createElement(_.Tab, {
        label: "Bye Bye"
      }, "Fairwell"))),
      container = _renderWithProviders.container,
      getByText = _renderWithProviders.getByText,
      queryByText = _renderWithProviders.queryByText;
    var tabs = container.firstChild;
    expect(tabs).toMatchSnapshot();
    expect(getByText("hi")).toHaveStyleRule("font-weight", "bold");
    expect(queryByText("Hello")).toBeInTheDocument();
    expect(queryByText("Hello again")).not.toBeInTheDocument();
    expect(queryByText("Goodbye")).not.toBeInTheDocument();
    expect(queryByText("Fairwell")).not.toBeInTheDocument();
    var tab = getByText("Bye Bye");
    _testUtilities.fireEvent.click(tab);
    expect(tab).toHaveStyleRule("font-weight", "bold");
    expect(queryByText("Hello")).not.toBeInTheDocument();
    expect(queryByText("Fairwell")).toBeInTheDocument();
  });
  it(" * should render controlled", function () {
    var onChange = jest.fn();
    var Component = function Component() {
      var _useState = (0, _react.useState)(2),
        selected = _useState[0],
        setSelected = _useState[1];
      return /*#__PURE__*/_react["default"].createElement(_.Tabs, {
        selected: selected,
        onChange: onChange.mockImplementation(function (index) {
          return setSelected(index);
        })
      }, /*#__PURE__*/_react["default"].createElement(_.Tab, {
        label: "hi"
      }, "Hello"), /*#__PURE__*/_react["default"].createElement(_.Tab, {
        label: "Hi again"
      }, "Hello again"), /*#__PURE__*/_react["default"].createElement(_.Tab, {
        label: "Bye"
      }, "Goodbye"), /*#__PURE__*/_react["default"].createElement(_.Tab, {
        label: "Bye Bye"
      }, "Fairwell"));
    };
    var _renderWithProviders2 = (0, _testUtilities.renderWithProviders)(/*#__PURE__*/_react["default"].createElement(Component, null)),
      queryByText = _renderWithProviders2.queryByText,
      getByText = _renderWithProviders2.getByText;
    expect(queryByText("Hello")).not.toBeInTheDocument();
    expect(queryByText("Hello again")).not.toBeInTheDocument();
    expect(getByText("Bye")).toHaveStyleRule("font-weight", "bold");
    expect(queryByText("Goodbye")).toBeInTheDocument();
    expect(queryByText("Fairwell")).not.toBeInTheDocument();
    var tab = getByText("Hi again");
    _testUtilities.fireEvent.click(tab);
    expect(tab).toHaveStyleRule("font-weight", "bold");
    expect(onChange).toBeCalledWith(1);
    expect(queryByText("Goodbye")).not.toBeInTheDocument();
    expect(queryByText("Hello again")).toBeInTheDocument();
  });
  it(" * should not allow disabled to be selected", function () {
    var Component = function Component() {
      return /*#__PURE__*/_react["default"].createElement(_.Tabs, null, /*#__PURE__*/_react["default"].createElement(_.Tab, {
        label: "hi",
        disabled: true
      }, "Hello"), /*#__PURE__*/_react["default"].createElement(_.Tab, {
        label: "Hi again"
      }, "Hello again"), /*#__PURE__*/_react["default"].createElement(_.Tab, {
        label: "Bye"
      }, "Goodbye"), /*#__PURE__*/_react["default"].createElement(_.Tab, {
        label: "Bye Bye"
      }, "Fairwell"));
    };
    var _renderWithProviders3 = (0, _testUtilities.renderWithProviders)(/*#__PURE__*/_react["default"].createElement(Component, null)),
      queryByText = _renderWithProviders3.queryByText,
      getByText = _renderWithProviders3.getByText;
    expect(queryByText("Hello")).not.toBeInTheDocument();
    expect(getByText("Hi again")).toHaveStyleRule("font-weight", "bold");
    expect(queryByText("Hello again")).toBeInTheDocument();
    var tab = getByText("hi");
    _testUtilities.fireEvent.click(tab);
    expect(tab).toHaveStyleRule("font-weight", "normal");
    expect(queryByText("Hello")).not.toBeInTheDocument();
    expect(queryByText("Hello again")).toBeInTheDocument();
  });
});