32 lines
1.4 KiB
HTML
32 lines
1.4 KiB
HTML
<!doctype html>
|
|
<html lang="en"><meta charset="utf-8"><title>Cthulhu Browser Probe</title>
|
|
<body>
|
|
<button autofocus>Start live region probe</button>
|
|
<div aria-live="polite" aria-atomic="true"><span>Download status:</span> <span id="atomic">Waiting</span></div>
|
|
<div aria-live="polite" aria-atomic="true"><span>Account status:</span> <span id="addition"></span></div>
|
|
<div aria-live="polite" aria-atomic="false"><span>Outer context:</span> <span id="non-atomic">Waiting</span></div>
|
|
<div id="busy" aria-live="polite" aria-atomic="true" aria-busy="true"><span>Busy status:</span> <span id="busy-value">Waiting</span></div>
|
|
<script>
|
|
document.addEventListener('keydown', event => {
|
|
if (event.key === 'F9') {
|
|
document.getElementById('atomic').firstChild.data = 'Completed';
|
|
} else if (event.key === 'F10') {
|
|
const child = document.createElement('span');
|
|
child.textContent = 'Verified';
|
|
document.getElementById('addition').appendChild(child);
|
|
} else if (event.key === 'F11') {
|
|
document.getElementById('non-atomic').firstChild.data = 'Inner update';
|
|
} else if (event.key === 'F12') {
|
|
const region = document.getElementById('busy');
|
|
region.setAttribute('aria-busy', 'true');
|
|
document.getElementById('busy-value').firstChild.data = 'Intermediate update';
|
|
} else if (event.key === 'F7') {
|
|
document.getElementById('busy').setAttribute('aria-busy', 'false');
|
|
} else {
|
|
return;
|
|
}
|
|
event.preventDefault();
|
|
});
|
|
</script>
|
|
</body></html>
|