floating-ui / floating-ui

A JavaScript library to position floating elements and create interactions for them.

Home Page:https://floating-ui.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

After upgrade to latest, floating-ui portal gets id=undefined

smellai opened this issue · comments

Describe the bug

After updating to .9, something looks wrong with the generation of the id for a floating ui portal

Expected behavior
I expect a floating-ui-N id to be generated.

Screenshots
Snapshot of the generated HTML:

Screenshot 2024-02-05 alle 10 32 51

Context:

  • Version 0.26.9

Is this only in snapshot tests? In the browser it's defined with both conditional and unconditional rendering.

Yes, you're right, it happens only in jest snapshots, any idea why it could be?

I couldn't reproduce this with React 17 or 18 with a basic snapshot test using Vitest (both conditional and unconditional FloatingPortal rendering based on an open state), using latest @testing-library/react and jsdom. Maybe it's a React 16 problem in a testing env, or something else, but it doesn't seem to be an actual bug. Feel free to provide a reproduction if you have the ability, but for now, I'm closing due to lack of ability to reproduce the issue.

Hi, I finally managed to set up a reproduction: https://stackblitz.com/edit/vitejs-vite-erxqfe?file=src%2F__snapshots__%2FPopover.spec.js.snap

you can see id="undefined" at line 19

Have you tried:

  • Upgrading to React 18, which uses the native useId() hook and has better perf (I'm going to drop React 17 support when React 19 comes out in a few months anyway)
  • Adding act(async () => {}) after the render() call in the test async (it breaks in Stackblitz, not sure why)
  • Avoiding snapshot tests which can easily break when implementation details of this library change (such as here) even though it's not actually broken for real users
  • I'm maintaining an npm module so I'm not free to upgrade to React 18 right away, until my consumers are ready.
  • using act doesn't seem to change this behaviour.
  • I know snapshots tests are very limited, but they actually helped in finding bugs after library upgrades. They can be replaced for sure with better tests, but until we don't have the resources to do that, that's the best we have.

I understand my specific issue shouldn't be a priority for you and I'm glad you always take the time to answer in zero time. Thank you!