ChromeOS OOBE: fix focus flow in MD-OOBE.

chrome/browser/resources/chromeos/login/oobe_welcome.html

Index: chrome/browser/resources/chromeos/login/oobe_welcome.html
diff --git a/chrome/browser/resources/chromeos/login/oobe_welcome.html b/chrome/browser/resources/chromeos/login/oobe_welcome.html
index 8797fddfe546aaacf8e3ddd9a9a0012f5f6b4c6c..321ad48b479d360e9700deebf78d058f9c600302 100644
--- a/chrome/browser/resources/chromeos/login/oobe_welcome.html
+++ b/chrome/browser/resources/chromeos/login/oobe_welcome.html
@@ -57,7 +57,8 @@
     <link rel="stylesheet" href="oobe_dialog_host.css">
     <link rel="stylesheet" href="oobe_welcome.css">
     <link rel="stylesheet" href="oobe_dialog_parameters.css">
-    <oobe-welcome-dialog id="welcomeScreen" hidden="[[!welcomeScreenShown]]"
+    <oobe-welcome-dialog id="welcomeScreen" role="dialog"
+        aria-label="$i18n{networkScreenGreeting}"
         current-language="[[currentLanguage]]"
         on-language-button-clicked="onWelcomeSelectLanguageButtonClicked_"
         on-accessibility-button-clicked="onWelcomeAccessibilityButtonClicked_"
@@ -66,8 +67,8 @@
         timezone-button-visible="[[isTimezoneButtonVisible_(highlightStrength)]]"
         >
     </oobe-welcome-dialog>
-    <oobe-dialog id="languageScreen" hidden="[[!languageSelectionScreenShown]]"
-       has-buttons>
+    <oobe-dialog id="languageScreen" role="dialog" hidden has-buttons
+        aria-label="$i18n{languageSectionTitle}">
       <iron-icon icon="icons:language" class="oobe-icon"></iron-icon>
       <div class="header">
         <h1 class="title">$i18n{languageSectionTitle}</h1>
@@ -81,8 +82,7 @@
             </div>
             <oobe-i18n-dropdown id="languageSelect" items="[[languages]]"
                 on-select-item="onLanguageSelected_"
-                aria-label="[[formatMessage_('languageDropdownLabel',
-                    currentLanguage)]]">
+                class="focus-on-show">
             </oobe-i18n-dropdown>
           </div>
           <div id="keyboardDropdownContainer"
@@ -91,9 +91,7 @@
               $i18n{keyboardDropdownTitle}
             </div>
             <oobe-i18n-dropdown id="keyboardSelect" items="[[keyboards]]"
-                on-select-item="onKeyboardSelected_"
-                aria-label="[[formatMessage_('keyboardDropdownLabel',
-                    currentKeyboard)]]">
+                on-select-item="onKeyboardSelected_">
             </oobe-i18n-dropdown>
           </div>
         </template>
@@ -104,8 +102,8 @@
         </oobe-text-button>
       </div>
     </oobe-dialog>
-    <oobe-dialog id="accessibilityScreen"
-        hidden="[[!accessibilityOptionsScreenShown]]" has-buttons>
+    <oobe-dialog id="accessibilityScreen" role="dialog" hidden has-buttons
+        aria-label="$i18n{accessibilitySectionTitle}">
       <iron-icon icon="icons:accessibility" class="oobe-icon"></iron-icon>
       <div class="header">
         <h1 class="title">$i18n{accessibilitySectionTitle}</h1>
@@ -115,7 +113,8 @@
         <oobe-a11y-option checked="[[a11yStatus.spokenFeedbackEnabled]]"
             on-change="onA11yOptionChanged_"
             chrome-message="enableSpokenFeedback"
-            aria-label="$i18n{spokenFeedbackOption}">
+            label="$i18n{spokenFeedbackOption}"
+            class="focus-on-show">
           <span class="title">$i18n{spokenFeedbackOption}</span>
           <span class="checked-value">$i18n{spokenFeedbackOptionOn}</span>
           <span class="unchecked-value">$i18n{spokenFeedbackOptionOff}</span>
@@ -123,7 +122,7 @@
         <oobe-a11y-option checked="[[a11yStatus.largeCursorEnabled]]"
             on-change="onA11yOptionChanged_"
             chrome-message="enableLargeCursor"
