Cb 3910 focus fix (#1962)

* CB-3910: fix focusable elements selector * CB-3910: update focus when ref changed --------- Co-authored-by: EvgeniaBzzz <[email protected]>
dbeaver · Sep 13, 2023 · 4a04023 · 4a04023
1 parent 751a9c7
commit 4a04023
Showing 1 changed file with 7 additions and 7 deletions.
diff --git a/webapp/packages/core-blocks/src/useFocus.ts b/webapp/packages/core-blocks/src/useFocus.ts
@@ -38,8 +38,6 @@ export function useFocus<T extends HTMLElement>({ autofocus, focusFirstChild, on
       setRef(ref: T | null) {
         if (this.reference !== ref) {
           this.reference = ref;
-
-          this.updateFocus();
         }
       },
       updateFocus() {
@@ -64,12 +62,12 @@ export function useFocus<T extends HTMLElement>({ autofocus, focusFirstChild, on
       focusFirstChild() {
         if (this.reference !== null && optionsRef.focusFirstChild) {
           const firstFocusable = this.reference.querySelectorAll<T>(`
-            button:not([disabled=disabled]), 
+            button:not([disabled]):not([disabled=disabled]), 
             [href], 
-            input:not([disabled=disabled]):not([readonly=readonly]), 
-            select:not([disabled=disabled]):not([readonly=readonly]), 
-            textarea:not([disabled=disabled]):not([readonly=readonly]), 
-            [tabndex]:not([tabndex="-1"])`);
+            input:not([disabled]):not([readonly]):not([disabled=disabled]):not([readonly=readonly]), 
+            select:not([disabled]):not([readonly]):not([disabled=disabled]):not([readonly=readonly]), 
+            textarea:not([disabled]):not([readonly]):not([disabled=disabled]):not([readonly=readonly]), 
+            [tabindex]:not([tabindex="-1"])`);
 
           let tabIndex = -1;
           let lastElement: T | undefined;
@@ -134,6 +132,8 @@ export function useFocus<T extends HTMLElement>({ autofocus, focusFirstChild, on
     reference.addEventListener('focusin', focusHandler);
     reference.addEventListener('focusout', blurHandler);
 
+    state.updateFocus();
+
     return () => {
       reference.removeEventListener('focusin', focusHandler);
       reference.removeEventListener('focusout', blurHandler);