From ee4752cebd36f896e78e11c7856b7b4e09603bd9 Mon Sep 17 00:00:00 2001 From: Tzipi-kaltura Date: Thu, 7 Nov 2024 14:16:07 +0200 Subject: [PATCH 1/2] fix(ADA-1777): University of Illinois Urbana-Champaign (ADA) V7 player issues Priority 2(#8) transcript panel does not immediately follow the toggle button --- .../upper-bar-manager/upper-bar-manager.tsx | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/services/upper-bar-manager/upper-bar-manager.tsx b/src/services/upper-bar-manager/upper-bar-manager.tsx index fe28700..48dd4ae 100644 --- a/src/services/upper-bar-manager/upper-bar-manager.tsx +++ b/src/services/upper-bar-manager/upper-bar-manager.tsx @@ -76,6 +76,20 @@ export class UpperBarManager { return icons.sort((a, b) => iconsOrder[a.displayName] - iconsOrder[b.displayName]); } + public focusPluginButton(pluginName: string) { + let pluginButton; + const controls = this.getControls(this.iconsOrder); + const pluginElement = controls.find((control) => control.displayName === pluginName)?.componentRef?.current + ?.base as HTMLElement; + if (pluginElement) { + pluginButton = pluginElement.querySelector('button'); + } else { + const rightControls = this.displayedBarComponentRefs.Playback.current?.base as HTMLElement; + const buttons = rightControls.getElementsByTagName('button'); + pluginButton = buttons[buttons.length - 1]; + } + pluginButton?.focus(); + } private injectDisplayedBarComponentWrapper(): void { const iconsOrder = this.iconsOrder; for (const preset of UPPER_BAR_PRESETS) { From 5a6ee0ee484e1e1900de6c22c73a3c7347d67d2c Mon Sep 17 00:00:00 2001 From: Tzipi-kaltura Date: Thu, 7 Nov 2024 16:08:45 +0200 Subject: [PATCH 2/2] use plugin ID instead of name, select from dom according to tabindex and not button tag --- src/services/upper-bar-manager/upper-bar-manager.tsx | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/src/services/upper-bar-manager/upper-bar-manager.tsx b/src/services/upper-bar-manager/upper-bar-manager.tsx index 48dd4ae..fe57d03 100644 --- a/src/services/upper-bar-manager/upper-bar-manager.tsx +++ b/src/services/upper-bar-manager/upper-bar-manager.tsx @@ -76,17 +76,16 @@ export class UpperBarManager { return icons.sort((a, b) => iconsOrder[a.displayName] - iconsOrder[b.displayName]); } - public focusPluginButton(pluginName: string) { + public focusPluginButton(pluginId: number) { let pluginButton; const controls = this.getControls(this.iconsOrder); - const pluginElement = controls.find((control) => control.displayName === pluginName)?.componentRef?.current - ?.base as HTMLElement; + const pluginElement = controls.find((control) => control.id === pluginId)?.componentRef?.current?.base as HTMLElement; if (pluginElement) { - pluginButton = pluginElement.querySelector('button'); + pluginButton = pluginElement.querySelector('[tabindex="0"]') as HTMLElement; } else { const rightControls = this.displayedBarComponentRefs.Playback.current?.base as HTMLElement; - const buttons = rightControls.getElementsByTagName('button'); - pluginButton = buttons[buttons.length - 1]; + const buttons = rightControls.querySelectorAll('[tabindex="0"]'); + pluginButton = buttons[buttons.length - 1] as HTMLElement; } pluginButton?.focus(); }