Add ARIA live region on chat-content

This asks screen readers to read every message received, and is
mandatory for blind users to get notified of new messages.

CHANGES.md

@@ -2,6 +2,7 @@
 
 ## 4.1.1 (unreleased)
 
+- Accessibility: Tag the chat-content as an ARIA live region, for screen readers
 - #1408 new config option `roomconfig_whitelist`
 - #1421 fix direct invite for membersonly room
 

dist/converse.js

@@ -92295,7 +92295,7 @@ __p += '<!-- src/templates/chatarea.html -->\n<div class="chat-area col-md-9 col
  if (o.show_send_button) { ;
 __p += 'chat-content-sendbutton';
  } ;
-__p += '"></div>\n    <div class="message-form-container"/>\n</div>\n';
+__p += '" aria-live="polite"></div>\n    <div class="message-form-container"/>\n</div>\n';
 return __p
 };
 
@@ -92316,7 +92316,7 @@ __p += '<!-- src/templates/chatbox.html -->\n<div class="flyout box-flyout">\n
  if (o.show_send_button) { ;
 __p += 'chat-content-sendbutton';
  } ;
-__p += '"></div>\n        <div class="message-form-container"></div>\n    </div>\n</div>\n';
+__p += '" aria-live="polite"></div>\n        <div class="message-form-container"></div>\n    </div>\n</div>\n';
 return __p
 };
 

src/templates/chatarea.html

@@ -1,4 +1,4 @@
 <div class="chat-area col-md-9 col-8">
-    <div class="chat-content {[ if (o.show_send_button) { ]}chat-content-sendbutton{[ } ]}"></div>
+    <div class="chat-content {[ if (o.show_send_button) { ]}chat-content-sendbutton{[ } ]}" aria-live="polite"></div>
     <div class="message-form-container"/>
 </div>

src/templates/chatbox.html

@@ -1,6 +1,6 @@
 <div class="flyout box-flyout">
     <div class="chat-body">
-        <div class="chat-content {[ if (o.show_send_button) { ]}chat-content-sendbutton{[ } ]}"></div>
+        <div class="chat-content {[ if (o.show_send_button) { ]}chat-content-sendbutton{[ } ]}" aria-live="polite"></div>
         <div class="message-form-container"></div>
     </div>
 </div>