Settings People Revamp: Change Picture: Update to new C++ <-> JS method.

This uses the FooBrowserProxy pattern for JS -> C++ communication and
the WebUIListener pattern for the C++ -> JS communication.

BUG=563721

Review URL: https://codereview.chromium.org/1780573002

Cr-Commit-Position: refs/heads/master@{#380178}

10 files changed, 239 insertions, 200 deletions

diff --git a/chrome/browser/resources/settings/people_page/change_picture.html b/chrome/browser/resources/settings/people_page/change_picture.html
index bfd8002..146c818 100644
--- a/chrome/browser/resources/settings/people_page/change_picture.html
+++ b/chrome/browser/resources/settings/people_page/change_picture.html
@@ -1,4 +1,5 @@
 <link rel="import" href="chrome://resources/html/i18n_behavior.html">
+<link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
 <link rel="import" href="chrome://resources/html/util.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-a11y-keys/iron-a11y-keys.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icons/image-icons.html">
@@ -7,7 +8,7 @@
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/polymer/polymer.html">
 <link rel="import" href="chrome://md-settings/people_page/camera.html">
-<link rel="import" href="chrome://md-settings/people_page/change_picture_private_api.html">
+<link rel="import" href="chrome://md-settings/people_page/change_picture_browser_proxy.html">
 <link rel="import" href="chrome://md-settings/settings_shared_css.html">
 
 <dom-module id="settings-change-picture">
diff --git a/chrome/browser/resources/settings/people_page/change_picture.js b/chrome/browser/resources/settings/people_page/change_picture.js
index f091ae2..b59bea2 100644
--- a/chrome/browser/resources/settings/people_page/change_picture.js
+++ b/chrome/browser/resources/settings/people_page/change_picture.js
@@ -35,6 +35,7 @@ Polymer({
 
   behaviors: [
     I18nBehavior,
+    WebUIListenerBehavior,
   ],
 
   properties: {
@@ -75,11 +76,11 @@ Polymer({
      */
     profileImageUrl_: {
       type: String,
-      value: settings.ChangePicturePrivateApi.ButtonImages.PROFILE_PICTURE,
+      value: 'chrome://theme/IDR_PROFILE_PICTURE_LOADING',
     },
 
     /**
-     * The default user images. Populated by ChangePicturePrivateApi.
+     * The default user images.
      * @private {!Array<!settings.DefaultImage>}
      */
     defaultImages_: {
@@ -90,7 +91,7 @@ Polymer({
     /**
      * The fallback image to be selected when the user discards the 'old' image.
      * This may be null if the user started with the 'old' image.
-     * @private {settings.ChangePictureImageElement}
+     * @private {?settings.ChangePictureImageElement}
      */
     fallbackImage_: {
       type: settings.ChangePictureImageElement,
@@ -106,86 +107,100 @@ Polymer({
       type: String,
       value: '',
     },
+
+    /** @private {!settings.ChangePictureBrowserProxyImpl} */
+    browserProxy_: {
+      type: Object,
+      value: function() {
+        return settings.ChangePictureBrowserProxyImpl.getInstance();
+      },
+    },
   },
 
   /** @override */
   attached: function() {
-    // This is the interface called by the C++ handler.
-    var nativeInterface = {
-      /**
-       * Called from C++ to provide the default set of images.
-       * @param {!Array<!settings.DefaultImage>} images
-       */
-      receiveDefaultImages: function(images) {
-        this.defaultImages_ = images;
-      }.bind(this),
-
-      /**
-       * Called from C++ to provide the URL of the selected image. Is only
-       * called with default images.
-       * @param {string} imageUrl
-       */
-      receiveSelectedImage: function(imageUrl) {
-        var index = this.$.selector.items.findIndex(function(image) {
-          return image.dataset.type == 'default' && image.src == imageUrl;
-        });
-        assert(index != -1, 'Default image not found: ' + imageUrl);
-
-        this.fallbackImage_ = this.$.selector.items[index];
-
-        // If user is currently taking a photo, do not steal the focus.
-        if (!this.selectedItem_ || this.selectedItem_.dataset.type != 'camera')
-          this.$.selector.select(index);
-      }.bind(this),
-
-      /**
-       * Called from C++ to provide the URL of the 'old' image. The 'old'
-       * image is any selected non-profile and non-default image. It can be
-       * from the camera, a file, or a deprecated default image. When this
-       * method is called, the old image becomes the selected image.
-       * @param {string} imageUrl
-       */
-      receiveOldImage: function(imageUrl) {
-        this.oldImageUrl_ = imageUrl;
-        this.$.selector.select(this.$.selector.indexOf(this.$.oldImage));
-      }.bind(this),
-
-      /**
-       * Called from C++ to provide the URL of the profile image.
-       * @param {string} imageUrl
-       * @param {boolean} selected
-       */
-      receiveProfileImage: function(imageUrl, selected) {
-        this.profileImageUrl_ = imageUrl;
-        this.$.profileImage.alt = this.i18n('profilePhoto');
-
-        if (!selected)
-          return;
-
-        this.fallbackImage_ = this.$.profileImage;
-
-        // If user is currently taking a photo, do not steal the focus.
-        if (!this.selectedItem_ || this.selectedItem_.dataset.type != 'camera')
-          this.$.selector.select(this.$.selector.indexOf(this.$.profileImage));
-      }.bind(this),
-
-      /**
-       * Called from the C++ to notify page about camera presence.
-       * @param {boolean} cameraPresent
-       */
-      receiveCameraPresence: function(cameraPresent) {
-        this.cameraPresent_ = cameraPresent;
-      }.bind(this),
-    };
-
-    cr.define('settings', function() {
-      var ChangePicturePage = nativeInterface;
-      return {
-        ChangePicturePage: ChangePicturePage,
-      };
+    this.addWebUIListener('default-images-changed',
+                          this.receiveDefaultImages_.bind(this));
+    this.addWebUIListener('selected-image-changed',
+                          this.receiveSelectedImage_.bind(this));
+    this.addWebUIListener('old-image-changed',
+                          this.receiveOldImage_.bind(this));
+    this.addWebUIListener('profile-image-changed',
+                          this.receiveProfileImage_.bind(this));
+    this.addWebUIListener('camera-presence-changed',
+                          this.receiveCameraPresence_.bind(this));
+
+    this.browserProxy_.initialize();
+  },
+
+  /**
+   * Handler for the 'default-images-changed' event.
+   * @param {!Array<!settings.DefaultImage>} images
+   * @private
+   */
+  receiveDefaultImages_: function(images) {
+    this.defaultImages_ = images;
+  },
+
+  /**
+   * Handler for the 'selected-image-changed' event. Is only called with
+   * default images.
+   * @param {string} imageUrl
+   * @private
+   */
+  receiveSelectedImage_: function(imageUrl) {
+    var index = this.$.selector.items.findIndex(function(image) {
+      return image.dataset.type == 'default' && image.src == imageUrl;
     });
+    assert(index != -1, 'Default image not found: ' + imageUrl);
 
-    settings.ChangePicturePrivateApi.initialize();
+    this.fallbackImage_ = this.$.selector.items[index];
+
+    // If user is currently taking a photo, do not steal the focus.
+    if (!this.selectedItem_ || this.selectedItem_.dataset.type != 'camera')
+      this.$.selector.select(index);
+  },
+
+  /**
+   * Handler for the 'old-image-changed' event. The 'old' image is any selected
+   * non-profile and non-default image. It can be from the camera, a file, or a
+   * deprecated default image. When this method is called, the old image
+   * becomes the selected image.
+   * @param {string} imageUrl
+   * @private
+   */
+  receiveOldImage_: function(imageUrl) {
+    this.oldImageUrl_ = imageUrl;
+    this.$.selector.select(this.$.selector.indexOf(this.$.oldImage));
+  },
+
+  /**
+   * Handler for the 'profile-image-changed' event.
+   * @param {string} imageUrl
+   * @param {boolean} selected
+   * @private
+   */
+  receiveProfileImage_: function(imageUrl, selected) {
+    this.profileImageUrl_ = imageUrl;
+    this.$.profileImage.alt = this.i18n('profilePhoto');
+
+    if (!selected)
+      return;
+
+    this.fallbackImage_ = this.$.profileImage;
+
+    // If user is currently taking a photo, do not steal the focus.
+    if (!this.selectedItem_ || this.selectedItem_.dataset.type != 'camera')
+      this.$.selector.select(this.$.selector.indexOf(this.$.profileImage));
+  },
+
+  /**
+   * Handler for the 'camera-presence-changed' event.
+   * @param {boolean} cameraPresent
+   * @private
+   */
+  receiveCameraPresence_: function(cameraPresent) {
+    this.cameraPresent_ = cameraPresent;
   },
 
   /**
@@ -199,16 +214,16 @@ Polymer({
         // Nothing needs to be done.
         break;
       case 'file':
-        settings.ChangePicturePrivateApi.chooseFile();
+        this.browserProxy_.chooseFile();
         break;
       case 'profile':
-        settings.ChangePicturePrivateApi.selectProfileImage();
+        this.browserProxy_.selectProfileImage();
         break;
       case 'old':
-        settings.ChangePicturePrivateApi.selectOldImage();
+        this.browserProxy_.selectOldImage();
         break;
       case 'default':
-        settings.ChangePicturePrivateApi.selectDefaultImage(image.src);
+        this.browserProxy_.selectDefaultImage(image.src);
         break;
       default:
         assertNotReached('Selected unknown image type');
@@ -264,7 +279,7 @@ Polymer({
           var /** SettingsCameraElement */ camera = this.$.camera;
           camera.takePhoto();
         } else if (this.selectedItem_.dataset.type == 'file') {
-          settings.ChangePicturePrivateApi.chooseFile();
+          this.browserProxy_.chooseFile();
         } else if (this.selectedItem_.dataset.type == 'old') {
           this.onTapDiscardOldImage_();
         }
@@ -289,7 +304,7 @@ Polymer({
    * containing a data URL.
    */
   onPhotoTaken_: function(event) {
-    settings.ChangePicturePrivateApi.photoTaken(event.detail.photoDataUrl);
+    this.browserProxy_.photoTaken(event.detail.photoDataUrl);
   },
 
   /**
@@ -311,8 +326,7 @@ Polymer({
     // If the user has not chosen an image since opening the subpage and
     // discards the current photo, select the first default image.
     assert(this.defaultImages_.length > 0);
-    settings.ChangePicturePrivateApi.selectDefaultImage(
-        this.defaultImages_[0].url);
+    this.browserProxy_.selectDefaultImage(this.defaultImages_[0].url);
 
     announceAccessibleMessage(
         loadTimeData.getString('photoDiscardAccessibleText'));
diff --git a/chrome/browser/resources/settings/people_page/change_picture_browser_proxy.html b/chrome/browser/resources/settings/people_page/change_picture_browser_proxy.html
new file mode 100644
index 0000000..2175c99
--- /dev/null
+++ b/chrome/browser/resources/settings/people_page/change_picture_browser_proxy.html
@@ -0,0 +1 @@
+<script src="chrome://md-settings/people_page/change_picture_browser_proxy.js"></script>
diff --git a/chrome/browser/resources/settings/people_page/change_picture_browser_proxy.js b/chrome/browser/resources/settings/people_page/change_picture_browser_proxy.js
new file mode 100644
index 0000000..cfcd3cd
--- /dev/null
+++ b/chrome/browser/resources/settings/people_page/change_picture_browser_proxy.js
@@ -0,0 +1,112 @@
+// Copyright 2016 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 A helper object used from the "Change Picture" subpage of
+ * the People section to interact with the browser. ChromeOS only.
+ */
+cr.exportPath('settings');
+
+/**
+ * An object describing a default image.
+ * @typedef {{
+ *   author: string,
+ *   title: string,
+ *   url: string,
+ *   website: string
+ * }}
+ */
+settings.DefaultImage;
+
+cr.define('settings', function() {
+  /** @interface */
+  function ChangePictureBrowserProxy() {}
+
+  ChangePictureBrowserProxy.prototype = {
+    /**
+     * Retrieves the initial set of default images, profile image, etc. As a
+     * response, the C++ sends these WebUIListener events:
+     * 'default-images-changed', 'profile-image-changed', 'old-image-changed',
+     * and 'selected-image-changed'
+     */
+    initialize: function() {},
+
+    /**
+     * Sets the user image to one of the default images. As a response, the C++
+     * sends the 'default-images-changed' WebUIListener event.
+     * @param {string} imageUrl
+     */
+    selectDefaultImage: function(imageUrl) {},
+
+    /**
+     * Sets the user image to the 'old' image. As a response, the C++ sends the
+     * 'old-image-changed' WebUIListener event.
+     */
+    selectOldImage: function() {},
+
+    /**
+     * Sets the user image to the profile image. As a response, the C++ sends
+     * the 'profile-image-changed' WebUIListener event.
+     */
+    selectProfileImage: function() {},
+
+    /**
+     * Provides the taken photo as a data URL to the C++. No response is
+     * expected.
+     * @param {string} photoDataUrl
+     */
+    photoTaken: function(photoDataUrl) {},
+
+    /**
+     * Requests a file chooser to select a new user image. No response is
+     * expected.
+     */
+    chooseFile: function() {},
+  };
+
+  /**
+   * @constructor
+   * @implements {ChangePictureBrowserProxy}
+   */
+  function ChangePictureBrowserProxyImpl() {}
+  // The singleton instance_ is replaced with a test version of this wrapper
+  // during testing.
+  cr.addSingletonGetter(ChangePictureBrowserProxyImpl);
+
+  ChangePictureBrowserProxyImpl.prototype = {
+    /** @override */
+    initialize: function() {
+      chrome.send('onChangePicturePageInitialized');
+    },
+
+    /** @override */
+    selectDefaultImage: function(imageUrl) {
+      chrome.send('selectImage', [imageUrl, 'default']);
+    },
+
+    /** @override */
+    selectOldImage: function() {
+      chrome.send('selectImage', ['', 'old']);
+    },
+
+    /** @override */
+    selectProfileImage: function() {
+      chrome.send('selectImage', ['', 'profile']);
+    },
+
+    /** @override */
+    photoTaken: function(photoDataUrl) {
+      chrome.send('photoTaken', [photoDataUrl]);
+    },
+
+    /** @override */
+    chooseFile: function() {
+      chrome.send('chooseFile');
+    },
+  };
+
+  return {
+    ChangePictureBrowserProxyImpl: ChangePictureBrowserProxyImpl,
+  };
+});
diff --git a/chrome/browser/resources/settings/people_page/change_picture_private_api.html b/chrome/browser/resources/settings/people_page/change_picture_private_api.html
deleted file mode 100644
index 1160701..0000000
--- a/chrome/browser/resources/settings/people_page/change_picture_private_api.html
+++ /dev/null
@@ -1 +0,0 @@
-<script src="chrome://md-settings/people_page/change_picture_private_api.js"></script>
diff --git a/chrome/browser/resources/settings/people_page/change_picture_private_api.js b/chrome/browser/resources/settings/people_page/change_picture_private_api.js
deleted file mode 100644
index 7f1ae94..0000000
--- a/chrome/browser/resources/settings/people_page/change_picture_private_api.js
+++ /dev/null
@@ -1,91 +0,0 @@
-// 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.
-
-cr.exportPath('settings');
-
-/**
- * An object describing a default image.
- * @typedef {{
- *   author: string,
- *   title: string,
- *   url: string,
- *   website: string
- * }}
- */
-settings.DefaultImage;
-
-cr.define('settings', function() {
-  /**
-   * API which encapsulates messaging between JS and C++ for the ChromeOS
-   * Change Picture subpage.
-   * @constructor
-   */
-  function ChangePicturePrivateApi() {}
-
-  /**
-   * URLs of special button images.
-   * @enum {string}
-   */
-  ChangePicturePrivateApi.ButtonImages = {
-    TAKE_PHOTO: 'chrome://theme/IDR_BUTTON_USER_IMAGE_TAKE_PHOTO',
-    CHOOSE_FILE: 'chrome://theme/IDR_BUTTON_USER_IMAGE_CHOOSE_FILE',
-    PROFILE_PICTURE: 'chrome://theme/IDR_PROFILE_PICTURE_LOADING'
-  };
-
-  /**
-   * Called from JavaScript. Retrieves the initial set of default images,
-   * profile image, etc. As a response, the C++ calls these ChangePicturePage
-   * methods as callbacks: receiveDefaultImages, receiveOldImage,
-   * receiveProfileImage, and receiveSelectedImage.
-   */
-  ChangePicturePrivateApi.initialize = function() {
-    chrome.send('onChangePicturePageInitialized');
-  };
-
-  /**
-   * Called from JavaScript. Sets the user image to one of the default images.
-   * As a response, the C++ calls ChangePicturePage.receiveSelectedImage.
-   * @param {string} imageUrl
-   */
-  ChangePicturePrivateApi.selectDefaultImage = function(imageUrl) {
-    chrome.send('selectImage', [imageUrl, 'default']);
-  };
-
-  /**
-   * Called from JavaScript. Sets the user image to the 'old' image.
-   * As a response, the C++ calls ChangePicturePage.receiveSelectedImage.
-   */
-  ChangePicturePrivateApi.selectOldImage = function() {
-    chrome.send('selectImage', ['', 'old']);
-  };
-
-  /**
-   * Called from JavaScript. Sets the user image to the profile image.
-   * As a response, the C++ calls ChangePicturePage.receiveSelectedImage.
-   */
-  ChangePicturePrivateApi.selectProfileImage = function() {
-    chrome.send('selectImage', ['', 'profile']);
-  };
-
-  /**
-   * Called from JavaScript. Provides the taken photo as a data URL to the C++.
-   * No response is expected.
-   * @param {string} photoDataUrl
-   */
-  ChangePicturePrivateApi.photoTaken = function(photoDataUrl) {
-    chrome.send('photoTaken', [photoDataUrl]);
-  };
-
-  /**
-   * Called from JavaScript. Requests a file chooser to select a new user image.
-   * No response is expected.
-   */
-  ChangePicturePrivateApi.chooseFile = function() {
-    chrome.send('chooseFile');
-  };
-
-  return {
-    ChangePicturePrivateApi: ChangePicturePrivateApi,
-  };
-});
diff --git a/chrome/browser/resources/settings/people_page/compiled_resources2.gyp b/chrome/browser/resources/settings/people_page/compiled_resources2.gyp
index dd58217..d7980ab 100644
--- a/chrome/browser/resources/settings/people_page/compiled_resources2.gyp
+++ b/chrome/browser/resources/settings/people_page/compiled_resources2.gyp
@@ -16,16 +16,17 @@
       'target_name': 'change_picture',
       'dependencies': [
         '<(DEPTH)/third_party/polymer/v1_0/components-chromium/iron-selector/compiled_resources2.gyp:iron-selector-extracted',
+        '<(DEPTH)/ui/webui/resources/js/compiled_resources2.gyp:i18n_behavior',
         '<(DEPTH)/ui/webui/resources/js/compiled_resources2.gyp:load_time_data',
         '<(DEPTH)/ui/webui/resources/js/compiled_resources2.gyp:util',
-        '<(DEPTH)/ui/webui/resources/js/compiled_resources2.gyp:i18n_behavior',
+        '<(DEPTH)/ui/webui/resources/js/compiled_resources2.gyp:web_ui_listener_behavior',
         'camera',
-        'change_picture_private_api',
+        'change_picture_browser_proxy',
       ],
       'includes': ['../../../../../third_party/closure_compiler/compile_js2.gypi'],
     },
     {
-      'target_name': 'change_picture_private_api',
+      'target_name': 'change_picture_browser_proxy',
       'dependencies': [
         '<(DEPTH)/ui/webui/resources/js/compiled_resources2.gyp:cr',
       ],
diff --git a/chrome/browser/resources/settings/settings_resources.grd b/chrome/browser/resources/settings/settings_resources.grd
index 8e0a779..7fbc04d 100644
--- a/chrome/browser/resources/settings/settings_resources.grd
+++ b/chrome/browser/resources/settings/settings_resources.grd
@@ -796,13 +796,13 @@
         <structure name="IDR_SETTINGS_PEOPLE_PAGE_CHANGE_PICTURE_JS"
                    file="people_page/change_picture.js"
                    type="chrome_html" />
-        <structure name="IDR_SETTINGS_PEOPLE_CHANGE_PICTURE_PRIVATE_API_JS"
-                   file="people_page/change_picture_private_api.js"
+        <structure name="IDR_SETTINGS_PEOPLE_CHANGE_PICTURE_BROWSER_PROXY_JS"
+                   file="people_page/change_picture_browser_proxy.js"
                    type="chrome_html"
                    flattenhtml="true"
                    allowexternalscript="true" />
-        <structure name="IDR_SETTINGS_PEOPLE_CHANGE_PICTURE_PRIVATE_API_HTML"
-                   file="people_page/change_picture_private_api.html"
+        <structure name="IDR_SETTINGS_PEOPLE_CHANGE_PICTURE_BROWSER_PROXY_HTML"
+                   file="people_page/change_picture_browser_proxy.html"
                    type="chrome_html"
                    flattenhtml="true"
                    allowexternalscript="true" />
diff --git a/chrome/browser/ui/webui/settings/chromeos/change_picture_handler.cc b/chrome/browser/ui/webui/settings/chromeos/change_picture_handler.cc
index 2955df6e2..c549f25 100644
--- a/chrome/browser/ui/webui/settings/chromeos/change_picture_handler.cc
+++ b/chrome/browser/ui/webui/settings/chromeos/change_picture_handler.cc
@@ -135,8 +135,9 @@ void ChangePictureHandler::SendDefaultImages() {
                           default_user_image::GetDefaultImageDescription(i));
     image_urls.Append(image_data.release());
   }
-  web_ui()->CallJavascriptFunction(
-      "settings.ChangePicturePage.receiveDefaultImages", image_urls);
+  web_ui()->CallJavascriptFunction("cr.webUIListenerCallback",
+                                   base::StringValue("default-images-changed"),
+                                   image_urls);
 }
 
 void ChangePictureHandler::HandleChooseFile(const base::ListValue* args) {
@@ -224,7 +225,8 @@ void ChangePictureHandler::SendSelectedImage() {
         base::StringValue image_url(
             default_user_image::GetDefaultImageUrl(previous_image_index_));
         web_ui()->CallJavascriptFunction(
-            "settings.ChangePicturePage.receiveSelectedImage", image_url);
+            "cr.webUIListenerCallback",
+            base::StringValue("selected-image-changed"), image_url);
       } else {
         // User has an old default image, so present it in the same manner as a
         // previous image from file.
@@ -239,8 +241,9 @@ void ChangePictureHandler::SendProfileImage(const gfx::ImageSkia& image,
                                             bool should_select) {
   base::StringValue data_url(webui::GetBitmapDataUrl(*image.bitmap()));
   base::FundamentalValue select(should_select);
-  web_ui()->CallJavascriptFunction(
-      "settings.ChangePicturePage.receiveProfileImage", data_url, select);
+  web_ui()->CallJavascriptFunction("cr.webUIListenerCallback",
+                                   base::StringValue("profile-image-changed"),
+                                   data_url, select);
 }
 
 void ChangePictureHandler::UpdateProfileImage() {
@@ -258,8 +261,8 @@ void ChangePictureHandler::UpdateProfileImage() {
 void ChangePictureHandler::SendOldImage(const std::string& image_url) {
   previous_image_url_ = image_url;
   base::StringValue url(image_url);
-  web_ui()->CallJavascriptFunction("settings.ChangePicturePage.receiveOldImage",
-                                   url);
+  web_ui()->CallJavascriptFunction("cr.webUIListenerCallback",
+                                   base::StringValue("old-image-changed"), url);
 }
 
 void ChangePictureHandler::HandleSelectImage(const base::ListValue* args) {
@@ -353,10 +356,9 @@ void ChangePictureHandler::SetImageFromCamera(const gfx::ImageSkia& photo) {
 }
 
 void ChangePictureHandler::SetCameraPresent(bool present) {
-  base::FundamentalValue present_value(present);
-
-  web_ui()->CallJavascriptFunction(
-      "settings.ChangePicturePage.receiveCameraPresence", present_value);
+  web_ui()->CallJavascriptFunction("cr.webUIListenerCallback",
+                                   base::StringValue("camera-presence-changed"),
+                                   base::FundamentalValue(present));
 }
 
 void ChangePictureHandler::OnCameraPresenceCheckDone(bool is_camera_present) {
diff --git a/chrome/test/data/webui/settings/change_picture_browsertest_chromeos.js b/chrome/test/data/webui/settings/change_picture_browsertest_chromeos.js
index faa6a03..261f0cd 100644
--- a/chrome/test/data/webui/settings/change_picture_browsertest_chromeos.js
+++ b/chrome/test/data/webui/settings/change_picture_browsertest_chromeos.js
@@ -85,13 +85,13 @@ TEST_F('SettingsChangePictureBrowserTest', 'MAYBE_ChangePicture', function() {
       assertTrue(!!cameraIcon);
 
       // Force the camera to be absent, even if it's actually present.
-      settings.ChangePicturePage.receiveCameraPresence(false);
+      cr.webUIListenerCallback('camera-presence-changed', false);
       Polymer.dom.flush();
 
       expectTrue(cameraIcon.hidden);
       expectFalse(settingsCamera.cameraActive);
 
-      settings.ChangePicturePage.receiveCameraPresence(true);
+      cr.webUIListenerCallback('camera-presence-changed', true);
       Polymer.dom.flush();
 
       expectFalse(cameraIcon.hidden);
@@ -127,7 +127,7 @@ TEST_F('SettingsChangePictureBrowserTest', 'MAYBE_ChangePicture', function() {
       assertTrue(oldImage.hidden);
 
       return runAndResolveWhenSelectedItemChanged(function() {
-        settings.ChangePicturePage.receiveOldImage('fake-old-image.jpg');
+        cr.webUIListenerCallback('old-image-changed', 'fake-old-image.jpg');
       }).then(function() {
         Polymer.dom.flush();
 
@@ -172,7 +172,7 @@ TEST_F('SettingsChangePictureBrowserTest', 'MAYBE_ChangePicture', function() {
 
       function injectAndVerifyOldImage() {
         return runAndResolveWhenSelectedItemChanged(function() {
-          settings.ChangePicturePage.receiveOldImage('fake-old-image.jpg');
+          cr.webUIListenerCallback('old-image-changed', 'fake-old-image.jpg');
         }).then(function() {
           Polymer.dom.flush();
           expectEquals('old', changePicture.selectedItem_.dataset.type);