Settings People Revamp: Update ManageProfileHandler to use Promises.

chrome/browser/resources/settings/people_page/manage_profile.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
  * 'settings-manage-profile' is the settings subpage containing controls to
  * edit a profile's name, icon, and desktop shortcut.
  */
 Polymer({
@@ skipping 26 matching lines @@
      */
     browserProxy_: {
       type: Object,
       value: function() {
         return settings.ManageProfileBrowserProxyImpl.getInstance();
       },
     },
   },
 
   /** @override */
   attached: function() {

[dpapad, 2016/04/07 20:34:24]

Nit (optional): you can reuse the same function twice here.

attached: function() {
  var setIcons = function(iconUrls) {
    this.availableIconUrls = iconUrls;
  }.bind(this);

  this.addWebUIListener('available-icons-changed', setIcons);
  this.browserProxy_.getAvailableIcons().then(setIcons);
},

OR you could also start listening only after receiving the direct response as
follows. This seems a bit safer in terms of race-conditions, but in practice I
don't think it makes any difference.

attached: function() {
  var setIcons = function(iconUrls) {
    this.availableIconUrls = iconUrls;
  }.bind(this);

  this.browserProxy_.getAvailableIcons().then(function(iconUrls) {
    setIcons(iconUrls);
    this.addWebUIListener('available-icons-changed', setIcons);
  }.bind(this);
},

[tommycli, 2016/04/07 20:48:38]

I did the first option. I don't think it's racy unless the C++
CallJavaScriptFunction method have their calls reordered.

I think in the second option, technically the profile avatar can be updated
after the getAvailableIcons() is handled, and before the WebUI listener is
attached.

     this.addWebUIListener('available-icons-changed', function(iconUrls) {
       this.availableIconUrls = iconUrls;
     }.bind(this));
 
-    this.browserProxy_.getAvailableIcons();
+    this.browserProxy_.getAvailableIcons().then(function(iconUrls) {
+      this.availableIconUrls = iconUrls;
+    }.bind(this));
   },
 
   /**
    * Handler for when the profile name field is changed, then blurred.
    * @private
    * @param {!Event} event
    */
   onProfileNameChanged_: function(event) {
     if (event.target.invalid)
       return;
 
     this.browserProxy_.setProfileIconAndName(this.profileIconUrl,
                                              event.target.value);
   },
 
   /**
    * Handler for when the an image is activated.
    * @param {!Event} event
    * @private
    */
   onIconActivate_: function(event) {
     /** @type {{iconUrl: string}} */
     var buttonData = event.detail.item.dataset;
     this.browserProxy_.setProfileIconAndName(buttonData.iconUrl,
                                              this.profileName);
   },
 });