test/chart/Treemap.spec.tsx (2)

11-11: Unnecessary import in this test.

The mockTouchingElement helper is imported but not meaningfully used in the new test. The test directly fires touchMove on a DOM element without relying on document.elementFromPoint, which is what mockTouchingElement sets up.

---

741-764: Complete the test coverage for both touch event handlers.

The test defines both onTouchMove and onTouchEnd mocks but only verifies that onTouchMove is not called. For completeness, the test should also verify that onTouchEnd is not called.

Additionally, the mockTouchingElement call on line 742 is not needed since the test directly fires events on DOM elements without using document.elementFromPoint.

Apply this diff to improve test coverage and remove unnecessary setup:

   it('should not call touch event handlers', () => {
-    mockTouchingElement('0', 'size');
     const onTouchMove = vi.fn();
     const onTouchEnd = vi.fn();
     const { container } = render(
       <Treemap
         width={500}
         height={250}
         data={data}
         nameKey="name"
         dataKey="size"
         // @ts-expect-error typescript is correct here - indeed Treemap does not fire touch events. It shows Tooltip internally but doesn't allow external handlers
         onTouchMove={onTouchMove}
         onTouchEnd={onTouchEnd}
         isAnimationActive={false}
       />,
     );
 
     const firstNode = container.querySelectorAll('.recharts-treemap-depth-1 g')[0];
     expect(firstNode).toBeInTheDocument();
 
     fireEvent.touchMove(firstNode, { touches: [{ clientX: 200, clientY: 200 }] });
     expect(onTouchMove).toHaveBeenCalledTimes(0);
+    
+    fireEvent.touchEnd(firstNode);
+    expect(onTouchEnd).toHaveBeenCalledTimes(0);
   });

test/polar/RadialBar.spec.tsx (1)

1214-1267: Test the onTouchEnd handler for complete coverage.

The test sets up onTouchEnd (line 1216) and passes it to the component (line 1226), but never invokes or asserts it. For consistency with the mouse event test approach and to achieve complete coverage, add a fireEvent.touchEnd call and validation.

Add after line 1266:

+
+    fireEvent.touchEnd(sector, { touches: [{ clientX: 200, clientY: 200 }] });
+    expect(onTouchEnd).toHaveBeenCalledTimes(1);
+    expectLastCalledWith(
+      onTouchEnd,
+      {
+        name: 'Page A',
+        uv: 400,
+        pv: 2400,
+        amt: 2400,
+        background: {
+          cx: 250,
+          cy: 250,
+          innerRadius: 3.266666666666666,
+          outerRadius: 29.266666666666666,
+          startAngle: 0,
+          endAngle: 360,
+        },
+        payload: {
+          name: 'Page A',
+          uv: 400,
+          pv: 2400,
+          amt: 2400,
+        },
+        value: 2400,
+        cx: 250,
+        cy: 250,
+        innerRadius: 3.266666666666666,
+        outerRadius: 29.266666666666666,
+        startAngle: 0,
+        endAngle: 360,
+      },
+      0,
+      expect.any(Object),
+    );

test/polar/Radar.spec.tsx (1)

139-260: Consider extracting large test fixture to test/_data.ts.

The points array is ~120 lines of inline test data. Extracting it to test/_data.ts (alongside exampleRadarData) would improve readability and enable reuse if other tests need this fixture.

test/chart/SunburstChart.spec.tsx (2)

49-99: Consider extracting the duplicate payload structure to improve maintainability.

The same payload object (with name, fill, value, children, tooltipIndex) is repeated three times in this test. Extracting it to a constant would reduce duplication and make the test easier to maintain if the data structure changes.

Example refactor:

+  const expectedChild1Payload = {
+    name: 'Child1',
+    fill: '#264653',
+    value: 30,
+    children: [
+      {
+        name: 'third child',
+        value: 10,
+      },
+    ],
+    tooltipIndex: '[0]',
+  };
+
   await user.hover(sector);
   expect(onMouseEnter).toHaveBeenCalled();
   expectLastCalledWith(
     onMouseEnter,
-    {
-      name: 'Child1',
-      fill: '#264653',
-      value: 30,
-      children: [
-        {
-          name: 'third child',
-          value: 10,
-        },
-      ],
-      tooltipIndex: '[0]',
-    },
+    expectedChild1Payload,
     expect.any(Object),
   );

   await user.unhover(sector);
   expect(onMouseLeave).toHaveBeenCalled();
   expectLastCalledWith(
     onMouseLeave,
-    {
-      name: 'Child1',
-      fill: '#264653',
-      value: 30,
-      children: [
-        {
-          name: 'third child',
-          value: 10,
-        },
-      ],
-      tooltipIndex: '[0]',
-    },
+    expectedChild1Payload,
     expect.any(Object),
   );

   await user.click(sector);
   expect(onClick).toHaveBeenCalled();
   // click doesn't add the original event, not sure why?
