Skip to content

effect-needs-cleanup false positive for React 19 callback ref cleanups #1831

Description

@simPod

Summary

react-doctor@0.9.14 reports react-doctor/effect-needs-cleanup for a React 19 callback ref that returns its ResizeObserver cleanup.

Reproduction

import { useCallback } from 'react';

export const useContainerWidth = () => {
  const containerRef = useCallback((node: HTMLDivElement | null) => {
    if (node === null) {
      return;
    }

    const observer = new ResizeObserver(() => {});
    observer.observe(node);

    return () => observer.disconnect();
  }, []);

  return containerRef;
};

Actual result

React Doctor reports effect-needs-cleanup at observer.observe(node).

Expected result

No diagnostic. React 19 supports callback refs that return a cleanup function. React calls that cleanup when the referenced element detaches.

The callback's null branch owns no observer. Returning void there is valid according to the React ref callback type, which permits void | (() => void).

Environment

  • react-doctor: 0.9.14
  • react: 19.3.0
  • TypeScript

Activity

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

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions