From 4608a4714da0bcc076611d1c64c8b0d2871b02da Mon Sep 17 00:00:00 2001 From: Alan Ren Date: Wed, 15 Dec 2021 20:48:58 -0800 Subject: [PATCH] Revert "table keyboard focus (#17903)" (#17946) This reverts commit 177663cc29c9763a4f005055f9a5a88841ea2392. --- src/sql/base/browser/ui/table/table.ts | 35 +++++++++++--------------- 1 file changed, 15 insertions(+), 20 deletions(-) diff --git a/src/sql/base/browser/ui/table/table.ts b/src/sql/base/browser/ui/table/table.ts index b535f4be52..1ee042ff62 100644 --- a/src/sql/base/browser/ui/table/table.ts +++ b/src/sql/base/browser/ui/table/table.ts @@ -80,20 +80,18 @@ export class Table extends Widget implements IDisposa this._container = document.createElement('div'); this._container.className = 'monaco-table'; this._register(DOM.addDisposableListener(this._container, DOM.EventType.FOCUS, (e: FocusEvent) => { - // Focus redirection should only happen when the event target is the container (using keyboard navigation) - if (e.target && this._container === e.target && this._data.getLength() > 0) { - let cellToFocus = this.grid.getActiveCell(); - if (!cellToFocus) { - // When the table receives focus and there are currently no active cell, the focus should go to the first focusable cell. - for (let col = 0; col < this.columns.length; col++) { - // some cells are not keyboard focusable (e.g. row number column), we need to find the first focusable cell. - if (this.grid.canCellBeActive(0, col)) { - cellToFocus = { - row: 0, - cell: col - }; - break; - } + // the focus redirection should only happen when the event target is the container (using keyboard navigation) + if (e.target && this._container === e.target && !this.grid.getActiveCell() && this._data.getLength() > 0) { + // When the table receives focus and there are currently no active cell, the focus should go to the first focusable cell. + let cellToFocus = undefined; + for (let col = 0; col < this.columns.length; col++) { + // some cells are not keyboard focusable (e.g. row number column), we need to find the first focusable cell. + if (this.grid.canCellBeActive(0, col)) { + cellToFocus = { + row: 0, + cell: col + }; + break; } } if (cellToFocus) { @@ -142,14 +140,11 @@ export class Table extends Widget implements IDisposa this.mapMouseEvent(this._grid.onDblClick, this._onDoubleClick); this._grid.onColumnsResized.subscribe(() => this._onColumnResize.fire()); this._grid.onRendered.subscribe(() => { - // When there are data present and no cells are keyboard focusable, the container should be set to keyboard focusable to - // leverage the focus redirection logic. - this._container.tabIndex = this._container.querySelector('[tabindex = "0"]') || this._data.getLength() === 0 ? -1 : 0; + if (!this._grid.getActiveCell()) { + this._container.tabIndex = this._data.getLength() > 0 ? 0 : -1; + } }); this._grid.onActiveCellChanged.subscribe((e, data) => { - // When the active cell is changed, a cell will become focusable and we can make the container not focusable by user. - // later when the grid is rerendered (e.g. view switching), the active cell information is kept but the cell will become not keyboard focusable (tabindex changed from 0 to -1). - // we need to check and reset the tabIndex of the container in the onRendered handler. this._container.tabIndex = -1; }); }