Community
Participate
Working Groups
In file org.eclipse.orion.client.ui/web/orion/banner/banner.html there's an element with id="closeNotifications" that is half-button, half-span: <div class="layoutRight"> <button type="button" aria-label="Close" class="dismissButton layoutRight core-sprite-close imageSprite" id="closeNotifications"></span> </div> What, exactly, does this "button" do? The browser decided that it is a "button" (it ignores the closing 'span' tag), so it is allowed to take focus. This causes confusion for keyboard users, since the "button" is off-screen, so when you "Tab" to it, you wonder where focus went.
"You'll wonder where the focus went ..."
Closing as part of a mass clean up of inactive bugs. Please reopen if this problem still occurs or is relevant to you. For more details see: https://dev.eclipse.org/mhonarc/lists/orion-dev/msg04002.html
Still a problem.
The simplest way to keep a button or link in the DOM but hidden and removed from the tab order is to use the HTML "hidden" attribute: <button hidden>This button is hidden</button> <a hidden>This link is hidden</a> This hides the element, removes it from the tab order, and removes it from the accessibility tree. (Make sure that it doesn't have CSS display: flex; or some other visible CSS display type because that overrides the HTML hidden attribute. If that is the case, need to switch to css display: none;).
This is part of the notification area. The x button closes the current notification. The fix for this is for the whole notificationArea to be "hidden" (or display:none" when it is not showing, and not hidden when a notification is showing.
Fixed with https://github.com/eclipse/orion.client/commit/7879c59718515e90e58496d1a543c497f1067575 The notifications area opens/closes with an animation, so adding display:none/display:block on the whole thing breaks the animation. So it was just added to the close button, which works fine (i.e. button doesn't take focus unless the notification area is being shown).
