Combobox results in `Uncaught Error: Unexpected undefined` when there is no match

[qu8n]

What component (if applicable)

• Component name: Combobox

Describe the bug
When the combobox fails to match the text input, we get a console error Uncaught Error: Unexpected undefined.

To Reproduce
Steps to reproduce the behavior:

1. Go to https://catalyst.tailwindui.com/docs/combobox
2. Open the browser's Dev Tools console
3. Click on the first combobox on the page
4. Clear the placeholder text
5. Type "jo" or any substring not found in the list
6. See error

In step 5, alternatively we can also type " tom cook" or "tom cook " (with an extra space at the beginning or the end), and the same error occurs even though "tom cook" has a match.

Expected behavior
No console error.

Screenshots
https://github.com/user-attachments/assets/39d2a63c-b624-4cf8-a800-d2a7de05c394

Browser/Device (if applicable)

• OS: macOS
• Browser:
  • Chrome v136.0.7103.49 (Official Build) (arm64)
  • Brave v1.78.94 Chromium: 136.0.7103.60 (Official Build) (arm64)

Additional context

More details on the console error:

Unhandled Runtime Error
    Error: Unexpected undefined

Call Stack
    notUndefined
        node_modules/@tanstack/virtual-core/dist/esm/utils.js (50:1)
    eval
        node_modules/@tanstack/virtual-core/dist/esm/index.js (666:48)

[reinink]

Hey there @qu8n! Thanks for your patience here — it took a bit of digging to get this one figured out.

Turns out this was being caused by a small bug in the TanStack Virtual library, which our Combobox uses for virtualization. We were able to submit a PR to this project and get it fixed: TanStack/virtual#1004

We've since released a new version of Headless UI (v2.2.4), which includes this fix.

Meaning, to fix this bug in your project, you should be able to just upgrade Headless UI:

npm install @headlessui/react@latest

Let me know if you have any other issues here! 👍

[qu8n]

Confirmed as solved. Thank you for resolving this @reinink!