fix tests

vaadin · Jan 16, 2025 · 141c7c5 · 141c7c5
1 parent e989a7c
commit 141c7c5
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 14 deletions.
diff --git 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
@@ -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
@@ -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');
     }
 
     /**