cr-network-select: implement focus()

ui/webui/resources/cr_elements/network/cr_network_list.js

 // Copyright 2015 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.
 
 /**
  * @fileoverview Polymer element for displaying a collapsable list of networks.
  */
 
 /**
  * Polymer class definition for 'cr-network-list'.
@@ skipping 49 matching lines @@
       value: function() {
         return [];
       },
     },
   },
 
   behaviors: [CrScrollableBehavior],
 
   observers: ['updateListItems_(networks, customItems)'],
 
+  /**
+    * True if element is focused, but dom-repeat is not rendered yet.
+    * @private
+    */
+  needFocus_: false,
+
+  attached: function() {
+    var self = this;
+    var observer = new MutationObserver(function() {
+      self.checkFocus_();
+    });
+    observer.observe(this.$.networkList, { childList: true });
+  },
+
+  focus: function() {
+    this.needFocus_ = false;
+    var items = this.$.networkList.getElementsByTagName('cr-network-list-item');
+    if (items && items[0]) {
+      items[0].focus();
+    } else {
+      this.needFocus_ = true;
+    }
+  },
+
+  /**
+    * Triggers delayed focus.
+    * @private
+    */
+  checkFocus_: function() {
+    if (this.needFocus_)
+      this.focus();
+  },
+
   /** @private */
   updateListItems_: function() {
     this.saveScroll(this.$.networkList);
     this.listItems_ = this.networks.concat(this.customItems);
     this.restoreScroll(this.$.networkList);
     this.updateScrollableContents();
+    this.checkFocus_();
   },
 
   /**
    * Use iron-list selection (which is not the same as focus) to trigger
    * tap (requires selection-enabled) or keyboard selection.
    * @private
    */
   selectedItemChanged_: function() {
     if (this.selectedItem)
       this.onItemAction_(this.selectedItem);
   },
 
   /**
    * @param {!CrNetworkList.CrNetworkListItemType} item
    * @private
    */
   onItemAction_: function(item) {
     if (item.hasOwnProperty('customItemName'))
       this.fire('custom-item-selected', item);
     else
       this.fire('selected', item);
   },
 });