[Nearby] Improve Chromevox readability on discovery page

- Add radiogroup role to share target list.
- Label share target list with page subtitle so that it's clear what the
  list is for.
- Make share target list an aria-live region so that new share targets
  are announced as they arrive.
- Add aria-modal="true" to page template.

Bug: b/163036847
Change-Id: I4ff89d4ad635c7299198d95249f6b5accbe3e6f0
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2485875
Commit-Queue: Curt Clemens <cclem@google.com>
Reviewed-by: Kyle Horimoto <khorimoto@chromium.org>
Cr-Commit-Position: refs/heads/master@{#818669}

chrome/browser/resources/nearby_share/nearby_discovery_page.html

@@ -77,11 +77,15 @@
       <iron-list items="[[shareTargets_]]" id="deviceList"
           selected-item="{{selectedShareTarget}}"
           on-selected-item-changed="onSelectedShareTargetChanged_"
-          aria-rowcount$="[[shareTargets_.length]]" preserve-focus
-          selection-enabled>
+          preserve-focus selection-enabled
+          role="radiogroup" aria-live="polite"
+          aria-label="$i18n{nearbyShareDiscoveryPageSubtitle}">
         <template>
           <nearby-device tabindex$="[[tabIndex]]" share-target="[[item]]"
               is-selected="[[isShareTargetSelected_(
+                               item, selectedShareTarget)]]"
+              role="radio"
+              aria-checked$="[[isShareTargetSelectedStr_(
                                item, selectedShareTarget)]]">
           </nearby-device>
         </template>

chrome/browser/resources/nearby_share/nearby_discovery_page.js

@@ -286,6 +286,15 @@ Polymer({
     return this.selectedShareTarget === shareTarget;
   },
 
+  /**
+   * @param {!nearbyShare.mojom.ShareTarget} shareTarget
+   * @return {string}
+   * @private
+   */
+  isShareTargetSelectedStr_(shareTarget) {
+    return this.isShareTargetSelected_(shareTarget).toString();
+  },
+
   /**
    * Updates the selected share target to |shareTarget| if its id matches |id|.
    * @param {!mojoBase.mojom.UnguessableToken} id

chrome/browser/resources/nearby_share/shared/nearby_page_template.html

@@ -49,7 +49,8 @@
         margin-inline-end: auto;
       }
     </style>
-    <div id="pageContainer">
+    <div id="pageContainer" role="dialog" aria-modal="true"
+        aria-labelledby="pageTitle pageSubTitle">
       <div id="header">
         <div id="pageTitle">[[title]]</div>
         <div id="pageSubTitle">[[subTitle]]</div>