Opened 7 years ago

Closed 4 years ago

#15962 closed enhancement (patchwelcome)

dojox/mobile/ToolBarButton and TabBarButton: undesired outline drawn in selected state (Chrome/Win)

Reported by: Adrian Vasiliu Owned by: Patrick Ruzand
Priority: undecided Milestone: tbd
Component: DojoX Mobile Version: 1.8.0
Keywords: Cc: mikeb
Blocked By: Blocking:

Description

A minor cosmetic issue: when clicking a dojox/mobile/ToolBarButton or dojox/mobile/TabBarButton, on Chrome/Win (reproduced with Chrome 21), an undesired orange outline is drawn around the buttons. This is particularly unpleasant for buttons with arrows (such as the "back" button), as it can be seen in the attached backButtonWithOutline.png.

Can be reproduced using dojox/mobile/tests/test_Heading.html.

Only reproduced with Chrome/Win. No outline seen on other desktop and mobile browsers. Holds for all themes (iPhone, Android, BlackBerry).

The attached patch avoids this unwanted outline.

Attachments (2)

backButtonWithOutline.png (1.1 KB) - added by Adrian Vasiliu 7 years ago.
"Back" button drawn with an unpleasant outline on Chrome
patch15962.patch (4.0 KB) - added by Adrian Vasiliu 7 years ago.
Avoid undesired outline on Chrome - Adrian Vasiliu, IBM, CCLA

Download all attachments as: .zip

Change History (8)

Changed 7 years ago by Adrian Vasiliu

Attachment: backButtonWithOutline.png added

"Back" button drawn with an unpleasant outline on Chrome

Changed 7 years ago by Adrian Vasiliu

Attachment: patch15962.patch added

Avoid undesired outline on Chrome - Adrian Vasiliu, IBM, CCLA

comment:1 Changed 7 years ago by Adrian Vasiliu

Correction: the unwanted outline (with a different color) also holds for BlackBerry Torch 9860 OS 7.0.0.296. The patch fixes it for both Chrome and BB.

comment:2 Changed 7 years ago by cjolif

Cc: mikeb added

I understand this annoying visually. Especially when the outline does not match the form of the shape (see buttons with arrows). That said this is the standard outline of the HTML focused element. If we remove it that means that on Chrome when I navigate with keyboard from one button to another I have no visual clue of the focused button. A way to remove it also is obviously to remove tabindex of the buttons.

Maybe a solution would be to provide an accessible and a regular stylesheet. The accessible one keeping that feature.

Adding mikeb in cc in case he has advices here.

comment:3 Changed 7 years ago by ykami

cjolif is right. We have to be careful not to violate the accessibility requirements. (But, for the strange shaped outlines, obviously there's a room for improvement.)

comment:4 Changed 7 years ago by mimendoza

The same issue occurs with ListItem? - there is an outline, appears on BlackBerry? devices OS7 and 10

comment:5 Changed 6 years ago by Patrick Ruzand

Owner: changed from Eric Durocher to Patrick Ruzand
Status: newassigned

comment:6 Changed 4 years ago by Patrick Ruzand

Resolution: patchwelcome
Status: assignedclosed
Type: defectenhancement

Closing it. while it could be improved, the proposed patch does not solve the issue and breaks a11y. Changing to enhancement, and closing as patch welcome.

Note: See TracTickets for help on using tickets.