Skip to content

[preact/compat] Difference in how events are processed (floating-ui) #4373

Open
@GresiRoost

Description

Describe the bug
There seems to be a difference between how preact/compat processes events and how React does it.
This appears to cause various issues in third party libraries such as floating-ui.

I attempted to port the floating-ui "DropdownMenu" preact example directly to use preact+htm.

To Reproduce
Port the floating-ui examples to use preact+htm.

I posted my attempt here (preact+htm+floating-ui has been bundled together for the simplicity of the example):

https://tidspunkt.dk/bugs/floatingpreact/

The original React version that works fine can be found and tested out here:
https://codesandbox.io/s/admiring-lamport-5wt3yg?file=/src/DropdownMenu.tsx

Steps to reproduce the behavior:
(Happens in both Chrome and Firefox, doesn't seem to be a browser issue)

  1. Click to open the menu
  2. Hover the mouse over "Copy as" and the submenu opens fine
  3. Move the mouse over into the new submenu
  4. Most of the time the submenu closes completely. Sometimes if you move very slow you can observe flicker as a lot of events are processed. Then you can move into the new menu. Any submenus from there will result in all the submenus closing.
floatingpreact.mp4

Expected behavior
The submenus should work like in the provided React example.

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions