Skip to content

[🐞] Combobox multi selection jumping highlight #1108

@lolzivkovic

Description

@lolzivkovic

Which package is affected?

Headless Kit

Describe the bug

When using inline combobox in multiple mode selecting item above one that is already selected, highlight is jumping or sticking to previous selected one.

Reproduction

https://github.com/lolzivkovic/qwik-ui-stackblitz

Steps to reproduce

Step 1.

git clone https://github.com/lolzivkovic/qwik-ui-stackblitz

Step 2.

git checkout lolzivkovic/patch-74051

Step 3.

pnpm install

Step 4. - if using newest pnpm and require to approve builds

pnpm approve-builds

Step 5.

pnpm dev

Step 6.

Scroll down to combobox and try selecting items from bottom to top in no particular order

System Info

System:
    OS: Linux 6.15 Arch Linux
    CPU: (16) x64 AMD Ryzen 7 PRO 6850H with Radeon Graphics
    Memory: 9.25 GB / 14.89 GB
    Container: Yes
    Shell: 5.9 - /usr/bin/zsh
  Binaries:
    Node: 24.1.0 - /run/user/1000/fnm_multishells/7309_1749833877769/bin/node
    npm: 11.3.0 - /run/user/1000/fnm_multishells/7309_1749833877769/bin/npm
    pnpm: 10.11.0 - /run/user/1000/fnm_multishells/7309_1749833877769/bin/pnpm
    bun: 1.2.15 - ~/.bun/bin/bun
  Browsers:
    Brave Browser: 137.1.79.123
    Chromium: 137.0.7151.103
    Firefox(manually added): 139.0.4

Additional Information

I've traced the issue to the handleChange function within the combobox-root.tsx file. The following block of code seems to be the cause of the highlight jumping:
if (context.isListboxOpenSig.value === false) { context.highlightedIndexSig.value = index; }

it seems that it is looping and changing highlighted selected item one by one until last one is left highlighted. Maybe we should add a check so that only last one is highlighted from the start and only in popover mode?

Metadata

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