facebook / facebook/astryx

[Bug] A controlled (isOpen) HoverCard renders in the page corner, not anchored to its trigger

Open
#5,374 1 comment 0 reactions 0 assignees View on GitHub
bug
Dominant language
TypeScript
Stars
13.1k
Forks
1.1k
Avg merge
1d 14h
Merged PRs (30d)
669

Description

## Description

A `HoverCard` (and `Tooltip`) opened by the controlled `isOpen` prop renders in the page's top-left corner instead of anchored to its trigger. The same card, opened by hover, anchors correctly.

Measured in Chromium against a `HoverCard` inside a `Dialog`, trigger at `(206, 292)`:

| how it opened | card position |
|---|---|
| `isOpen` (controlled) | **`(0, 4)`** |
| hover (uncontrolled) | `(188, 204)` |

The controlled path (`useHoverCard.tsx:511` on `main`) calls `layer.show()` from an effect keyed on `isOpen`. Anchoring appears not to have been established at that point, so the layer falls back to the viewport corner — the same failure mode a layer with no resolvable `position-anchor` shows.

## Reproduction

1. Render ``.
2. Look at where the card is.

**Expected:** anchored to the trigger, exactly as hovering it produces.
**Actual:** top-left corner of the viewport.

## Notes

Pre-existing on `main`; the controlled-open effect is byte-identical there. Found while reviewing #4881, which adds a `Pinned hover card in modal` story under `Core/Layer Dismissal` that shows it — that PR does not touch positioning and is not the cause. A fix can land before or after it: they touch different regions of the file and will not conflict.

Worth checking whether `Tooltip`'s controlled path has the same shape (it does, `useTooltip.tsx`) and whether `isDefaultOpen` is affected too.

## Astryx Version

`@astryxdesign/core@0.4.7`

## Environment

Chromium 149.0.7827.55 (Playwright), macOS 26

Contributor guide

Open the contributing guide

Research direction

Start in useHoverCard.tsx around line 511 and compare the controlled isOpen effect with the working hover path; also inspect the corresponding controlled path in useTooltip.tsx and whether isDefaultOpen is affected. Reproduce the issue in Chromium with the provided HoverCard example, then verify that controlled and related openings anchor to the trigger rather than the viewport corner.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Active
Clarity
Clearly specified
Newbie friendliness
72/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.