solid-recharts 0.2.0 → 1.0.0

package/test/component/Tooltip/Tooltip.content.spec.tsx

@@ -1,128 +0,0 @@
-// Ported from recharts 3.8.1 test/component/Tooltip/Tooltip.content.spec.tsx.
-//
-// The function-form `content` receives the resolved tooltip prop bag; this spec
-// asserts on that bag at hover time. Harness adaptations: React render → Solid
-// render via createSelectorTestCase; `content` is called with a single argument
-// (no React ref), so the trailing `expect.any(Object)` ref is dropped.
-//
-// PERMANENT-N/A: "should be called and receive payload before any user
-// interactions" (asserts content is invoked with active:false / payload:[] BEFORE
-// any hover) — in the Solid port `content` is only rendered while the tooltip box
-// is mounted (active), so it is never called for the inactive state. The
-// `toHaveBeenCalledTimes(N)` assertions are render-count coupled and likewise
-// dropped (the prop-bag value is what carries the behavior).
-import { beforeEach, describe, expect, it, vi } from "vitest";
-import type { Mock } from "vitest";
-import { createSelectorTestCase } from "../../helper/createSelectorTestCase";
-import { PageData } from "../../_data";
-import { Area, AreaChart, Tooltip } from "../../../src";
-import type { TooltipContentProps } from "../../../src/component/Tooltip";
-import { showTooltip } from "./tooltipTestHelpers";
-import { areaChartMouseHoverTooltipSelector } from "./tooltipMouseHoverSelectors";
-import { mockGetBoundingClientRect } from "../../helper/mockGetBoundingClientRect";
-
-const commonChartProps = {
-  width: 400,
-  height: 400,
-};
-
-describe("Tooltip.content", () => {
-  const spy: Mock<(props: TooltipContentProps) => null> = vi.fn(() => null);
-
-  beforeEach(() => {
-    mockGetBoundingClientRect({ width: 100, height: 100 });
-    spy.mockClear();
-  });
-
-  const renderTestCase = createSelectorTestCase((props) => (
-    <AreaChart {...commonChartProps} data={PageData}>
-      <Area dataKey="uv" unit="kg" id="area-uv" />
-      <Area dataKey="pv" unit="$$$" name="My custom name" id="area-pv" />
-      <Area dataKey="amt" id="area-amt" />
-      <Tooltip content={spy} />
-      {props.children}
-    </AreaChart>
-  ));
-
-  it("should be called and receive payload on hover", () => {
-    const { container } = renderTestCase();
-    showTooltip(container, areaChartMouseHoverTooltipSelector);
-
-    // Assert on the first argument only: Solid's JSX runtime appends a resolver
-    // argument when a function child is materialized, which is not part of the
-    // recharts contract (React passes a ref as the 2nd arg, also dropped here).
-    expect(spy.mock.calls.at(-1)?.[0]).toEqual({
-      accessibilityLayer: true,
-      active: true,
-      activeIndex: "2",
-      allowEscapeViewBox: { x: false, y: false },
-      animationDuration: 400,
-      animationEasing: "ease",
-      axisId: 0,
-      content: spy,
-      contentStyle: {},
-      coordinate: { x: 161, y: 200 },
-      cursor: true,
-      filterNull: true,
-      includeHidden: false,
-      isAnimationActive: "auto",
-      itemSorter: "name",
-      itemStyle: {},
-      label: 2,
-      labelStyle: {},
-      offset: 10,
-      payload: [
-        {
-          color: "#3182bd",
-          dataKey: "uv",
-          fill: "#3182bd",
-          graphicalItemId: "area-uv",
-          hide: false,
-          name: "uv",
-          nameKey: undefined,
-          payload: { amt: 2400, name: "Page C", pv: 1398, uv: 300 },
-          stroke: "#3182bd",
-          strokeWidth: 1,
-          type: undefined,
-          unit: "kg",
-          value: 300,
-        },
-        {
-          color: "#3182bd",
-          dataKey: "pv",
-          fill: "#3182bd",
-          graphicalItemId: "area-pv",
-          hide: false,
-          name: "My custom name",
-          nameKey: undefined,
-          payload: { amt: 2400, name: "Page C", pv: 1398, uv: 300 },
-          stroke: "#3182bd",
-          strokeWidth: 1,
-          type: undefined,
-          unit: "$$$",
-          value: 1398,
-        },
-        {
-          color: "#3182bd",
-          dataKey: "amt",
-          fill: "#3182bd",
-          graphicalItemId: "area-amt",
-          hide: false,
-          name: "amt",
-          nameKey: undefined,
-          payload: { amt: 2400, name: "Page C", pv: 1398, uv: 300 },
-          stroke: "#3182bd",
-          strokeWidth: 1,
-          type: undefined,
-          unit: undefined,
-          value: 2400,
-        },
-      ],
-      reverseDirection: { x: false, y: false },
-      separator: " : ",
-      trigger: "hover",
-      useTranslate3d: false,
-      wrapperStyle: {},
-    });
-  });
-});

