From 141c7c514cfdac2ffcc25c710023404074c44922 Mon Sep 17 00:00:00 2001 From: Sergey Vinogradov Date: Thu, 16 Jan 2025 12:54:37 +0400 Subject: [PATCH] fix tests --- packages/a11y-base/src/focus-utils.d.ts | 9 --------- packages/a11y-base/src/focus-utils.js | 2 +- packages/a11y-base/src/list-mixin.js | 13 +++++++++---- 3 files changed, 10 insertions(+), 14 deletions(-) diff --git a/packages/a11y-base/src/focus-utils.d.ts b/packages/a11y-base/src/focus-utils.d.ts index 7e02e4694f..3700cc2dab 100644 --- a/packages/a11y-base/src/focus-utils.d.ts +++ b/packages/a11y-base/src/focus-utils.d.ts @@ -16,15 +16,6 @@ export declare function getDeepActiveElement(): Element; */ export declare function isKeyboardActive(): boolean; -/** - * Returns true if the element is hidden directly with `display: none` or `visibility: hidden`, - * false otherwise. - * - * The method doesn't traverse the element's ancestors, it only checks for the CSS properties - * set directly to or inherited by the element. - */ -export declare function isElementHiddenDirectly(element: HTMLElement): boolean; - /** * Returns true if the element is hidden, false otherwise. * diff --git a/packages/a11y-base/src/focus-utils.js b/packages/a11y-base/src/focus-utils.js index efd9799eab..124bbbbc8a 100644 --- a/packages/a11y-base/src/focus-utils.js +++ b/packages/a11y-base/src/focus-utils.js @@ -60,7 +60,7 @@ export function isKeyboardActive() { * @param {HTMLElement} element * @return {boolean} */ -export function isElementHiddenDirectly(element) { +function isElementHiddenDirectly(element) { // Check inline style first to save a re-flow. const style = element.style; if (style.visibility === 'hidden' || style.display === 'none') { diff --git a/packages/a11y-base/src/list-mixin.js b/packages/a11y-base/src/list-mixin.js index e9b5d6b479..15b990194f 100644 --- a/packages/a11y-base/src/list-mixin.js +++ b/packages/a11y-base/src/list-mixin.js @@ -8,7 +8,7 @@ import { Debouncer } from '@vaadin/component-base/src/debounce.js'; import { getNormalizedScrollLeft, setNormalizedScrollLeft } from '@vaadin/component-base/src/dir-utils.js'; import { getFlattenedElements } from '@vaadin/component-base/src/dom-utils.js'; import { SlotObserver } from '@vaadin/component-base/src/slot-observer.js'; -import { isElementHiddenDirectly } from './focus-utils.js'; +import { isElementHidden } from './focus-utils.js'; import { KeyboardDirectionMixin } from './keyboard-direction-mixin.js'; /** @@ -120,7 +120,7 @@ export const ListMixin = (superClass) => } const items = Array.isArray(this.items) ? this.items : []; - const idx = this._getAvailableIndex(items, 0, null, (item) => item.tabIndex === 0); + const idx = this._getAvailableIndex(items, 0, null, (item) => item.tabIndex === 0 && !isElementHidden(item)); if (idx >= 0) { this._focus(idx); } else { @@ -222,7 +222,12 @@ export const ListMixin = (superClass) => } const idx = this._searchBuf.length === 1 ? currentIdx + 1 : currentIdx; - return this._getAvailableIndex(this.items, idx, 1, (item) => this.__isMatchingKey(item)); + return this._getAvailableIndex( + this.items, + idx, + 1, + (item) => this.__isMatchingKey(item) && getComputedStyle(item).display !== 'none', + ); } /** @private */ @@ -334,7 +339,7 @@ export const ListMixin = (superClass) => /** @override */ _isItemFocusable(item) { - return !item.hasAttribute('disabled') && !isElementHiddenDirectly(item); + return !item.hasAttribute('disabled'); } /**