Basic keyboard access for recently_closed menu on NTP (re-work).

chrome/browser/resources/shared/js/cr/ui/menu.js

 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 cr.define('cr.ui', function() {
 
   /** @const */ var MenuItem = cr.ui.MenuItem;
 
   /**
    * Creates a new menu element. Menu dispatches all commands on the element it
@@ skipping 16 matching lines @@
     contextElement: null,
 
     /**
      * Initializes the menu element.
      */
     decorate: function() {
       this.addEventListener('mouseover', this.handleMouseOver_);
       this.addEventListener('mouseout', this.handleMouseOut_);
 
       this.classList.add('decorated');
+      this.setAttribute('role', 'menu');
       this.hidden = true;  // Hide the menu by default.
 
       // Decorate the children as menu items.
       var children = this.children;
       for (var i = 0, child; child = children[i]; i++) {
         cr.ui.decorate(child, MenuItem);
       }
     },
 
     /**
@@ skipping 70 matching lines @@
      */
     get selectedItem() {
       return this.children[this.selectedIndex];
     },
     set selectedItem(item) {
       var index = Array.prototype.indexOf.call(this.children, item);
       this.selectedIndex = index;
     },
 
     /**
+     * Focuses the selected item. If selectedIndex is invalid, set it to 0
+     * first.
+     */
+    focusSelectedItem: function() {
+      if (this.selectedIndex < 0 ||
+          this.selectedIndex > this.children.length) {
+        this.selectedIndex = 0;
+      }
+
+      if (this.selectedItem)
+        this.selectedItem.focus();
+    },
+
+    /**
      * Menu length
      */
     get length() {
       return this.children.length;
     },
 
     /**
      * This is the function that handles keyboard navigation. This is usually
      * called by the element responsible for managing the menu.
      * @param {Event} e The keydown event object.
@@ skipping 29 matching lines @@
           if (item && !item.isSeparator() && !item.hidden && !item.disabled)
             break;
         }
         if (item && !item.disabled)
           self.selectedIndex = i;
       }
 
       switch (e.keyIdentifier) {
         case 'Down':
           selectNextAvailable(1);
+          this.focusSelectedItem();
           return true;
         case 'Up':
           selectNextAvailable(-1);
+          this.focusSelectedItem();
           return true;
         case 'Enter':
         case 'U+0020': // Space
           if (item) {
-            if (cr.dispatchSimpleEvent(item, 'activate', true, true)) {
+            var activationEvent = cr.doc.createEvent('Event');
+            activationEvent.initEvent('activate', true, true);
+            activationEvent.originalEvent = e;
+            if (item.dispatchEvent(activationEvent)) {
               if (item.command)
                 item.command.execute();
             }
           }
           return true;
       }
 
       return false;
     },
 
     /**
      * Updates menu items command according to context.
      * @param {Node=} node Node for which to actuate commands state.
      */
     updateCommands: function(node) {
       var children = this.children;
 
       for (var i = 0, child; child = children[i]; i++)
         child.updateCommand(node);
     }
   };
 
   function selectedIndexChanged(selectedIndex, oldSelectedIndex) {
     var oldSelectedItem = this.children[oldSelectedIndex];
-    if (oldSelectedItem)
+    if (oldSelectedItem) {
       oldSelectedItem.selected = false;
+      oldSelectedItem.blur();
+    }
     var item = this.selectedItem;
     if (item)
       item.selected = true;
   }
 
   /**
    * The selected menu item.
    * @type {number}
    */
   cr.defineProperty(Menu, 'selectedIndex', cr.PropertyKind.JS,
       selectedIndexChanged);
 
   // Export
   return {
     Menu: Menu
   };
 });