2361857 – #WCAG# Sort icon button in Fiori My Inbox cannot be activated with “Enter” key during keyboard navigation

Someone asked a question:

Open Fiori My Inbox application.

Use tab key to get the cursor on the sort button.

The sort icon button can be activated with Space bar, but not with Enter key.

The reply from the development team is:

It is the designed behavior instead of a bug.

In the footer of your app there are 3 interactive elements:

– Sort (a sap.m.Select control, representing an HTML select)

– Filter (a sap.m.Button control, representing an HTML button)

– Group (a sap.m.Button control, representing an HTML button)

This is the reason for the different keyboard handling when comparing the Sort select and the Filter/Group buttons. By specification, buttons are activated with Space bar/Enter, while selects are opened by Space bar, and their value is activated with Space bar/Enter. So in short, Enter can be used as well, but not for opening the select’s list – only for choosing a value from the list.

The reason not to allow the Enter key directly over a select (in contrast to allowing it on its values list) is general HTML semantics. In an HTML context, normally Enter is associated with submitting a form or pressing a button, which are definitive actions – usually leading to a change. While changing the value of a select is more like typing text into an input in terms of semantics (where change doesn’t happen until the user does some explicit action – like pressing a button afterwards). So the logic is that the user does not press Enter over a select directly. As UI5 tries to follow HTML conventions as close as possible when wrapping HTML controls in UI5 controls, these particularities have been taken into account when designing the controls.