-  expectLastCalledWith(onClick, {
-    name: 'Child1',
-    fill: '#264653',
-    value: 30,
-    children: [
-      {
-        name: 'third child',
-        value: 10,
-      },
-    ],
-    tooltipIndex: '[0]',
-  });
+  expectLastCalledWith(onClick, expectedChild1Payload);

---

102-120: Consider testing onTouchEnd or removing the unused setup.

The test sets up onTouchEnd at line 104 and passes it to the component at line 112, but never fires a touch end event or verifies it wasn't called. Since the test validates that touch event callbacks are not fired, either add a fireEvent.touchEnd assertion or remove the unused onTouchEnd setup to avoid confusion.

Option 1 - Test both callbacks:

   fireEvent.touchMove(sector, { touches: [{ clientX: 200, clientY: 200 }] });
   expect(onTouchMove).not.toHaveBeenCalled();
+  
+  fireEvent.touchEnd(sector);
+  expect(onTouchEnd).not.toHaveBeenCalled();

Option 2 - Remove unused setup:

   it('does not call touch event callbacks', async () => {
     const onTouchMove = vi.fn();
-    const onTouchEnd = vi.fn();

     const { container } = rechartsTestRender(
       <SunburstChart
         width={500}
         height={500}
         // @ts-expect-error typescript is correct here - indeed SunburstChart does not fire touch events
         onTouchMove={onTouchMove}
-        onTouchEnd={onTouchEnd}
         data={exampleSunburstData}
       />,
     );

src/cartesian/Area.tsx (1)

319-323: Don’t forward animation callbacks as DOM event handlers

svgPropertiesAndEvents(propsWithoutId) will include onAnimationStart/onAnimationEnd from internal props, unintentionally wiring them as DOM animation events. Strip them before collecting SVG+event props.

-  const { id, ...propsWithoutId } = props;
-  const allOtherProps = svgPropertiesNoEvents(propsWithoutId);
-  const propsWithEvents = svgPropertiesAndEvents(propsWithoutId);
+  const { id, onAnimationStart, onAnimationEnd, ...propsWithoutId } = props;
+  const allOtherProps = svgPropertiesNoEvents(propsWithoutId);
+  const propsWithEvents = svgPropertiesAndEvents(propsWithoutId);

test/cartesian/Bar.spec.tsx (1)

1720-1918: Solid event coverage; consider reducing brittleness of payload assertions.

Deep-equality on many numeric fields (e.g., tooltipPosition/background) can be flaky with minor layout tweaks. Prefer expect.objectContaining for stable keys and types; assert only what matters (index, dataKey/value, coordinates exist).

test/cartesian/Scatter.spec.tsx (3)

265-329: Disable animation in interaction tests to reduce flakiness.

Set isAnimationActive={false} on Scatter for deterministic geometry during clicks.

-        <ScatterChart width={500} height={500}>
-          <Scatter data={data} dataKey="cx" onClick={handleClick} />
+        <ScatterChart width={500} height={500}>
+          <Scatter isAnimationActive={false} data={data} dataKey="cx" onClick={handleClick} />

---

330-447: Same: hover tests should also disable animation.

-        <ScatterChart width={500} height={500}>
-          <Scatter data={data} dataKey="cx" onMouseOver={handleMouseOver} onMouseOut={handleMouseOut} />
+        <ScatterChart width={500} height={500}>
+          <Scatter
+            isAnimationActive={false}
+            data={data}
+            dataKey="cx"
+            onMouseOver={handleMouseOver}
+            onMouseOut={handleMouseOut}
+          />

---

448-567: Same: touch tests should also disable animation.

-        <ScatterChart width={500} height={500}>
-          <Scatter data={data} dataKey="cx" onTouchMove={handleTouchMove} onTouchEnd={handleTouchEnd} />
+        <ScatterChart width={500} height={500}>
+          <Scatter
+            isAnimationActive={false}
+            data={data}
+            dataKey="cx"
+            onTouchMove={handleTouchMove}
+            onTouchEnd={handleTouchEnd}
+          />

test/cartesian/Area.spec.tsx (4)

223-255: Turn off animation in Area click test for stability.

-          <Area dataKey="value" onClick={handleClick} />
+          <Area isAnimationActive={false} dataKey="value" onClick={handleClick} />

---

263-296: Turn off animation in Area hover test for stability.

-          <Area dataKey="value" onMouseOver={handleMouseOver} onMouseOut={handleMouseOut} />
+          <Area
+            isAnimationActive={false}
+            dataKey="value"
+            onMouseOver={handleMouseOver}
+            onMouseOut={handleMouseOut}
+          />

---

318-353: Turn off animation in Area touch test for stability.

-          <Area dataKey="value" onTouchMove={handleTouchMove} onTouchEnd={handleTouchEnd} />
+          <Area
+            isAnimationActive={false}
+            dataKey="value"
+            onTouchMove={handleTouchMove}
+            onTouchEnd={handleTouchEnd}
+          />

---

189-353: Reduce assertion fragility in event payloads.

Use expect.objectContaining for stable keys (id layout points length etc.) instead of full deep objects with many numeric fields.

test/chart/Sankey.spec.tsx (1)

450-806: Prefer partial assertions to avoid over-specifying sankey geometry.

These deep payload matches (dy/x/y/control points, nested node/link structures) are brittle to layout tweaks. Assert structure with expect.objectContaining and numeric existence (expect.any(Number)) for coordinates/widths, plus index/type ('link'|'node').

test/cartesian/Line.spec.tsx (1)

269-447: LGTM; consider partial payload assertions.

Great coverage for click/hover/touch. To reduce brittleness, assert only stable properties using expect.objectContaining (e.g., className/id/points length/stroke), not every numeric field.

test/polar/Pie.spec.tsx (1)

1804-2081: Event tests look good; consider partial assertions.

Coverage is solid. For resilience, assert with expect.objectContaining for stable fields (name, value, percent, tooltipPayload shape) instead of full deep equality on all numerics.

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Learnt from: CR
PR: recharts/recharts#0
File: test/README.md:0-0
Timestamp: 2025-10-25T07:35:46.180Z
Learning: Applies to test/**/*.test.{ts,tsx} : Use expectLastCalledWith instead of toHaveBeenLastCalledWith for typed last-call assertions

Learnt from: CR
PR: recharts/recharts#0
File: test/README.md:0-0
Timestamp: 2025-10-25T07:35:46.180Z
Learning: Applies to test/**/*.test.{ts,tsx} : Mock getBoundingClientRect using test/helper/MockGetBoundingClientRect.ts when rendering Recharts components (e.g., Tooltip, Legend, charts)

Learnt from: CR
PR: recharts/recharts#0
File: CONTRIBUTING.md:0-0
Timestamp: 2025-10-25T07:35:14.559Z
Learning: Applies to test/component/**/*.spec.tsx : Test rendering behavior and component interactions with React Testing Library

Learnt from: CR
PR: recharts/recharts#0
File: test/README.md:0-0
Timestamp: 2025-10-25T07:35:46.180Z
Learning: Write unit tests using Vitest and React Testing Library

Learnt from: CR
PR: recharts/recharts#0
File: test/README.md:0-0
Timestamp: 2025-10-25T07:35:46.180Z
Learning: Applies to test/**/*.test.{ts,tsx} : In tests not using createSelectorTestCase, advance timers after renders with vi.runOnlyPendingTimers()

Learnt from: CR
PR: recharts/recharts#0
File: test/README.md:0-0
Timestamp: 2025-10-25T07:35:46.180Z
Learning: Applies to test/**/*.test.{ts,tsx} : When using user-event, initialize with userEvent.setup({ advanceTimers: vi.runOnlyPendingTimers }) or use test/helper/userEventSetup.ts

Learnt from: CR
PR: recharts/recharts#0
File: test/README.md:0-0
Timestamp: 2025-10-25T07:35:46.180Z
Learning: Applies to test/**/*.test.{ts,tsx} : Prefer using the createSelectorTestCase helper when writing or modifying tests

Learnt from: CR
PR: recharts/recharts#0
File: test/README.md:0-0
Timestamp: 2025-10-25T07:35:46.180Z
Learning: Applies to test/**/*.test.{ts,tsx} : When testing selectors, verify render counts using the spy and rerenderSameComponent from createSelectorTestCase

Learnt from: CR
PR: recharts/recharts#0
File: CONTRIBUTING.md:0-0
Timestamp: 2025-10-25T07:35:14.559Z
Learning: Applies to test/**/*.spec.{ts,tsx} : When adding or changing functionality, add appropriate tests (prefer unit tests; use RTL if rendering is involved)