package/test/component/Tooltip/Tooltip.formatter.spec.tsx

@@ -1,152 +0,0 @@
-import { describe, it, beforeEach } from "vitest";
-import { BarChart, YAxis, XAxis, Tooltip, Bar } from "../../../src";
-import { PageData } from "../../_data";
-import { expectTooltipNotVisible, expectTooltipPayload, showTooltip } from "./tooltipTestHelpers";
-import { barChartMouseHoverTooltipSelector } from "./tooltipMouseHoverSelectors";
-import { mockGetBoundingClientRect } from "../../helper/mockGetBoundingClientRect";
-import { createSelectorTestCase } from "../../helper/createSelectorTestCase";
-import { selectTooltipPayload } from "../../../src/state/selectors/tooltipSelectors";
-import { expectLastCalledWith } from "../../helper/expectLastCalledWith";
-
-/*
- * Ported from recharts 3.8.1 test/component/Tooltip/Tooltip.formatter.spec.tsx
- * (reproducing https://github.com/recharts/recharts/issues/5658). Validates the
- * Solid-adapted tooltip test helpers (showTooltip/expectTooltipPayload via
- * mouseMove + flush). selectTooltipPayload is imported from this port's
- * tooltipSelectors (recharts re-exports it from selectors).
- */
-
-describe("Tooltip.formatter reproducing https://github.com/recharts/recharts/issues/5658", () => {
-  beforeEach(() => {
-    mockGetBoundingClientRect({ width: 100, height: 100 });
-  });
-  const dataKeyAsFunction = (x: any) => x.pv;
-
-  describe("with a name prop", () => {
-    const renderTestCase = createSelectorTestCase((props) => (
-      <BarChart
-        width={500}
-        height={300}
-        data={PageData}
-        margin={{ top: 5, right: 30, left: 20, bottom: 5 }}
-      >
-        <XAxis dataKey="name" />
-        <YAxis />
-        <Tooltip formatter={() => "FORMATTED"} />
-        <Bar dataKey={dataKeyAsFunction} name="ultraviolet" fill="#8884d8" id="bar-with-function" />
-        <Bar dataKey="pv" fill="#8ff4d8" id="bar-pv" />
-        {props.children}
-      </BarChart>
-    ));
-
-    it("should render inside tooltip value what the formatter returned", () => {
-      const { container } = renderTestCase();
-
-      expectTooltipNotVisible(container);
-
-      showTooltip(container, barChartMouseHoverTooltipSelector);
-
-      expectTooltipPayload(container, "Page B", ["pv : FORMATTED", "ultraviolet : FORMATTED"]);
-    });
-
-    it("should select payload", () => {
-      const { spy } = renderTestCase((state) => selectTooltipPayload(state, "axis", "hover", "1"));
-      expectLastCalledWith(spy, [
-        {
-          color: "#8884d8",
-          dataKey: dataKeyAsFunction,
-          fill: "#8884d8",
-          graphicalItemId: "bar-with-function",
-          hide: false,
-          name: "ultraviolet",
-          nameKey: undefined,
-          payload: { amt: 2400, name: "Page B", pv: 4567, uv: 300 },
-          stroke: undefined,
-          strokeWidth: undefined,
-          type: undefined,
-          unit: undefined,
-          value: 4567,
-        },
-        {
-          color: "#8ff4d8",
-          dataKey: "pv",
-          fill: "#8ff4d8",
-          graphicalItemId: "bar-pv",
-          hide: false,
-          name: "pv",
-          nameKey: undefined,
-          payload: { amt: 2400, name: "Page B", pv: 4567, uv: 300 },
-          stroke: undefined,
-          strokeWidth: undefined,
-          type: undefined,
-          unit: undefined,
-          value: 4567,
-        },
-      ]);
-    });
-  });
-
-  describe("without name prop", () => {
-    const renderTestCase = createSelectorTestCase((props) => (
-      <BarChart
-        width={500}
-        height={300}
-        data={PageData}
-        margin={{ top: 5, right: 30, left: 20, bottom: 5 }}
-      >
-        <XAxis dataKey="name" />
-        <YAxis />
-        <Tooltip formatter={() => "FORMATTED"} />
-        <Bar dataKey={dataKeyAsFunction} fill="#8884d8" id="bar-with-function" />
-        <Bar dataKey="pv" fill="#8ff4d8" id="bar-pv" />
-        {props.children}
-      </BarChart>
-    ));
-
-    it("should render inside tooltip value what the formatter returned", () => {
-      const { container } = renderTestCase();
-
-      expectTooltipNotVisible(container);
-
-      showTooltip(container, barChartMouseHoverTooltipSelector);
-
-      expectTooltipPayload(container, "Page B", ["pv : FORMATTED", "FORMATTED"]);
-    });
-
-    it("should select payload", () => {
-      const { spy } = renderTestCase((state) => selectTooltipPayload(state, "axis", "hover", "1"));
-      expectLastCalledWith(spy, [
-        {
-          color: "#8884d8",
-          dataKey: dataKeyAsFunction,
-          fill: "#8884d8",
-          hide: false,
-          name: undefined,
-          nameKey: undefined,
-          payload: { amt: 2400, name: "Page B", pv: 4567, uv: 300 },
-          stroke: undefined,
-          strokeWidth: undefined,
-          type: undefined,
-          unit: undefined,
-          value: 4567,
-          graphicalItemId: "bar-with-function",
-        },
-        {
-          color: "#8ff4d8",
-          dataKey: "pv",
-          fill: "#8ff4d8",
-          hide: false,
-          name: "pv",
-          nameKey: undefined,
-          payload: { amt: 2400, name: "Page B", pv: 4567, uv: 300 },
-          stroke: undefined,
-          strokeWidth: undefined,
-          type: undefined,
-          unit: undefined,
-          value: 4567,
-          graphicalItemId: "bar-pv",
-        },
-      ]);
-    });
-  });
-});

