Make the OOBE network menu accessible by improving keyboard handling

chrome/browser/resources/chromeos/login/network_dropdown.js

Index: chrome/browser/resources/chromeos/login/network_dropdown.js
===================================================================
--- chrome/browser/resources/chromeos/login/network_dropdown.js	(revision 101071)
+++ chrome/browser/resources/chromeos/login/network_dropdown.js	(working copy)
@@ -24,6 +24,8 @@
       this.selectedItem = null;
       // First item which could be selected.
       this.firstItem = null;
+
+      this.setAttribute('role', 'menu');
     },
 
     /**
@@ -35,6 +37,8 @@
         this.selectedItem.classList.remove('hover');
       selectedItem.classList.add('hover');
       this.selectedItem = selectedItem;
+      this.previousSibling.setAttribute(
+          'aria-activedescendant', this.id + selectedItem.id);

[altimofeev, 2011/09/19 08:13:14]

Shouldn't it be just 'selectedItem.id'?

     }
   };
 
@@ -53,11 +57,14 @@
     /** @inheritDoc */
     decorate: function() {
       this.appendChild(this.createOverlay_());
-      this.appendChild(this.createTitle_());
+      this.appendChild(this.title_ = this.createTitle_());
       this.appendChild(new DropDownContainer());
 
       this.isShown = false;
       this.addEventListener('keydown', this.keyDownHandler_);
+
+      this.title_.id = this.id + '-dropdown';
+      this.title_.setAttribute('role', 'listbox');
     },
 
     /**
@@ -166,6 +173,8 @@
       if (item.id > 0) {
         var wrapperDiv = this.ownerDocument.createElement('div');
         wrapperDiv.classList.add('dropdown-item-container');
+        wrapperDiv.setAttribute('role', 'menuitem');
+        wrapperDiv.id = this.id + item.id;
         var imageDiv = this.ownerDocument.createElement('div');
         imageDiv.classList.add('dropdown-image');
         imageDiv.appendChild(image);
@@ -213,6 +222,7 @@
      */
     createTitle_: function() {
       var image = this.ownerDocument.createElement('img');
+      image.alt = "";
       var text = this.ownerDocument.createElement('div');
 
       var el = this.ownerDocument.createElement('div');
@@ -254,8 +264,6 @@
      * @param {!Event} e Keydown event.
      */
     keyDownHandler_: function(e) {
-      if (!this.isShown)

[altimofeev, 2011/09/19 08:13:14]

Why do you need handle keys if menu isn't shown?

-        return;
       var selected = this.container.selectedItem;
       switch (e.keyCode) {
         case 38: {  // Key up.
@@ -285,6 +293,8 @@
           break;
         }
         case 13: {  // Enter.
+          if (!this.isShown)
+            return;
           var button = this.titleButton;
           if (!button.opening) {
             button.focus();