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

Netdata frontend SDK and chart utilities

import React from "react";
import "@testing-library/jest-dom";
import { renderWithChart } from "@jest/testUtilities";
import AnomalyIcon from "./index";
import { jsx as _jsx } from "react/jsx-runtime";
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 = renderWithChart(/*#__PURE__*/_jsx(AnomalyIcon, {})),
      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 = renderWithChart(/*#__PURE__*/_jsx(AnomalyIcon, {})),
      container = _renderWithChart2.container;

    // The Tooltip component wraps the icon
    expect(container.firstChild).toBeInTheDocument();
  });
  it("applies loading color to icon", function () {
    var _renderWithChart3 = renderWithChart(/*#__PURE__*/_jsx(AnomalyIcon, {}), {
        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 = renderWithChart(/*#__PURE__*/_jsx(AnomalyIcon, {
        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 = renderWithChart(/*#__PURE__*/_jsx(AnomalyIcon, {})),
      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 = renderWithChart(/*#__PURE__*/_jsx(AnomalyIcon, {})),
      container = _renderWithChart6.container;
    var icon = container.querySelector("svg");
    expect(icon).toHaveAttribute("width", "100%");
  });
});