@netdata/charts/dist/components/anomalyIcon/index.test.js

Netdata frontend SDK and chart utilities

"use strict";

var _react = _interopRequireDefault(require("react"));
require("@testing-library/jest-dom");
var _testUtilities = require("@jest/testUtilities");
var _index = _interopRequireDefault(require("./index"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
describe("AnomalyIcon", function () {
  beforeEach(function () {
    // Clean up any previously injected svg containers
    var existingContainer = document.getElementById("netdata-sdk-svg");
    if (existingContainer) {
      existingContainer.remove();
    }
  });
  it("renders anomaly icon with tooltip", function () {
    var _renderWithChart = (0, _testUtilities.renderWithChart)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_index["default"], {})),
      container = _renderWithChart.container;

    // Check that the icon is rendered
    var icon = container.querySelector("svg");
    expect(icon).toBeInTheDocument();
  });
  it("displays tooltip on hover", function () {
    var _renderWithChart2 = (0, _testUtilities.renderWithChart)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_index["default"], {})),
      container = _renderWithChart2.container;

    // The Tooltip component wraps the icon
    expect(container.firstChild).toBeInTheDocument();
  });
  it("applies loading color to icon", function () {
    var _renderWithChart3 = (0, _testUtilities.renderWithChart)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_index["default"], {}), {
        attributes: {
          loading: true,
          fetchStartedAt: Date.now()
        }
      }),
      container = _renderWithChart3.container;
    var icon = container.querySelector("svg");
    // Default loading color is themeNeutralBackground
    expect(icon).toHaveAttribute("color", "themeNeutralBackground");
  });
  it("renders with custom props", function () {
    var _renderWithChart4 = (0, _testUtilities.renderWithChart)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_index["default"], {
        className: "custom-class",
        "data-test": "anomaly"
      })),
      container = _renderWithChart4.container;
    var icon = container.querySelector("svg");
    expect(icon).toHaveClass("custom-class");
    expect(icon).toHaveAttribute("data-test", "anomaly");
  });
  it("applies animation styles", function () {
    var _renderWithChart5 = (0, _testUtilities.renderWithChart)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_index["default"], {})),
      container = _renderWithChart5.container;
    var icon = container.querySelector("svg");

    // Check that the icon is styled (styled-components adds classes)
    expect(icon.tagName).toBe("svg");
    // The animation is applied via styled-components
    expect(icon).toHaveAttribute("width", "100%");
  });
  it("uses 100% width for icon", function () {
    var _renderWithChart6 = (0, _testUtilities.renderWithChart)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_index["default"], {})),
      container = _renderWithChart6.container;
    var icon = container.querySelector("svg");
    expect(icon).toHaveAttribute("width", "100%");
  });
});