carbon-addons-iot-react icon indicating copy to clipboard operation
carbon-addons-iot-react copied to clipboard

Published 20 hours ago • verified publisher icon carbon-design-system

[Table] Page selection grows too large on MacOS

Open joanneedwards opened this issue 1 year ago • 1 comments

What package is this for?

  • [x] React
  • [ ] Angular

Describe the bug

I think this is a bug but it may be limited by macOS. It just looks untidy on mac. When there are a lot of pages in the table, the drop down becomes huge & takes over & obscures the page 'button' you just pressed.

To Reproduce

Steps to reproduce the behaviour:

  1. Using MacOS & Chrome

  2. Go to https://carbon-addons-iot-react.com/?path=/story/1-watson-iot-table--with-pagination

  3. Change the ‘Total items in data prop’ in the ‘Knobs’ tab to 1000

  4. Observe the drop down explodes beyond the page image

  5. Using Windows & Chrome

  6. Go to https://carbon-addons-iot-react.com/?path=/story/1-watson-iot-table--with-pagination

  7. Change the ‘Total items in data prop’ in the ‘Knobs’ tab to 1000

  8. Observe the drop down is more contained & aligns with the drop down 'button' that was pressed image

Expected behaviour

I think the Mac behaviour should be the same as the Windows one.

Environment/versions:

  • OS: MacOS
  • Browser: Chrome

joanneedwards avatar Jul 14 '22 03:07 joanneedwards

This is the behavior of all native dropdowns in that browser, and while it's not pretty, it does work (scrolling with your mouse wheel, you can get to any item). There isn't much we can do except swap the native dropdown for a Carbon one, opening upwards. This would be a story rather than a bug.

JordanWSmith15 avatar Jul 28 '22 20:07 JordanWSmith15