package/test/component/Tooltip/Tooltip.includeHidden.spec.tsx

@@ -1,79 +0,0 @@
-import { describe, it } from "vitest";
-import { Area, Bar, ComposedChart, Line, Scatter, Tooltip, XAxis, YAxis } from "../../../src";
-import { PageData } from "../../_data";
-import { createSelectorTestCase } from "../../helper/createSelectorTestCase";
-import { expectTooltipNotVisible, expectTooltipPayload, showTooltip } from "./tooltipTestHelpers";
-import { composedChartMouseHoverTooltipSelector } from "./tooltipMouseHoverSelectors";
-import { mockGetBoundingClientRect } from "../../helper/mockGetBoundingClientRect";
-
-/*
- * Ported from recharts 3.8.1 test/component/Tooltip/Tooltip.visibility.spec.tsx
- * "includeHidden prop" block — the two rendered-text behavioral assertions.
- * The block's many selector-shape tests (selectTooltipAxis settings shape, etc.)
- * are omitted (brittle vs this port's settings shape); these two cover the actual
- * includeHidden behaviour: with `includeHidden`, hidden series still appear in the
- * tooltip; without it, only visible series do.
- */
-
-describe("Tooltip includeHidden prop", () => {
-  describe("when includeHidden = true", () => {
-    const renderTestCase = createSelectorTestCase((props) => (
-      <ComposedChart width={400} height={400} data={PageData}>
-        <Area dataKey="uv" hide name="1" />
-        <Bar dataKey="pv" hide name="2" />
-        <Line dataKey="amt" hide name="3" />
-        <Scatter dataKey="uv" hide name="4" />
-        <Line dataKey="pv" name="5" />
-        <XAxis type="number" dataKey="amt" name="stature" unit="cm" />
-        <YAxis type="number" dataKey="pv" name="weight" unit="kg" />
-        <Tooltip includeHidden />
-        {props.children}
-      </ComposedChart>
-    ));
-
-    it("should render tooltip payload for hidden items", () => {
-      mockGetBoundingClientRect({ width: 100, height: 100 });
-      const { container } = renderTestCase();
-
-      expectTooltipNotVisible(container);
-
-      showTooltip(container, composedChartMouseHoverTooltipSelector);
-
-      expectTooltipPayload(container, "2400", [
-        "1 : 400",
-        "2 : 2400",
-        "3 : 2400",
-        "5 : 2400",
-        "stature : 2400cm",
-        "weight : 2400kg",
-      ]);
-    });
-  });
-
-  describe("when includeHidden = false", () => {
-    const renderTestCase = createSelectorTestCase((props) => (
-      <ComposedChart width={400} height={400} data={PageData}>
-        <Area dataKey="uv" hide name="1" />
-        <Bar dataKey="pv" hide name="2" />
-        <Line dataKey="amt" hide name="3" />
-        <Scatter dataKey="uv" hide name="4" />
-        <Line dataKey="pv" name="5" />
-        <XAxis type="number" dataKey="amt" name="stature" unit="cm" />
-        <YAxis type="number" dataKey="pv" name="weight" unit="kg" />
-        <Tooltip includeHidden={false} />
-        {props.children}
-      </ComposedChart>
-    ));
-
-    it("should hide tooltip for hidden items", () => {
-      mockGetBoundingClientRect({ width: 100, height: 100 });
-      const { container } = renderTestCase();
-
-      expectTooltipNotVisible(container);
-
-      showTooltip(container, composedChartMouseHoverTooltipSelector);
-
-      expectTooltipPayload(container, "2400", ["5 : 2400"]);
-    });
-  });
-});

