@netdata/charts/dist/es6/mount.test.js

Netdata frontend SDK and chart utilities

import React from "react";
import { createRoot } from "react-dom/client";
import mount from "./mount";
import Line from "./components/line";
import { jsx as _jsx } from "react/jsx-runtime";
jest.mock("react-dom/client");
jest.mock("./components/line");
describe("mount", function () {
  var mockRoot;
  var mockChart;
  var mockElement;
  beforeEach(function () {
    mockRoot = {
      render: jest.fn()
    };
    createRoot.mockReturnValue(mockRoot);
    mockChart = {
      getId: jest.fn(function () {
        return "test-chart-id";
      }),
      getAttribute: jest.fn()
    };
    mockElement = document.createElement("div");
    Line.mockReturnValue(/*#__PURE__*/_jsx("div", {
      children: "Mocked Line Component"
    }));
  });
  afterEach(function () {
    jest.clearAllMocks();
  });
  it("creates React root with provided element", function () {
    mount(mockChart, mockElement);
    expect(createRoot).toHaveBeenCalledWith(mockElement);
  });
  it("renders Line component with chart prop wrapped in ThemeProvider", function () {
    mount(mockChart, mockElement);
    expect(mockRoot.render).toHaveBeenCalledWith(expect.objectContaining({
      type: expect.any(Function),
      props: expect.objectContaining({
        theme: expect.any(Object),
        children: expect.objectContaining({
          type: Line,
          props: {
            chart: mockChart
          }
        })
      })
    }));
  });
  it("uses DefaultTheme from netdata-ui", function () {
    mount(mockChart, mockElement);
    var renderCall = mockRoot.render.mock.calls[0][0];
    expect(renderCall.props.theme).toBeDefined();
  });
  it("handles different chart instances", function () {
    var anotherChart = {
      getId: jest.fn(function () {
        return "another-chart";
      }),
      getAttribute: jest.fn()
    };
    mount(anotherChart, mockElement);
    expect(mockRoot.render).toHaveBeenCalledWith(expect.objectContaining({
      props: expect.objectContaining({
        children: expect.objectContaining({
          props: {
            chart: anotherChart
          }
        })
      })
    }));
  });
  it("handles different DOM elements", function () {
    var anotherElement = document.createElement("section");
    mount(mockChart, anotherElement);
    expect(createRoot).toHaveBeenCalledWith(anotherElement);
  });
});