openui5 icon indicating copy to clipboard operation
openui5 copied to clipboard

Date Picker: Focus on the Calendar Icon fails to meet minimum required color contrast of 3:1 for visual focus outlines.

Open achuth2912 opened this issue 1 year ago • 3 comments

OpenUI5 version: 1.127.0

Browser/version (+device/version): Google Chrome 128.0.6613.138

Any other tested browsers/devices(OK/FAIL):

URL (minimal example if possible): https://ui5.sap.com/#/entity/sap.m.DatePicker/sample/sap.m.sample.DatePicker

User/password (if required and possible - do not post any confidential information here):

Steps to reproduce the problem:

  1. Focus on the DatePicker Icon

What is the expected result? Focus outline around all focusable elements must be distinct and pass a minimum of 3:1 Color contrast against its background.

What happens instead? Color contrast fails with 1.6:1 ratio

Any other information? (attach screenshot if possible) Screenshot 2024-09-27 at 3 14 39 PM

achuth2912 avatar Sep 27 '24 10:09 achuth2912

hey @achuth2912

The icon in any input field could not be focused. I am not sure where is the focused placed in your example. Could you please provide steps to reproduce?

Best Regards, Martin

MapTo0 avatar Sep 27 '24 13:09 MapTo0

cca_fails_calendar_Icon

When we open the calendar using the Keyboard shortcut the Color contrast around icon fails.

achuth2912 avatar Sep 30 '24 04:09 achuth2912

Hello @achuth2912 ,

In your last comment I see that the focus is inside the Calendar on date "11". And the focus color is correct. The calendar icon is inside button, which is not focused. The outline of this button is decorative and do not need to fulfill color contrast ratio. I see no issue here.

Regards, Lidiya

LidiyaGeorgieva avatar Sep 30 '24 11:09 LidiyaGeorgieva

Since there is no response from the author for more than 4 weeks I'm closing the ticket.

flovogt avatar Dec 06 '24 09:12 flovogt