react-spectrum icon indicating copy to clipboard operation
react-spectrum copied to clipboard

Items are missing or partially occluded in combobox with wide items

Open neil-ca-moore opened this issue 2 years ago โ€ข 3 comments

๐Ÿ› Bug Report

Items are missing or partially occluded in combobox with wide items.

This is a video of the code sample from below. The last item should be "1-50" but is not.

react_spectrum_combo_bug

๐Ÿค” Expected Behavior

All items visible

๐Ÿ˜ฏ Current Behavior

Some items near the bottom of the list are missing or partially occluded.

It may not happen every time, but it happens most of the time.

๐Ÿ’ Possible Solution

๐Ÿ”ฆ Context

๐Ÿ’ป Code Sample

https://codesandbox.io/s/hopeful-waterfall-bxbn2q?file=/src/App.tsx

๐ŸŒ Your Environment

Software Version(s)
react-spectrum 3.27
Browser Version 113.0.5672.126 (Official Build) (x86_64)
Operating System Mac OS Ventura 13.3.1 (a) (22E772610a)

๐Ÿงข Your Company/Team

Adobe Business Platform

๐Ÿ•ท Tracking Issue (optional)

neil-ca-moore avatar May 30 '23 12:05 neil-ca-moore

I was also able to get some strange rendering of the items after selecting an item and opening the menu again. I can't reproduce this consistently, however.

Screenshot 2023-05-30 at 10 46 54 AM

reidbarber avatar May 30 '23 15:05 reidbarber

I'm not sure what is happening in your screenshot @reidbarber maybe adding keys would help with those blank spaces?

As for the some items missing, it looks like when the items that have more than one line of text, we manage to calculate the new positions of following items, but maybe miss updating the full size of the parent which determines the scroll height.

snowystinger avatar May 30 '23 18:05 snowystinger

Any update on this issue, I am also facing this issue frequently, any alternative to fix this issue?

upender7270 avatar Apr 26 '24 10:04 upender7270