commit | fbacf4e274bf415a5f6bde51a4c452638031893e | [log] [tgz] |
---|---|---|
author | Anubha Mathur <[email protected]> | Mon Oct 28 19:08:03 2019 |
committer | Commit Bot <[email protected]> | Mon Oct 28 22:24:07 2019 |
tree | 8433c510f5a11ee54d552c529e166e95cfa468ed | |
parent | 05d6a23ca1e5bc92a3e7ca6a3ea2f302a0843667 [diff] [blame] |
DevTools: Fix accessibility issue where datagrid tables in console caused inconsistent keyboard navigation Issue: Keyboard accessibility in console is inconsistent when datagrids are present. Shift + Tab in console prompt takes you to the last console message, beyond which arrow keys let you navigate through console messages. When console.table creates datagrids, the original tabIndex for these is 0, which immediately take focus on shift+tab. This has now been updated to -1, since keyboard focus is not needed in console datagrids. Sorting functionality is still keyboard accessible using context menu key. Gif: https://imgur.com/a/jlGCoFg Bug: 963183 Change-Id: I5996505724f66530b8e4f73379e7d196eb3d013f Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/1873358 Reviewed-by: Lorne Mitchell <[email protected]> Commit-Queue: Anubha Mathur <[email protected]>
diff --git a/front_end/console/ConsoleViewMessage.js b/front_end/console/ConsoleViewMessage.js index 3ed93b5..b2ad49b 100644 --- a/front_end/console/ConsoleViewMessage.js +++ b/front_end/console/ConsoleViewMessage.js
@@ -198,6 +198,7 @@ if (flatValues.length) { this._dataGrid = DataGrid.SortableDataGrid.create(columnDisplayNames, flatValues); this._dataGrid.setStriped(true); + this._dataGrid.setFocusable(false); const formattedResult = createElementWithClass('span', 'console-message-text'); const tableElement = formattedResult.createChild('div', 'console-message-formatted-table');