@netdata/netdata-ui/dist/components/drops/popover/index.test.js

netdata UI kit

"use strict";

var _react = _interopRequireDefault(require("react"));
var _testUtilities = require("testUtilities");
var _typography = require("../../typography");
var _index = _interopRequireDefault(require("./index"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
it("renders", function () {
  var _renderWithProviders = (0, _testUtilities.renderWithProviders)(/*#__PURE__*/_react["default"].createElement(_index["default"], {
      content: "popover content"
    }, /*#__PURE__*/_react["default"].createElement(_typography.Text, null, "popover target"))),
    queryByText = _renderWithProviders.queryByText;
  expect(queryByText("popover target")).toBeVisible();
  expect(queryByText("popover content")).not.toBeInTheDocument();
});
it("hovers", function () {
  var _renderWithProviders2 = (0, _testUtilities.renderWithProviders)(/*#__PURE__*/_react["default"].createElement(_index["default"], {
      content: "popover content"
    }, /*#__PURE__*/_react["default"].createElement(_typography.Text, null, "popover target"))),
    queryByText = _renderWithProviders2.queryByText;
  _testUtilities.fireEvent.mouseOver(queryByText("popover target"));
  expect(queryByText("popover content")).toBeInTheDocument();
});
it("remains open on drop content hover", function () {
  var _renderWithProviders3 = (0, _testUtilities.renderWithProviders)(/*#__PURE__*/_react["default"].createElement(_index["default"], {
      content: "popover content"
    }, /*#__PURE__*/_react["default"].createElement(_typography.Text, null, "popover target"))),
    queryByText = _renderWithProviders3.queryByText;
  _testUtilities.fireEvent.mouseOver(queryByText("popover target"));
  _testUtilities.fireEvent.mouseOver(queryByText("popover content"));
  expect(queryByText("popover content")).toBeInTheDocument();
});
it("renders plain", function () {
  var _renderWithProviders4 = (0, _testUtilities.renderWithProviders)(/*#__PURE__*/_react["default"].createElement(_index["default"], {
      plain: true,
      content: "popover content"
    }, /*#__PURE__*/_react["default"].createElement(_typography.Text, null, "popover target"))),
    queryByTestId = _renderWithProviders4.queryByTestId,
    queryByText = _renderWithProviders4.queryByText;
  _testUtilities.fireEvent.mouseOver(queryByText("popover target"));
  expect(queryByTestId("drop")).toHaveTextContent("popover content");
});
it("renders content from function", function () {
  var _renderWithProviders5 = (0, _testUtilities.renderWithProviders)(/*#__PURE__*/_react["default"].createElement(_index["default"], {
      content: function content() {
        return "popover content";
      }
    }, function (props) {
      return /*#__PURE__*/_react["default"].createElement(_typography.Text, props, "popover target");
    })),
    queryByText = _renderWithProviders5.queryByText;
  _testUtilities.fireEvent.mouseOver(queryByText("popover target"));
  expect(queryByText("popover target")).toBeVisible();
  expect(queryByText("popover content")).toBeInTheDocument();
});
it("align", function () {
  var _renderWithProviders6 = (0, _testUtilities.renderWithProviders)(/*#__PURE__*/_react["default"].createElement(_index["default"], {
      content: "popover content"
    }, /*#__PURE__*/_react["default"].createElement(_typography.Text, null, "popover target"))),
    getByTestId = _renderWithProviders6.getByTestId,
    queryByText = _renderWithProviders6.queryByText,
    rerender = _renderWithProviders6.rerender;
  _testUtilities.fireEvent.mouseOver(queryByText("popover target"));
  expect(getByTestId("drop-arrow")).not.toHaveStyleRule("transform");
  rerender(/*#__PURE__*/_react["default"].createElement(_index["default"], {
    align: "right",
    content: "popover content"
  }, /*#__PURE__*/_react["default"].createElement(_typography.Text, null, "popover target")));
  expect(getByTestId("drop-arrow")).toHaveStyleRule("transform", "rotate(90deg)");
  rerender(/*#__PURE__*/_react["default"].createElement(_index["default"], {
    align: "bottom",
    content: "popover content"
  }, /*#__PURE__*/_react["default"].createElement(_typography.Text, null, "popover target")));
  expect(getByTestId("drop-arrow")).toHaveStyleRule("transform", "rotate(180deg)");
  rerender(/*#__PURE__*/_react["default"].createElement(_index["default"], {
    align: "left",
    content: "popover content"
  }, /*#__PURE__*/_react["default"].createElement(_typography.Text, null, "popover target")));
  expect(getByTestId("drop-arrow")).toHaveStyleRule("transform", "rotate(270deg)");
});