Treat storage management progress bar as one tab stop

Previously, each element in the barLabels div was its own navigation
stop. With this change, we read all of the barLabels div as one
navigation stop for the entire bar itself.

When navigated to via ChromeVox, it will now speak "Storage Usage
Overview, In use X GBs Available Y GBs, Progress indicator"


Bug: 1007602
Change-Id: Ia458e3c90470c707fcabb25e4750a2e77f00ac61
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1910720
Commit-Queue: Bailey Berro <baileyberro@chromium.org>
Reviewed-by: Kyle Horimoto <khorimoto@chromium.org>
Reviewed-by: Steven Bennetts <stevenjb@chromium.org>
Cr-Commit-Position: refs/heads/master@{#714738}

chrome/app/settings_strings.grdp

@@ -4850,6 +4850,9 @@
     <message name="IDS_SETTINGS_STORAGE_EXTERNAL_STORAGE_LIST_HEADER" desc="Header of the list of external storage devices for the subpage for setting preferences for external storage. This is shown when the list is not empty.">
       Available devices
     </message>
+    <message name="IDS_SETTINGS_STORAGE_OVERVIEW_ARIA_LABEL" desc="The label to be read aloud by ChromeVox to describe the storage usage progress bar on the Storage page">
+      Storage Usage Overview
+    </message>
 
     <!-- Power -->
     <message name="IDS_SETTINGS_POWER_TITLE" desc="In Device Settings, the title for power management.">

chrome/browser/resources/settings/device_page/storage.html

@@ -178,8 +178,11 @@
     <div class="settings-box first">
       <div id="barArea">
         <progress id="bar" class$="[[getBarClass_(sizeStat_.spaceState)]]"
-            value="[[sizeStat_.usedRatio]]"></progress>
-        <div id="barLabels">
+            value="[[sizeStat_.usedRatio]]"
+            aria-label="$i18n{storageOverviewAriaLabel}"
+            aria-describedby="barLabels">
+        </progress>
+        <div id="barLabels" aria-hidden="true">
           <div id="inUseLabelArea" class="bar-label">
             <div class="vertical-line"></div>
             <div class="wrapper"><span>$i18n{storageItemInUse}</span></div>

chrome/browser/ui/webui/settings/settings_localized_strings_provider.cc

@@ -1094,7 +1094,9 @@ void AddDeviceStrings(content::WebUIDataSource* html_source) {
       {"storageExternalStorageEmptyListHeader",
        IDS_SETTINGS_STORAGE_EXTERNAL_STORAGE_EMPTY_LIST_HEADER},
       {"storageExternalStorageListHeader",
-       IDS_SETTINGS_STORAGE_EXTERNAL_STORAGE_LIST_HEADER}};
+       IDS_SETTINGS_STORAGE_EXTERNAL_STORAGE_LIST_HEADER},
+      {"storageOverviewAriaLabel", IDS_SETTINGS_STORAGE_OVERVIEW_ARIA_LABEL}};
+
   AddLocalizedStringsBulk(html_source, kStorageStrings,
                           base::size(kStorageStrings));