@netdata/charts
Version:
Netdata frontend SDK and chart utilities
118 lines • 4.9 kB
JavaScript
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
import React from "react";
import { render, screen } from "@testing-library/react";
import "@testing-library/jest-dom";
import HeadlessChart from "./index";
import makeDefaultSDK from "../../makeDefaultSDK";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
describe("HeadlessChart", function () {
it("renders children components", function () {
var sdk = makeDefaultSDK();
render(/*#__PURE__*/_jsx(HeadlessChart, {
sdk: sdk,
contextScope: ["system.load"],
agent: true,
children: /*#__PURE__*/_jsx("div", {
"data-testid": "child",
children: "Child Component"
})
}));
expect(screen.getByTestId("child")).toBeInTheDocument();
});
it("provides chart data via render prop", function () {
var sdk = makeDefaultSDK();
render(/*#__PURE__*/_jsx(HeadlessChart, {
sdk: sdk,
contextScope: ["system.load"],
agent: true,
children: function children(_ref) {
var data = _ref.data,
helpers = _ref.helpers,
chart = _ref.chart,
state = _ref.state;
return /*#__PURE__*/_jsxs("div", {
"data-testid": "render-prop",
children: [/*#__PURE__*/_jsx("div", {
"data-testid": "helpers",
children: typeof helpers.getDimensionIds === "function" ? "has helpers" : "no helpers"
}), /*#__PURE__*/_jsx("div", {
"data-testid": "chart",
children: chart ? "has chart" : "no chart"
}), /*#__PURE__*/_jsx("div", {
"data-testid": "data",
children: Array.isArray(data) ? "has data" : "no data"
}), /*#__PURE__*/_jsx("div", {
"data-testid": "state",
children: _typeof(state) === "object" ? "has state" : "no state"
})]
});
}
}));
expect(screen.getByTestId("render-prop")).toBeInTheDocument();
expect(screen.getByTestId("helpers")).toHaveTextContent("has helpers");
expect(screen.getByTestId("chart")).toHaveTextContent("has chart");
expect(screen.getByTestId("data")).toHaveTextContent("has data");
expect(screen.getByTestId("state")).toHaveTextContent("has state");
});
it("creates chart with provided SDK", function () {
var sdk = makeDefaultSDK();
var createChartSpy = jest.spyOn(sdk, "makeChart");
render(/*#__PURE__*/_jsx(HeadlessChart, {
sdk: sdk,
contextScope: ["system.load"],
agent: true,
host: "http://localhost:19999/api/v3",
children: /*#__PURE__*/_jsx("div", {
children: "Test"
})
}));
expect(createChartSpy).toHaveBeenCalledWith({
attributes: {
contextScope: ["system.load"],
agent: true,
host: "http://localhost:19999/api/v3"
}
});
});
it("creates default SDK when none provided", function () {
render(/*#__PURE__*/_jsx(HeadlessChart, {
contextScope: ["system.load"],
agent: true,
children: /*#__PURE__*/_jsx("div", {
"data-testid": "default-sdk",
children: "Default SDK"
})
}));
expect(screen.getByTestId("default-sdk")).toBeInTheDocument();
});
it("provides helper functions in render prop", function () {
var sdk = makeDefaultSDK();
render(/*#__PURE__*/_jsx(HeadlessChart, {
sdk: sdk,
contextScope: ["system.load"],
agent: true,
children: function children(_ref2) {
var helpers = _ref2.helpers;
return /*#__PURE__*/_jsxs("div", {
children: [/*#__PURE__*/_jsx("div", {
"data-testid": "update-attribute",
children: typeof helpers.updateAttribute === "function" ? "function" : "not function"
}), /*#__PURE__*/_jsx("div", {
"data-testid": "get-attribute",
children: typeof helpers.getAttribute === "function" ? "function" : "not function"
}), /*#__PURE__*/_jsx("div", {
"data-testid": "get-dimension-ids",
children: typeof helpers.getDimensionIds === "function" ? "function" : "not function"
}), /*#__PURE__*/_jsx("div", {
"data-testid": "format-time",
children: typeof helpers.formatTime === "function" ? "function" : "not function"
})]
});
}
}));
expect(screen.getByTestId("update-attribute")).toHaveTextContent("function");
expect(screen.getByTestId("get-attribute")).toHaveTextContent("function");
expect(screen.getByTestId("get-dimension-ids")).toHaveTextContent("function");
expect(screen.getByTestId("format-time")).toHaveTextContent("function");
});
});