At some point recently (I believe during the v80 update) Chrome has started sending the entire contents of an aria-live element to the screen reader whenever content is added. Previous to this, it used to only announce the additions. Firefox still works like it's supposed to, only announcing the additions to this element. I am testing using NVDA, but my users have reported the same behavior with JAWS as well. Here is some simple code to illustrate the behavior (you need to have a screen reader on to get the idea here).
<html>
<head>
<script>
function addtologinner()
{
document.getElementById('log').innerHTML += '<div><p>Event happened at ' + gettime() + '</p></div>';
}
function addtologappend()
{
var div = document.createElement('div');
div.innerHTML = '<p>Event happened at ' + gettime() + '</p>';
document.getElementById('log').appendChild(div);
}
function gettime()
{
return (new Date()).toJSON().slice(11,19);
}
</script>
</head>
<body>
<button onclick="addtologappend();">Append to Log</button>
<button onclick="addtologinner();">Add to innerHTML</button><br />
<div id="log" aria-live="polite" aria-atomic="false" aria-relevant="additions text" role="log"></div>
</body>
</html>
This was working previously in all major browsers, having the screen reading report only the changes, but my users reported this issue this week. Changing the values of the aria-atomic and aria-relevant attributes does nothing. It is as if Chrome is not respecting those attributes anymore, when it used to default to false/additions respectively. I have not had a chance to test in Edge or Safari, most of my users are using Chrome. Any ideas on how to work around this? I didn't find anything in the last patch notes for version 80 relating to this.