diff --git a/packages/grid/src/vaadin-grid-keyboard-navigation-mixin.js b/packages/grid/src/vaadin-grid-keyboard-navigation-mixin.js index 8dfbd33792..101f84d051 100644 --- a/packages/grid/src/vaadin-grid-keyboard-navigation-mixin.js +++ b/packages/grid/src/vaadin-grid-keyboard-navigation-mixin.js @@ -814,10 +814,12 @@ export const KeyboardNavigationMixin = (superClass) => const rootTarget = e.composedPath()[0]; if (rootTarget === this.$.table || rootTarget === this.$.focusexit) { - // The focus enters the top (bottom) of the grid, meaning that user has - // tabbed (shift-tabbed) into the grid. Move the focus to - // the first (the last) focusable. - this._predictFocusStepTarget(rootTarget, rootTarget === this.$.table ? 1 : -1).focus(); + if (!this._isMousedown) { + // The focus enters the top (bottom) of the grid, meaning that user has + // tabbed (shift-tabbed) into the grid. Move the focus to + // the first (the last) focusable. + this._predictFocusStepTarget(rootTarget, rootTarget === this.$.table ? 1 : -1).focus(); + } this._setInteracting(false); } else { this._detectInteracting(e); diff --git a/packages/grid/test/keyboard-navigation.common.js b/packages/grid/test/keyboard-navigation.common.js index 9fb368e175..03acc577a5 100644 --- a/packages/grid/test/keyboard-navigation.common.js +++ b/packages/grid/test/keyboard-navigation.common.js @@ -544,6 +544,17 @@ describe('keyboard navigation', () => { expect(grid.shadowRoot.activeElement).to.equal(tabbableElements[3]); }); + it('should not enter grid on table click', () => { + const tabbableElements = getTabbableElements(grid.shadowRoot); + + // Click and focusin on table element + mouseDown(tabbableElements[0]); + focusin(tabbableElements[0], focusable); + + // Expect no focus on header cell + expect(grid.shadowRoot.activeElement).to.be.null; + }); + it('should set native focus to header on header cell click', () => { const tabbableElements = getTabbableElements(grid.shadowRoot); focusFirstHeaderCell();