Select triggers button event behind on mobile [next]

[jacokok]

Describe the bug

When you choose an option in a select it will still fire the events and click a button behind the selections for example. This bug only occurs on mobile.

Reproduction

Screencast From 2024-11-06 10-22-56.webm

I tried to reproduce in bits-ui and was unable to. Also this only happens on mobile.

Logs

No response

System Info

System:
    OS: Linux 6.11 cpe:/o:nixos:nixos:24.11 24.11 (Vicuna)
    CPU: (20) x64 12th Gen Intel(R) Core(TM) i7-12700K
    Memory: 20.10 GB / 31.09 GB
    Container: Yes
    Shell: 5.2.37 - /run/current-system/sw/bin/bash
  Binaries:
    Node: 22.10.0 - ~/.nix-profile/bin/node
    npm: 10.9.0 - ~/.nix-profile/bin/npm
    pnpm: 9.12.3 - ~/.nix-profile/bin/pnpm
  npmPackages:
    @sveltejs/kit: ^2.7.7 => 2.7.7
    bits-ui: 1.0.0-next.45 => 1.0.0-next.45
    formsnap: 2.0.0-next.1 => 2.0.0-next.1
    lucide-svelte: ^0.454.0 => 0.454.0
    mode-watcher: ^0.4.1 => 0.4.1
    svelte: ^5.1.10 => 5.1.10
    svelte-sonner: ^0.3.28 => 0.3.28
    vaul-svelte: 1.0.0-next.2 => 1.0.0-next.2

Severity

blocking an upgrade

[ieedan]

Can you provide a minimal reproduction?

I wasn't able to reproduce it: https://stackblitz.com/edit/github-xbthzn?file=src%2Froutes%2F%2Bpage.svelte

[jacokok]

Thanks for looking into this.

As I was busy setting up reproduction I found the problem. Apologies for the noise.

It turns out I did not have tailwindcss-animate in my tailwind config.

Basically after adding the below to my tailwind.config.ts file it is now working as expected.

import tailwindcssAnimate from "tailwindcss-animate";

{
  ...,
  plugins: [tailwindcssAnimate]
}