package/test/component/Tooltip/Tooltip.multipleDataArrays.spec.tsx

@@ -1,165 +0,0 @@
-import { describe, it, expect, beforeEach } from "vitest";
-import { createSelectorTestCase } from "../../helper/createSelectorTestCase";
-import { ComposedChart, Legend, Line, Tooltip, XAxis, YAxis } from "../../../src";
-import {
-  selectAxisScale,
-  selectCartesianGraphicalItemsData,
-  selectDisplayedData,
-} from "../../../src/state/selectors/axisSelectors";
-import { selectActiveTooltipIndex } from "../../../src/state/selectors/tooltipSelectors";
-import { showTooltipOnCoordinate } from "./tooltipTestHelpers";
-import { composedChartMouseHoverTooltipSelector } from "./tooltipMouseHoverSelectors";
-import { mockGetBoundingClientRect } from "../../helper/mockGetBoundingClientRect";
-import { expectLastCalledWith } from "../../helper/expectLastCalledWith";
-import { expectLastCalledWithScale } from "../../helper/expectScale";
-import { expectLines } from "../../helper/expectLine";
-import { assertNotNull } from "../../helper/assertNotNull";
-
-/*
- * Ported from recharts 3.8.1 test/component/Tooltip/Tooltip.multipleDataArrays.spec.tsx
- * (reproducing https://github.com/recharts/recharts/issues/3044 — two <Line>s each
- * with their own `data`). Ported the robust, soup-free selector value assertions
- * (combined item data, displayed data, golden scale + scale.map) plus the
- * active-index hover/defaultIndex tests. Solid deviations: selectors return
- * Accessors spied via createSelectorTestCase, so exact React render-count
- * assertions (toHaveBeenCalledTimes) are relaxed to value parity
- * (expectLastCalledWith); the `toBeRechartsScale` custom matcher is replaced by
- * expectLastCalledWithScale. Omitted: `should select activeTooltipDataPoints` —
- * its load-bearing by-reference identity assertion (data points must be `===` the
- * original input rows, which recharts' Redux store preserves) cannot hold in this
- * port because state flows through Solid store proxies, not plain objects.
- */
-
-describe("Tooltip in chart with multiple data arrays", () => {
-  beforeEach(() => {
-    mockGetBoundingClientRect({ width: 100, height: 100 });
-  });
-
-  const data1 = [
-    { xAxis: 10, y1: 4 },
-    { xAxis: 20, y1: 10 },
-    { xAxis: 30, y1: 6 },
-    { xAxis: 40, y1: 8 },
-  ];
-
-  const data2 = [
-    { xAxis: 5, y2: 9 },
-    { xAxis: 12, y2: 7 },
-    { xAxis: 13, y2: 8 },
-    { xAxis: 18, y2: 12 },
-    { xAxis: 25, y2: 12 },
-    { xAxis: 30, y2: 12 },
-  ];
-
-  describe("with default props", () => {
-    const renderTestCase = createSelectorTestCase((props) => (
-      <ComposedChart width={500} height={300}>
-        <XAxis dataKey="xAxis" type="number" />
-        <YAxis />
-        <Tooltip />
-        <Legend />
-        <Line dataKey="y1" data={data1} isAnimationActive={false} />
-        <Line dataKey="y2" data={data2} isAnimationActive={false} />
-        {props.children}
-      </ComposedChart>
-    ));
-
-    it("should render two lines", () => {
-      const { container } = renderTestCase();
-      expectLines(container, [
-        { d: "M172.5,111.667L280,31.667L387.5,85L495,58.333" },
-        { d: "M118.75,45L194,71.667L204.75,58.333L258.5,5L333.75,5L387.5,5" },
-      ]);
-    });
-
-    it("should select individual items data", () => {
-      const { spy } = renderTestCase((state) =>
-        selectCartesianGraphicalItemsData(state, "xAxis", 0),
-      );
-
-      expectLastCalledWith(spy, [
-        { xAxis: 10, y1: 4 },
-        { xAxis: 20, y1: 10 },
-        { xAxis: 30, y1: 6 },
-        { xAxis: 40, y1: 8 },
-        { xAxis: 5, y2: 9 },
-        { xAxis: 12, y2: 7 },
-        { xAxis: 13, y2: 8 },
-        { xAxis: 18, y2: 12 },
-        { xAxis: 25, y2: 12 },
-        { xAxis: 30, y2: 12 },
-      ]);
-    });
-
-    it("should select displayed data", () => {
-      const { spy } = renderTestCase((state) => selectDisplayedData(state, "xAxis", 0, false));
-
-      expectLastCalledWith(spy, [
-        { xAxis: 10, y1: 4 },
-        { xAxis: 20, y1: 10 },
-        { xAxis: 30, y1: 6 },
-        { xAxis: 40, y1: 8 },
-        { xAxis: 5, y2: 9 },
-        { xAxis: 12, y2: 7 },
-        { xAxis: 13, y2: 8 },
-        { xAxis: 18, y2: 12 },
-        { xAxis: 25, y2: 12 },
-        { xAxis: 30, y2: 12 },
-      ]);
-    });
-
-    it("should select scale", () => {
-      const { spy } = renderTestCase((state) => selectAxisScale(state, "xAxis", 0, false));
-
-      expectLastCalledWithScale(spy, { domain: [0, 40], range: [65, 495] });
-      const scale = spy.mock.lastCall?.[0];
-      assertNotNull(scale);
-      expect(scale.map(5)).toBe(118.75);
-      expect(scale.map(30)).toBe(387.5);
-      expect(scale.map(40)).toBe(495);
-    });
-
-    it("should highlight the first dot when hovering the first xaxis tick", () => {
-      const { container, spy } = renderTestCase(selectActiveTooltipIndex);
-      expectLastCalledWith(spy, null);
-
-      showTooltipOnCoordinate(container, composedChartMouseHoverTooltipSelector, {
-        clientX: 118.75,
-        clientY: 100,
-      });
-      // this is 4 because the tick is at xAxis=5 which is the fifth point in the displayedData array
-      expectLastCalledWith(spy, "4");
-    });
-
-    it("should highlight the last dot when hovering the last xaxis tick", () => {
-      const { container, spy } = renderTestCase(selectActiveTooltipIndex);
-      expectLastCalledWith(spy, null);
-
-      showTooltipOnCoordinate(container, composedChartMouseHoverTooltipSelector, {
-        clientX: 495,
-        clientY: 100,
-      });
-      // this is 3 because the tick is at xAxis=40 which is the fourth point in the displayedData array
-      expectLastCalledWith(spy, "3");
-    });
-  });
-
-  describe("with defaultIndex=0", () => {
-    const renderTestCase = createSelectorTestCase((props) => (
-      <ComposedChart width={500} height={300}>
-        <XAxis dataKey="xAxis" type="number" />
-        <YAxis />
-        <Tooltip defaultIndex={0} />
-        <Legend />
-        <Line dataKey="y1" data={data1} isAnimationActive={false} />
-        <Line dataKey="y2" data={data2} isAnimationActive={false} />
-        {props.children}
-      </ComposedChart>
-    ));
-
-    it("should highlight the first dot", () => {
-      const { spy } = renderTestCase(selectActiveTooltipIndex);
-      expectLastCalledWith(spy, "0");
-    });
-  });
-});

