Почему мой регион Aria Live объявляет только первое обновление только при использовании веб -компонента? ⇐ Javascript

[Anonymous]

Я создаю пользовательский веб -компонент, который отображает статистику устойчивости в прямом эфире для отелей. Обновления компонентов CO₂ сбережения в режиме реального времени, и я хочу, чтобы считыватели экрана объявили об обновлениях, используя живой регион Aria.

Код: Выделить всё

class LiveStats extends HTMLElement {
constructor() {
super();
this.attachShadow({ mode: "open" });
this.shadowRoot.innerHTML = `
CO₂ Saved: 10kg
`;
}

updateCO2(newValue) {
const output = this.shadowRoot.getElementById("co2-output");
output.textContent = `CO₂ Saved: ${newValue}kg`;
}
}

customElements.define("live-stats", LiveStats);

Я ожидал, что вызов updateco2 (15) запустит объявление считывателя экрана для нового значения.

Код: Выделить всё

output.textContent = "";
setTimeout(() => {
output.textContent = `CO₂ Saved: ${newValue}kg`;
}, 10);

Но это не работает надежно.
Являются ли в живых регионах ARIA в Shadow Dom ненадежны, или есть еще один метод, чтобы гарантировать, что считыватели экрана постоянно читают динамические обновления?

Подробнее здесь: https://stackoverflow.com/questions/795 ... -a-web-com