Merge pull request #7372 from KDSBrowne/_summit-improve-modal-title-announced

Improve labels announced for modal titles

bigbluebutton-html5/imports/ui/components/audio/audio-modal/component.jsx

@@ -96,6 +96,10 @@ const intlMessages = defineMessages({
     id: 'app.audioModal.connectingEchoTest',
     description: 'Message for echo test connecting',
   },
+  ariaModalTitle: {
+    id: 'app.audioModal.ariaTitle',
+    description: 'aria label for modal title',
+  },
 });
 
 class AudioModal extends Component {
@@ -452,6 +456,7 @@ class AudioModal extends Component {
           className={styles.modal}
           onRequestClose={closeModal}
           hideBorder
+          contentLabel={intl.formatMessage(intlMessages.ariaModalTitle)}
         >
           {!this.skipAudioOptions()
 

bigbluebutton-html5/imports/ui/components/lock-viewers/component.jsx

@@ -50,6 +50,10 @@ const intlMessages = defineMessages({
     id: 'app.lock-viewers.PrivateChatLable',
     description: 'description for close button',
   },
+  ariaModalTitle: {
+    id: 'app.lock-viewers.ariaTitle',
+    description: 'aria label for modal title',
+  },
 });
 
 class LockViewersComponent extends React.PureComponent {
@@ -68,11 +72,12 @@ class LockViewersComponent extends React.PureComponent {
         className={styles.modal}
         onRequestClose={closeModal}
         hideBorder
+        contentLabel={intl.formatMessage(intlMessages.ariaModalTitle)}
       >
 
         <div className={styles.container}>
           <div className={styles.header}>
-            <div className={styles.title}>{intl.formatMessage(intlMessages.lockViewersTitle)}</div>
+            <h2 className={styles.title}>{intl.formatMessage(intlMessages.lockViewersTitle)}</h2>
           </div>
           <div className={styles.description}>
             {`${intl.formatMessage(intlMessages.lockViewersDescription)}`}

bigbluebutton-html5/imports/ui/components/recording/component.jsx

@@ -78,6 +78,7 @@ class RecordingComponent extends React.PureComponent {
         className={styles.modal}
         onRequestClose={closeModal}
         hideBorder
+        contentLabel={title}
       >
         <div className={styles.container}>
           <div className={styles.header}>

bigbluebutton-html5/private/locales/en.json

@@ -340,6 +340,7 @@
     "app.breakoutTimeRemainingMessage": "Breakout room time remaining: {0}",
     "app.breakoutWillCloseMessage": "Time ended. Breakout room will close soon",
     "app.calculatingBreakoutTimeRemaining": "Calculating remaining time ...",
+    "app.audioModal.ariaTitle": "Join audio modal",
     "app.audioModal.microphoneLabel": "Microphone",
     "app.audioModal.listenOnlyLabel": "Listen only",
     "app.audioModal.audioChoiceLabel": "How would you like to join the audio?",
@@ -450,6 +451,7 @@
     "app.lock-viewers.PublicChatLabel": "Public chat",
     "app.lock-viewers.PrivateChatLable": "Private chat",
     "app.lock-viewers.Layout": "Layout",
+    "app.lock-viewers.ariaTitle": "Lock viewers modal",
     "app.recording.startTitle": "Start recording",
     "app.recording.stopTitle": "Pause recording",
     "app.recording.resumeTitle": "Resume recording",