Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

`Tooltip` is incompatible with callback refs

Offen
  • Stimmt etwas nicht?
#8,378 2 Kommentare 1 Reaktion 0 zugewiesene Personen Auf GitHub ansehen

Maintainer antworten meist innerhalb von 2 Tagen

@AdamMagued arbeitet bereits daran.

Seit 29.9.2026.

  • #8461 von @AdamMagued — offen

Bewertung

Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Anfängerfreundlichkeit
70/100
Issue-Typ
Bug
Klarheit
Größtenteils klar
Aktivitätsstatus
Aktiv
Tech-Stack
react, typescript
Bereich
frontend

Rechercherichtung

Start at the Tooltip component's ref handling and reproduce the callback-ref example from the issue, comparing it with the object-ref case. Done means a callback ref passed to Tooltip still receives the underlying element and the tooltip appears when hovering the wrapped Button.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

bug component: Tooltip react
Description

When I encountered https://github.com/primer/react/issues/8373 I moved my callback ref to the wrapping Tooltip . This appeared to forward the ref to the underlying element as I wanted. However, if the passed ref is a callback ref, the tooltip never appears. This is not the case for an object ref.

Steps to reproduce

This breaks, even though it typechecks just fine. The log does get called, but the tooltip does not appear:

const logRef = useCallback(element => console.log(element), [])

return <Tooltip ref={logRef} text="Example"><Button>Button text</Button></Tooltip>

This works, but isn't a callback ref:

const logRef = useRef(null)

return <Tooltip ref={logRef} text="Example"><Button>Button text</Button></Tooltip>

And this shows the tooltip but never calls the log (#8373):

const logRef = useCallback(element => console.log(element), [])

return <Tooltip text="Example"><Button ref={logRef}>Button text</Button></Tooltip>
Version

v38.37.0

Browser

No response

Vorherrschende Sprache
TypeScript
Sterne
3.9k
Forks
697
Ø Merge
3 T. 21 Std.
Gemergte PRs (30 T.)
51

Entwicklungsumgebung

In Codespaces öffnen

Startet den Dev-Container des Projekts im Browser, mit Ihrem eigenen GitHub-Konto.

  • Kein Dockerfile und keine Docker-Compose-Datei
  • Hat eine Pull-Request-Vorlage
  • Kein Beitragsleitfaden

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus primer/react

Alle Issues in primer/react

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.