ADA-1065-Added aria-labelby attribute to the dialog

kaltura · Jun 20, 2024 · 8dc2258 · 8dc2258
1 parent 3152d84
commit 8dc2258
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 2 deletions.
diff --git a/src/components/cvaa-overlay/main-captions_window.tsx b/src/components/cvaa-overlay/main-captions_window.tsx
@@ -75,7 +75,7 @@ class MainCaptionsWindow extends Component<any, any> {
   render(props: any): VNode<any> {
     return (
       <div className={[style.overlayScreen, style.active].join(' ')}>
-        <h2 className={style.title}>
+        <h2 className={style.title} id="captionsDialogTitle">
           <Text id={'cvaa.title'} />
         </h2>
         <div role="group">

diff --git a/src/components/overlay/overlay.tsx b/src/components/overlay/overlay.tsx
@@ -140,7 +140,7 @@ class Overlay extends Component<any, any> {
     }
 
     return (
-      <div tabIndex={-1} className={overlayClass.join(' ')} role="dialog" onKeyDown={this.onKeyDown} aria-label={label}>
+      <div tabIndex={-1} className={overlayClass.join(' ')} role="dialog" onKeyDown={this.onKeyDown} aria-labelledby="captionsDialogTitle">
         <div className={style.overlayContents}>{this.props.children}</div>
         {this.renderCloseButton(this.props)}
       </div>