@netdata/charts/dist/es6/chartLibraries/dygraph/overlays/highlight.test.js

Netdata frontend SDK and chart utilities

import React from "react";
import { renderWithChart } from "@jest/testUtilities";
import highlight from "./highlight";
import { jsx as _jsx } from "react/jsx-runtime";
var mockDygraph = {
  getArea: function getArea() {
    return {
      h: 100
    };
  },
  hidden_ctx_: {
    save: jest.fn(),
    beginPath: jest.fn(),
    rect: jest.fn(),
    fill: jest.fn(),
    setLineDash: jest.fn(),
    stroke: jest.fn(),
    closePath: jest.fn(),
    restore: jest.fn(),
    fillStyle: "",
    lineWidth: 0,
    strokeStyle: ""
  }
};
jest.mock("./helpers", function () {
  return {
    trigger: jest.fn(),
    getArea: jest.fn(function () {
      return {
        from: 50,
        width: 100
      };
    })
  };
});
describe("highlight overlay", function () {
  var chartUI;
  beforeEach(function () {
    var _renderWithChart = renderWithChart(/*#__PURE__*/_jsx("div", {}), {
        chartType: "line"
      }),
      chart = _renderWithChart.chart;
    chart.getAttribute = function () {
      return {
        "test-highlight": {
          range: [1000, 2000]
        }
      };
    };
    chartUI = {
      chart: chart,
      getDygraph: function getDygraph() {
        return mockDygraph;
      }
    };
    jest.clearAllMocks();
  });
  it("renders highlight overlay when range is provided", function () {
    highlight(chartUI, "test-highlight");
    expect(mockDygraph.hidden_ctx_.save).toHaveBeenCalled();
    expect(mockDygraph.hidden_ctx_.beginPath).toHaveBeenCalled();
    expect(mockDygraph.hidden_ctx_.rect).toHaveBeenCalled();
    expect(mockDygraph.hidden_ctx_.fill).toHaveBeenCalled();
    expect(mockDygraph.hidden_ctx_.restore).toHaveBeenCalled();
  });
  it("applies correct styling", function () {
    highlight(chartUI, "test-highlight");
    expect(mockDygraph.hidden_ctx_.fillStyle).toBe("rgba(207, 213, 218, 0.12)");
    expect(mockDygraph.hidden_ctx_.lineWidth).toBe(1);
    expect(mockDygraph.hidden_ctx_.strokeStyle).toBe("#CFD5DA");
  });
  it("handles missing range gracefully", function () {
    chartUI.chart.getAttribute = function () {
      return {
        "test-highlight": {}
      };
    };
    highlight(chartUI, "test-highlight");
    expect(mockDygraph.hidden_ctx_.save).not.toHaveBeenCalled();
  });
});