Commit ccd9ebb1 authored by Dan Beam's avatar Dan Beam Committed by Commit Bot

Local NTP, Realbox: improve experience for screenreader users

* fixes .role = ...; vs setAttribute(role, ...) booboo
* makes #realbox politely live so that up/down utter something

R=dpapad@chromium.org

Bug: 1017915
Fixed: 1017877
Change-Id: I9ed26ebe0ff3fe9cfa71ee4a9d2f73e80c28e101
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1885631
Auto-Submit: Dan Beam <dbeam@chromium.org>
Reviewed-by: default avatarDemetrios Papadopoulos <dpapad@chromium.org>
Commit-Queue: Dan Beam <dbeam@chromium.org>
Cr-Commit-Position: refs/heads/master@{#710200}
parent 3b79dc7c
......@@ -80,7 +80,7 @@
<div id="realbox-input-wrapper">
<div class="google-g-icon"></div>
<input id="realbox" type="search" autocomplete="off" spellcheck="false"
autofocus>
aria-live="polite" autofocus>
<button id="realbox-microphone" class="microphone-icon" hidden></button>
<div id="realbox-matches"></div>
</div>
......
......@@ -1432,13 +1432,13 @@ function overrideExecutableTimeoutForTesting(timeout) {
*/
function populateAutocompleteMatches(matches) {
const realboxMatchesEl = document.createElement('div');
realboxMatchesEl.role = 'listbox';
realboxMatchesEl.setAttribute('role', 'listbox');
for (let i = 0; i < matches.length; ++i) {
const match = matches[i];
const matchEl = document.createElement('a');
matchEl.href = match.destinationUrl;
matchEl.role = 'option';
matchEl.setAttribute('role', 'option');
if (match.isSearchType) {
const icon = document.createElement('div');
......
......@@ -163,10 +163,12 @@ test.realbox.testReplyWithMatches = function() {
const matchesEl = $(test.realbox.IDS.REALBOX_MATCHES);
assertTrue(!!matchesEl);
assertTrue(matchesEl.hasAttribute('role'));
assertEquals(matches.length, matchesEl.children.length);
assertEquals(matches[0].destinationUrl, matchesEl.children[0].href);
assertEquals(matches[1].destinationUrl, matchesEl.children[1].href);
assertEquals(matches[1].textContent, matchesEl.children[1].contents);
assertTrue(matchesEl.children[0].hasAttribute('role'));
};
test.realbox.testReplyWithInlineAutocompletion = function() {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment