Skip to content

Conversation

@xingarr
Copy link

@xingarr xingarr commented Nov 11, 2025

… Components# Add Comprehensive Test Coverage for Utility Functions and Typed Chart Components

Description

This PR adds extensive test coverage for previously untested parts of the react-chartjs-2 library, specifically:

  • All utility functions in src/utils.ts
  • All typed chart components in src/typedCharts.tsx

Motivation

While the main Chart component has excellent test coverage in chart.test.tsx, several critical parts of the library lacked dedicated unit tests:

  • Utility functions (getDatasetAtEvent, getElementAtEvent, getElementsAtEvent, reforwardRef, setOptions, setLabels, setDatasets, cloneData) had no direct test coverage
  • Typed chart components (Line, Bar, Radar, Doughnut, PolarArea, Bubble, Pie, Scatter) had no dedicated unit tests beyond type checking

This PR addresses these gaps to improve code quality, maintainability, and confidence in the library.

Changes

New Test Files

1. test/utils.test.tsx (489 lines, ~40 test cases)

Comprehensive test suite for all utility functions:

reforwardRef tests:

  • Function ref handling
  • Object ref handling
  • Null/undefined ref edge cases

setOptions tests:

  • Chart options updates
  • Empty options handling
  • Missing options edge cases

setLabels tests:

  • Label updates
  • Undefined and empty labels

setDatasets tests:

  • Dataset updates with matching labels
  • Adding new datasets
  • Custom datasetIdKey support
  • Datasets with no data
  • Preventing duplicate dataset references

cloneData tests:

  • Data cloning with labels and datasets
  • Independent copy verification
  • Custom datasetIdKey support
  • Empty datasets handling

Event handler tests:

  • getDatasetAtEvent - dataset element retrieval with correct mode parameters
  • getElementAtEvent - single element retrieval with 'nearest' mode
  • getElementsAtEvent - all elements retrieval with 'index' mode

2. test/typedCharts.test.tsx (456 lines, ~60 test cases)

Comprehensive test suite for all typed chart components:

Individual chart tests for:

  • Line, Bar, Radar, Doughnut, PolarArea, Bubble, Pie, Scatter

Each chart type verifies:

  • Proper rendering and type verification
  • Data passing
  • Options handling
  • Chart-specific options (e.g., cutout for Doughnut, indexAxis for Bar)
  • Data updates trigger chart updates

Common functionality tests (for all chart types):

  • Ref forwarding
  • Chart destruction on unmount
  • className prop support
  • plugins prop support
  • redraw prop handling
  • aria-label support
  • height and width props

Type safety tests:

  • Verifying typed components work without explicit type prop
  • Controller registration verification

Test Coverage Impact

This PR adds test coverage for:

  • ✅ 9 utility functions (previously 0% coverage)
  • ✅ 8 typed chart components (previously minimal coverage)
  • ✅ Event handling functionality
  • ✅ Data manipulation and cloning
  • ✅ Ref forwarding patterns

Total new test cases: ~100

Testing

All tests follow the existing patterns in the repository:

  • Using Vitest as the test runner
  • Using @testing-library/react for component testing
  • Following the same structure and conventions as chart.test.tsx
  • Proper cleanup and teardown in afterEach hooks

To run the new tests:

pnpm test:unit

Checklist

  • Tests added for utility functions
  • Tests added for typed chart components
  • Tests follow existing code style and patterns
  • All tests use proper cleanup/teardown
  • Tests cover edge cases and error conditions
  • Tests verify correct Chart.js API usage

Related Issues

This PR improves test coverage and code quality, making the library more maintainable and reliable for contributors and users.

Breaking Changes

None. This PR only adds tests and does not modify any source code.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant