search

eBay / ebayui-core

Collection of Marko widgets; considered to be the core building blocks for all eBay components, pages & apps
https://ebay.github.io/ebayui-core/
Other
217 stars 103 forks source link

Combobox: wont collapse unless done is clicked on iOS #287

Closed hramakumar closed 6 years ago

hramakumar commented 6 years ago

Bug Report

eBayUI Version: 0.6.0

Description

IOS- Chrome and safari combobox-even after the cursor issue is fixed https://github.com/eBay/ebayui-core/issues/229 The event is not triggered unless the done link is clicked- unable to collapse the options list without clicking done.

Workaround

Screenshots

hramakumar commented 6 years ago

@dasarianudeep can you please attach the screenshot?

dasarianudeep commented 6 years ago

Please find the screenshot img_0590

dasarianudeep commented 6 years ago

Even the actual DS6 combobox works the same. http://ebay.github.io/skin/ds6/#combobox

RajaRamu commented 6 years ago

I pulled ebayui-core@0.8.0 and focused input box does not collapse or open combo box. Fix below works only in desktop browsers not on real devices, 

text-shadow: 0 0 0 #111820;
color: transparent;

This issue is happening in all IOS and some android devices(safari, chrome and firefox). Actual fix is,

1 - change input:text to input:button - https://github.com/eBay/ebayui-core/blob/master/src/components/ebay-combobox/template.marko#L9

2 - Adding text-align:left in skin/combobox -https://github.com/eBay/skin/blob/master/src/less/combobox/ds6/combobox-base.less#L26

Verified it in real devices and it works.

seangates commented 6 years ago

It must be a text input for accessibility reasons.

msendlakowski commented 6 years ago

Current discussion is to modify this component to have a "readonly" version that uses a button rather than a textbox. And change the role from "combobox" to "listbox" for a11y.

msendlakowski commented 6 years ago

Update: The combobox component will be recommended only when the user needs true combobox functionality. So it won't be viable until we get the "type-ahead" functionality going.

For normal "select" behavior we will recommend the ebayui-select component. The dweb UI for this component is getting fixed to match the design pattern. https://github.com/eBay/skin/issues/325

msendlakowski commented 6 years ago

Removing from this milestone because applications should use the ebay-select component until the combobox has the type-ahead functionality.

msendlakowski commented 6 years ago

For this release we are recommending that applications use ebay-select for mobile and the read-only version of the 'ebay-combobox' only for desktop. This strategy will be rethought in a future release.