-            aria-label="$i18n{largeCursorOption}">
+            label="$i18n{largeCursorOption}">
           <span class="title">$i18n{largeCursorOption}</span>
           <span class="checked-value">$i18n{largeCursorOptionOn}</span>
           <span class="unchecked-value">$i18n{largeCursorOptionOff}</span>
@@ -131,7 +130,7 @@
         <oobe-a11y-option checked="[[a11yStatus.highContrastEnabled]]"
             on-change="onA11yOptionChanged_"
             chrome-message="enableHighContrast"
-            aria-label="$i18n{highContrastOption}">
+            label="$i18n{highContrastOption}">
           <span class="title">$i18n{highContrastOption}</span>
           <span class="checked-value">$i18n{highContrastOptionOn}</span>
           <span class="unchecked-value">$i18n{highContrastOptionOff}</span>
@@ -139,7 +138,7 @@
         <oobe-a11y-option checked="[[a11yStatus.screenMagnifierEnabled]]"
             on-change="onA11yOptionChanged_"
             chrome-message="enableScreenMagnifier"
-            aria-label="$i18n{screenMagnifierOption}">
+            label="$i18n{screenMagnifierOption}">
           <span class="title">$i18n{screenMagnifierOption}</span>
           <span class="checked-value">$i18n{screenMagnifierOptionOn}</span>
           <span class="unchecked-value">$i18n{screenMagnifierOptionOff}</span>
@@ -147,7 +146,7 @@
         <oobe-a11y-option checked="[[a11yStatus.virtualKeyboardEnabled]]"
             on-change="onA11yOptionChanged_"
             chrome-message="enableVirtualKeyboard"
-            aria-label="$i18n{virtualKeyboardOption}">
+            label="$i18n{virtualKeyboardOption}">
           <span class="title">$i18n{virtualKeyboardOption}</span>
           <span class="checked-value">$i18n{virtualKeyboardOptionOn}</span>
           <span class="unchecked-value">$i18n{virtualKeyboardOptionOff}</span>
@@ -159,8 +158,8 @@
         </oobe-text-button>
       </div>
     </oobe-dialog>
-    <oobe-dialog id="timezoneScreen" hidden="[[!timezoneScreenShown]]"
-       has-buttons>
+    <oobe-dialog id="timezoneScreen" role="dialog" hidden has-buttons
+        aria-label="$i18n{timezoneSectionTitle}">
       <iron-icon icon="oobe-welcome-64:timezone" class="oobe-icon"></iron-icon>
       <div class="header">
         <h1 class="title">$i18n{timezoneSectionTitle}</h1>
@@ -172,7 +171,7 @@
           </div>
           <oobe-i18n-dropdown id="timezoneSelect" items="[[timezones]]"
               on-select-item="onTimezoneSelected_"
-              aria-label="$i18n{timezoneDropdownTitle}">
+              label="$i18n{timezoneDropdownTitle}" class="focus-on-show">
           </oobe-i18n-dropdown>
         </div>
       </div>
@@ -182,8 +181,9 @@
         </oobe-text-button>
       </div>
     </oobe-dialog>
-    <oobe-dialog id="networkSelectionScreen"
-        hidden="[[!networkSelectionScreenShown]]" has-buttons>
+    <oobe-dialog id="networkSelectionScreen" role="dialog" hidden has-buttons
+        aria-label="$i18n{networkSectionTitle}"
+        on-show-dialog="onNetworkSelectionScreenShown_">
       <iron-icon icon="oobe-welcome:wifi" class="oobe-icon"></iron-icon>
       <div class="header">
         <h1 class="title">$i18n{networkSectionTitle}</h1>
@@ -194,8 +194,9 @@
             on-default-network-changed="onDefaultNetworkChanged_"
             on-network-item-selected="onNetworkListNetworkItemSelected_"
             on-custom-item-selected="onNetworkListCustomItemSelected_"
-            custom-items="[[_getNetworkCustomItems()]]"
-            no-bottom-scroll-border>
+            custom-items="[[getNetworkCustomItems_()]]"
+            no-bottom-scroll-border
+            class="focus-on-show">
         </cr-network-select>
       </div>
       <div class="bottom-buttons layout horizontal justified">