package/test/component/Tooltip/Tooltip.offset.spec.tsx

@@ -1,113 +0,0 @@
-import { describe, it, beforeEach } from "vitest";
-import type { ComponentProps } from "solid-js";
-import { createSelectorTestCase } from "../../helper/createSelectorTestCase";
-import { Line, LineChart, Tooltip } from "../../../src";
-import { expectTooltipCoordinate, showTooltipOnCoordinate } from "./tooltipTestHelpers";
-import { lineChartMouseHoverTooltipSelector } from "./tooltipMouseHoverSelectors";
-import { mockGetBoundingClientRect } from "../../helper/mockGetBoundingClientRect";
-
-/* Ported from recharts 3.8.1 test/component/Tooltip/Tooltip.offset.spec.tsx. */
-
-describe("Tooltip offset", () => {
-  beforeEach(() => {
-    mockGetBoundingClientRect({ width: 10, height: 10 });
-  });
-
-  const renderTestCase = (offset: ComponentProps<typeof Tooltip>["offset"]) =>
-    createSelectorTestCase((props) => (
-      <LineChart
-        width={100}
-        height={100}
-        data={[
-          { name: "A", value: 1 },
-          { name: "B", value: 1 },
-          { name: "C", value: 1 },
-        ]}
-        margin={{ top: 0, right: 0, bottom: 0, left: 0 }}
-      >
-        <Line dataKey="value" />
-        {props.children}
-        <Tooltip offset={offset} />
-      </LineChart>
-    ))();
-
-  describe("with number offset", () => {
-    it("should position tooltip at { x: 10, y: 30 } with default offset (10)", () => {
-      const { container } = renderTestCase(10);
-      showTooltipOnCoordinate(container, lineChartMouseHoverTooltipSelector, {
-        clientX: 20,
-        clientY: 20,
-      });
-      /*
-       * Data points: A(x=0), B(x=50), C(x=100) with width=100, margin=0
-       * Mouse at (20, 20) is closest to point A at x=0
-       * tooltipX = 0 + offset(10) = 10
-       * tooltipY = 20 + offset(10) = 30
-       */
-      expectTooltipCoordinate(container, { x: 10, y: 30 });
-    });
-
-    it("should position tooltip at { x: 20, y: 40 } with offset=20", () => {
-      const { container } = renderTestCase(20);
-      showTooltipOnCoordinate(container, lineChartMouseHoverTooltipSelector, {
-        clientX: 20,
-        clientY: 20,
-      });
-      expectTooltipCoordinate(container, { x: 20, y: 40 });
-    });
-
-    it("should position tooltip at { x: 0, y: 20 } with offset=0", () => {
-      const { container } = renderTestCase(0);
-      showTooltipOnCoordinate(container, lineChartMouseHoverTooltipSelector, {
-        clientX: 20,
-        clientY: 20,
-      });
-      expectTooltipCoordinate(container, { x: 0, y: 20 });
-    });
-  });
-
-  describe("with Coordinate offset (different x and y)", () => {
-    it("should position tooltip at { x: 10, y: 50 } with offset={ x: 10, y: 30 }", () => {
-      const { container } = renderTestCase({ x: 10, y: 30 });
-      showTooltipOnCoordinate(container, lineChartMouseHoverTooltipSelector, {
-        clientX: 20,
-        clientY: 20,
-      });
-      expectTooltipCoordinate(container, { x: 10, y: 50 });
-    });
-
-    it("should position tooltip at { x: 0, y: 30 } with offset={ x: 0, y: 10 }", () => {
-      const { container } = renderTestCase({ x: 0, y: 10 });
-      showTooltipOnCoordinate(container, lineChartMouseHoverTooltipSelector, {
-        clientX: 20,
-        clientY: 20,
-      });
-      expectTooltipCoordinate(container, { x: 0, y: 30 });
-    });
-
-    it("should position tooltip at { x: 10, y: 20 } with offset={ x: 10, y: 0 }", () => {
-      const { container } = renderTestCase({ x: 10, y: 0 });
-      showTooltipOnCoordinate(container, lineChartMouseHoverTooltipSelector, {
-        clientX: 20,
-        clientY: 20,
-      });
-      expectTooltipCoordinate(container, { x: 10, y: 20 });
-    });
-  });
-
-  describe("with negative offset value", () => {
-    it("should position tooltip at { x: 45, y: 35 } with offset={ x: -5, y: 15 }", () => {
-      const { container } = renderTestCase({ x: -5, y: 15 });
-      showTooltipOnCoordinate(container, lineChartMouseHoverTooltipSelector, {
-        clientX: 50,
-        clientY: 20,
-      });
-      /*
-       * Mouse at (50, 20) is closest to point B at x=50
-       * tooltipX = 50 + offset(-5) = 45
-       * tooltipY = 20 + offset(15) = 35
-       */
-      expectTooltipCoordinate(container, { x: 45, y: 35 });
-    });
-  });
-});