ADA(ADA-1451): Close Video Info modal dialog focus management

src/utils/popup-keyboard-accessibility.tsx

@@ -1,6 +1,6 @@
-import { h, Component } from 'preact';
-import { KeyMap } from './key-map';
-import { focusElement } from './focus-element';
+import {h, Component} from 'preact';
+import {KeyMap} from './key-map';
+import {focusElement} from './focus-element';
 
 /**
  * wraps a component and handles all key navigation and focus
@@ -13,6 +13,7 @@ export const withKeyboardA11y = (WrappedComponent): any =>
     _accessibleChildren: Array<HTMLElement> = [];
     _previouslyActiveElement?: HTMLElement | null;
     _isModal: boolean = false;
+    _morePluginButton: HTMLButtonElement | null;
 
     /**
      * after component mounted, focus on relevant element
@@ -33,6 +34,15 @@ export const withKeyboardA11y = (WrappedComponent): any =>
       this._isModal = value;
     }
 
+    /**
+     * setter to change to more button state
+     * @param {boolean} value - the modal state
+     * @memberOf HOC
+     */
+    set morePluginButton(button: HTMLButtonElement | null) {
+      this._morePluginButton = button;
+    }
+
     /**
      * handles keydown events
      * @param {KeyboardEvent} e - the keyboard event
@@ -92,6 +102,8 @@ export const withKeyboardA11y = (WrappedComponent): any =>
     componentWillUnmount(): void {
       if (this._previouslyActiveElement && document.contains(this._previouslyActiveElement)) {
         focusElement(this._previouslyActiveElement);
+      } else if (this._previouslyActiveElement?.classList.contains('playkit-dropdown-item_kw')) {
+        focusElement(this._morePluginButton);
       }
     }
 
@@ -112,6 +124,7 @@ export const withKeyboardA11y = (WrappedComponent): any =>
           clearAccessibleChildren={this.clearAccessibleChildren}
           handleKeyDown={this.onKeyDown}
           setIsModal={this.setIsModel}
+          setMoreButton={this.setMoreButton}
         />
       );
     }
@@ -172,4 +185,8 @@ export const withKeyboardA11y = (WrappedComponent): any =>
     setIsModel = (isModel: boolean): void => {
       this.isModal = isModel;
     };
+
+    setMoreButton = (moreButton: HTMLButtonElement | null): void => {
+      this.morePluginButton = moreButton;
+    };
   };