Add error handling for supervised user import flow.

Add a check if the user tries to create a profile with the
name of an already existing supervised user. In that case,
the user is not allowed to create a new such supervised user
profile, instead he can directly import the existing supervised
user.
A screenshot can be found in the bug description.

BUG=282464
TEST=browser_tests

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

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@243855 0039d316-1c4b-4281-b951-d872f2087c98

chrome/app/generated_resources.grd

@@ -14616,6 +14616,9 @@ Some features may be unavailable.  Please check that the profile exists and you
     <message name="IDS_PROFILES_CREATE_SIGN_IN_ERROR" desc="Message shown when a sign-in error occurs during creation of a new supervised user.">
       Oops! The new supervised user couldn't be created. Please make sure you're signed in properly and try again.
     </message>
+    <message name="IDS_PROFILES_CREATE_EXISTING_MANAGED_USER_ERROR" desc="Message shown when the user enters the name of a supervised user that can be imported.">
+    Looks like you're already managing a user by that name.<ph name="LINE_BREAK">&lt;br/&gt;</ph>Did you want to <ph name="BEGIN_LINK">&lt;button id="supervised-user-import" class="link-button"&gt;</ph>import <ph name="PROFILE_NAME">$1<ex>John</ex></ph> to this device<ph name="END_LINK">&lt;/button&gt;</ph>?
+  </message>
     <message name="IDS_PROFILES_CREATE_MANAGED_SIGNED_IN_LABEL" desc="Label for the 'Supervised user' checkbox in the create-profile dialog when the current user is signed in. This will be followed by a 'Learn more' link.">
       This is a supervised user managed by <ph name="CUSTODIAN_EMAIL">$1<ex>user@gmail.com</ex></ph>.
     </message>

chrome/browser/resources/options/manage_profile_overlay.css

@@ -43,11 +43,21 @@
   margin-right: auto;
   max-height: 50px;
   overflow: hidden;
-  padding: 1px 10px;
+  padding: 10px 10px;
   text-align: center;
   width: 80%;
 }
 
+html[dir='ltr'] #create-profile-error-bubble {
+  margin-left: 20px;
+  width: 90%;
+}
+
+html[dir='rtl'] #create-profile-error-bubble {
+  margin-right: 20px;
+  width: 90%;
+}
+
 #create-profile-error-bubble[hidden],
 #manage-profile-error-bubble[hidden] {
   display: block !important;
@@ -121,10 +131,15 @@ html[dir='rtl'] #delete-profile-icon {
 }
 
 #create-profile-managed-content-area {
-  padding-top: 0;
+  padding-top: 10;
 }
 
 #import-existing-managed-user-link {
   left: 17px;
   position: absolute;
 }
+
+#supervised-user-import {
+  margin: 0;
+  padding: 0;
+}

chrome/browser/resources/options/manage_profile_overlay.html

@@ -66,7 +66,6 @@
           <input id="create-profile-name" type="text" required>
         </label>
       </div>
-      <div id="create-profile-error-bubble" hidden></div>
     </div>
     <div id="create-profile-managed-content-area" class="content-area">
       <div id="create-shortcut-container" class="checkbox" hidden>
@@ -108,10 +107,13 @@
         </span>
       </div>
     </div>
+    <div id="create-profile-error-bubble-content-area" class="content-area">
+      <div id="create-profile-error-bubble" hidden></div>
+    </div>
     <div class="action-area">
       <div id="create-profile-throbber" class="throbber"></div>
       <button id="import-existing-managed-user-link" class="link-button"
-          i18n-content="importExistingManagedUserLink">
+          i18n-content="importExistingManagedUserLink" hidden>
       </button>
       <div class="button-strip">
         <button id="create-profile-cancel" i18n-content="cancel"></button>

chrome/browser/resources/options/managed_user_create_confirm.js

@@ -64,23 +64,9 @@ cr.define('options', function() {
      * @private
      */
     setProfileInfo_: function(info) {
-      function HTMLEscape(original) {
-        return original.replace(/&/g, '&')
-                       .replace(/</g, '&lt;')
-                       .replace(/>/g, '&gt;')
-                       .replace(/"/g, '&quot;')
-                       .replace(/'/g, '&#39;');
-      }
-
-      var MAX_LENGTH = 50;
-      function elide(original) {
-        if (original.length <= MAX_LENGTH)
-          return original;
-        return original.substring(0, MAX_LENGTH - 3) + '...';
-      }
-
       this.profileInfo_ = info;
-      var elidedName = elide(info.name);
+      var MAX_LENGTH = 50;
+      var elidedName = elide(info.name, MAX_LENGTH);
       $('managed-user-created-title').textContent =
           loadTimeData.getStringF('managedUserCreatedTitle', elidedName);
       $('managed-user-created-switch').textContent =
@@ -92,7 +78,8 @@ cr.define('options', function() {
       $('managed-user-created-text').innerHTML =
           loadTimeData.getStringF('managedUserCreatedText',
                                   HTMLEscape(elidedName),
-                                  HTMLEscape(elide(info.custodianEmail)));
+                                  HTMLEscape(elide(info.custodianEmail,
+                                                   MAX_LENGTH)));
     },
 
     /** @override */

chrome/browser/resources/options/managed_user_import.js

@@ -75,7 +75,8 @@ cr.define('options', function() {
      * @override
      */
     didShowPage: function() {
-      chrome.send('requestManagedUserImportUpdate');
+      options.ManagedUserListData.requestExistingManagedUsers(
+          this.receiveExistingManagedUsers_, this.onSigninError_.bind(this));
 
       this.updateImportInProgress_(false);
       $('managed-user-import-error-bubble').hidden = true;
@@ -119,6 +120,7 @@ cr.define('options', function() {
       // 'createProfile' is handled by CreateProfileHandler.
       chrome.send('createProfile', [managedUser.name, avatarUrl,
                                     false, true, managedUser.id]);
+      options.ManagedUserListData.reloadExistingManagedUsers();
     },
 
     /**
@@ -157,8 +159,7 @@ cr.define('options', function() {
     },
 
     /**
-     * Adds all the existing |managedUsers| to the list. If |managedUsers|
-     * is undefined, then the list is cleared.
+     * Sets the data model of the managed user list to |managedUsers|.
      * @param {Array.<Object>} managedUsers An array of managed user objects.
      *     Each object is of the form:
      *       managedUser = {
@@ -171,11 +172,6 @@ cr.define('options', function() {
      * @private
      */
     receiveExistingManagedUsers_: function(managedUsers) {
-      if (!managedUsers) {
-        $('managed-user-list').dataModel = null;
-        return;
-      }
-
       managedUsers.sort(function(a, b) {
         return a.name.localeCompare(b.name);
       });
@@ -184,14 +180,15 @@ cr.define('options', function() {
       if (managedUsers.length == 0) {
         this.onError_(loadTimeData.getString('noExistingManagedUsers'));
         $('managed-user-import-ok').disabled = true;
+      } else {
+        // Hide the error bubble.
+        $('managed-user-import-error-bubble').hidden = true;
       }
     },
 
-    /**
-     * @private
-     */
-    hideErrorBubble_: function() {
-      $('managed-user-import-error-bubble').hidden = true;
+    onSigninError_: function() {
+      $('managed-user-list').dataModel = null;
+      this.onError_(loadTimeData.getString('managedUserImportSigninError'));
     },
 
     /**
@@ -220,10 +217,7 @@ cr.define('options', function() {
 
   // Forward public APIs to private implementations.
   [
-    'hideErrorBubble',
-    'onError',
     'onSuccess',
-    'receiveExistingManagedUsers',
   ].forEach(function(name) {
     ManagedUserImportOverlay[name] = function() {
       var instance = ManagedUserImportOverlay.getInstance();

chrome/browser/resources/options/managed_user_list_data.js

+// Copyright 2014 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('options', function() {
+  /**
+   * ManagedUserListData class.
+   * Handles requests for retrieving a list of existing managed users which are
+   * supervised by the current profile. This list is cached in order to make it
+   * possible to serve future requests immediately. The first request will be
+   * handled asynchronously.
+   * @constructor
+   * @class
+   */
+  function ManagedUserListData() {
+    this.callbacks_ = [];
+    this.errbacks_ = [];
+    this.requestInProgress_ = false;
+    this.managedUsers_ = null;
+  };
+
+  cr.addSingletonGetter(ManagedUserListData);
+
+  /**
+   * Resets to the initial state of no pending requests.
+   * @private
+   */
+  ManagedUserListData.prototype.reset_ = function() {
+    this.callbacks_ = [];
+    this.errbacks_ = [];
+    this.requestInProgress_ = false;
+  }
+
+  /**
+   * Receives a list of managed users and passes the list to each of the
+   * callbacks.
+   * @param {Array.<Object>} managedUsers An array of managed user objects.
+   *     Each object is of the form:
+   *       managedUser = {
+   *         id: "Managed User ID",
+   *         name: "Managed User Name",
+   *         iconURL: "chrome://path/to/icon/image",
+   *         onCurrentDevice: true or false,
+   *         needAvatar: true or false
+   *       }
+   */
+  ManagedUserListData.receiveExistingManagedUsers = function(managedUsers) {
+    var instance = ManagedUserListData.getInstance();
+    var i;
+    for (i = 0; i < instance.callbacks_.length; i++) {
+      instance.callbacks_[i](managedUsers);
+    }
+    instance.managedUsers_ = managedUsers;
+    instance.reset_();
+  };
+
+  /**
+   * Called when there is a signin error when retrieving the list of managed
+   * users. Calls the error callbacks which will display an appropriate error
+   * message to the user.
+   */
+  ManagedUserListData.onSigninError = function() {
+    var instance = ManagedUserListData.getInstance();
+    var i;
+    for (i = 0; i < instance.errbacks_.length; i++) {
+      instance.errbacks_[i]();
+    }
+    // Reset the list of managed users in order to avoid showing stale data.
+    instance.managedUsers_ = null;
+    instance.reset_();
+  };
+
+  /**
+   * Handles the request for the list of existing managed users. If the data is
+   * already available, it will call |callback| immediately. Otherwise, it
+   * retrieves the list of existing managed users which is then processed in
+   * receiveExistingManagedUsers().
+   * @param {Object} callback The callback function which is called on success.
+   * @param {Object} errback the callback function which is called on error.
+   */
+  ManagedUserListData.requestExistingManagedUsers = function(callback,
+                                                             errback) {
+    var instance = ManagedUserListData.getInstance();
+    instance.callbacks_.push(callback);
+    instance.errbacks_.push(errback);
+    if (!instance.requestInProgress_) {
+      if (instance.managedUsers_ != null) {
+        ManagedUserListData.receiveExistingManagedUsers(instance.managedUsers_);
+        return;
+      }
+      instance.requestInProgress_ = true;
+      chrome.send('requestManagedUserImportUpdate');
+    }
+  };
+
+  /**
+   * Reload the list of existing managed users. Should be called when a new
+   * supervised user profile was created or a supervised user profile was
+   * deleted.
+   */
+  ManagedUserListData.reloadExistingManagedUsers = function() {
+    var instance = ManagedUserListData.getInstance();
+    if (instance.requestInProgress_)
+      return;
+
+    instance.managedUsers_ = null;
+    instance.requestInProgress_ = true;
+    chrome.send('requestManagedUserImportUpdate');
+  };
+
+  // Export
+  return {
+    ManagedUserListData: ManagedUserListData,
+  };
+});

chrome/browser/resources/options/options_bundle.js

@@ -97,6 +97,7 @@ var CertificateImportErrorOverlay = options.CertificateImportErrorOverlay;
 <include src="managed_user_import.js"></include>
 <include src="managed_user_learn_more.js"</include>
 <include src="managed_user_list.js"></include>
+<include src="managed_user_list_data.js"></include>
 <include src="media_galleries_list.js"></include>
 <include src="media_galleries_manager_overlay.js"></include>
 <include src="options_focus_manager.js"></include>

chrome/browser/ui/webui/options/manage_profile_browsertest.js

@@ -5,6 +5,9 @@
 // None of these tests is relevant for Chrome OS.
 GEN('#if !defined(OS_CHROMEOS)');
 
+GEN('#include "base/command_line.h"');
+GEN('#include "chrome/common/chrome_switches.h"');
+
 /**
  * TestFixture for ManageProfileOverlay and CreateProfileOverlay WebUI testing.
  * @extends {testing.Test}
@@ -25,6 +28,12 @@ ManageProfileUITest.prototype = {
    */
   runAccessibilityChecks: false,
 
+  /** @override */
+  testGenPreamble: function() {
+    GEN('CommandLine::ForCurrentProcess()->' +
+        'AppendSwitch(switches::kAllowCreateExistingManagedUsers);');
+  },
+
   /**
    * Returns a test profile-info object with configurable "managed" status.
    * @param {boolean} managed If true, the test profile will be marked as
@@ -45,15 +54,15 @@ ManageProfileUITest.prototype = {
    * Overrides WebUI methods that provide profile info, making them return a
    * test profile-info object.
    * @param {boolean} managed Whether the test profile should be marked managed.
+   * @param {string} mode The mode of the overlay (either 'manage' or 'create').
    */
-  setProfileManaged_: function(managed) {
+  setProfileManaged_: function(managed, mode) {
     // Override the BrowserOptions method to return the fake info.
     BrowserOptions.getCurrentProfile = function() {
       return this.testProfileInfo_(managed);
     }.bind(this);
     // Set the profile info in the overlay.
-    ManageProfileOverlay.setProfileInfo(this.testProfileInfo_(managed),
-                                        'manage');
+    ManageProfileOverlay.setProfileInfo(this.testProfileInfo_(managed), mode);
   },
 };
 
@@ -131,19 +140,88 @@ TEST_F('ManageProfileUITest', 'CreateManagedUserText', function() {
   assertTrue($('create-profile-managed').disabled);
 });
 
+// The import link should show up if the user tries to create a profile with the
+// same name as an existing managed user profile.
+TEST_F('ManageProfileUITest', 'CreateExistingManagedUser', function() {
+  ManageProfileOverlay.getInstance().initializePage();
+  var custodianEmail = 'chrome.playpen.test@gmail.com';
+  CreateProfileOverlay.updateSignedInStatus(custodianEmail);
+  assertEquals(custodianEmail,
+               CreateProfileOverlay.getInstance().signedInEmail_);
+  this.setProfileManaged_(false, 'create');
+
+  // Initialize the list of existing managed users.
+  var managedUserListData = options.ManagedUserListData.getInstance();
+  managedUserListData.managedUsers_ = [
+    {
+      id: 'managedUser1',
+      name: 'Rosalie',
+      iconURL: 'chrome://path/to/icon/image',
+      onCurrentDevice: false,
+      needAvatar: false
+    },
+    {
+      id: 'managedUser2',
+      name: 'Fritz',
+      iconURL: 'chrome://path/to/icon/image',
+      onCurrentDevice: false,
+      needAvatar: true
+    },
+    {
+      id: 'managedUser3',
+      name: 'Test',
+      iconURL: 'chrome://path/to/icon/image',
+      onCurrentDevice: true,
+      needAvatar: false
+    }];
+  // Also add the name 'Test' to |profileNames_| to simulate that the profile
+  // exists on the device.
+  ManageProfileOverlay.getInstance().profileNames_.Test = true;
+
+  // Initially, the ok button should be enabled and the import link should not
+  // exist.
+  assertFalse($('create-profile-ok').disabled);
+  assertTrue($('supervised-user-import') == null);
+
+  // Now try to create profiles with the names of existing supervised users.
+  $('create-profile-managed').checked = true;
+  var nameField = $('create-profile-name');
+  // A profile which already has an avatar.
+  nameField.value = 'Rosalie';
+  ManageProfileOverlay.getInstance().onNameChanged_('create');
+  assertTrue($('create-profile-ok').disabled);
+  assertFalse($('supervised-user-import') == null);
+  // A profile which doesn't have an avatar yet.
+  nameField.value = 'Fritz';
+  ManageProfileOverlay.getInstance().onNameChanged_('create');
+  assertTrue($('create-profile-ok').disabled);
+  assertFalse($('supervised-user-import') == null);
+  // A profile which already exists on the device.
+  nameField.value = 'Test';
+  ManageProfileOverlay.getInstance().onNameChanged_('create');
+  assertTrue($('create-profile-ok').disabled);
+  assertTrue($('supervised-user-import') == null);
+
+  // A profile which does not exist yet.
+  nameField.value = 'NewProfileName';
+  ManageProfileOverlay.getInstance().onNameChanged_('create');
+  assertFalse($('create-profile-ok').disabled);
+  assertTrue($('supervised-user-import') == null);
+});
+
 // Managed users should not be able to edit their profile names, and the initial
 // focus should be adjusted accordingly.
 TEST_F('ManageProfileUITest', 'EditManagedUserNameAllowed', function() {
   var nameField = $('manage-profile-name');
 
-  this.setProfileManaged_(false);
+  this.setProfileManaged_(false, 'manage');
   ManageProfileOverlay.showManageDialog();
   expectFalse(nameField.disabled);
   expectEquals(nameField, document.activeElement);
 
   OptionsPage.closeOverlay();
 
-  this.setProfileManaged_(true);
+  this.setProfileManaged_(true, 'manage');
   ManageProfileOverlay.showManageDialog();
   expectTrue(nameField.disabled);
   expectEquals($('manage-profile-ok'), document.activeElement);
@@ -350,7 +428,7 @@ TEST_F('ManageProfileUITest', 'CreateInProgress', function() {
 
 // Managed users shouldn't be able to open the delete or create dialogs.
 TEST_F('ManageProfileUITest', 'ManagedShowDeleteAndCreate', function() {
-  this.setProfileManaged_(false);
+  this.setProfileManaged_(false, 'create');
 
   ManageProfileOverlay.showCreateDialog();
   assertEquals('createProfile', OptionsPage.getTopmostVisiblePage().name);
@@ -362,7 +440,7 @@ TEST_F('ManageProfileUITest', 'ManagedShowDeleteAndCreate', function() {
   OptionsPage.closeOverlay();
   assertEquals('settings', OptionsPage.getTopmostVisiblePage().name);
 
-  this.setProfileManaged_(true);
+  this.setProfileManaged_(true, 'create');
   ManageProfileOverlay.showCreateDialog();
   assertEquals('settings', OptionsPage.getTopmostVisiblePage().name);
   ManageProfileOverlay.showDeleteDialog(this.testProfileInfo_(false));
@@ -389,14 +467,15 @@ TEST_F('ManageProfileUITest', 'ManagedDelete', function() {
     return chromeSendMessages;
   }
 
-  this.setProfileManaged_(false);
+  this.setProfileManaged_(false, 'manage');
   var messages = clickAndListen();
-  assertEquals(1, messages.length);
+  assertEquals(2, messages.length);
   assertEquals('deleteProfile', messages[0]);
+  assertEquals('requestManagedUserImportUpdate', messages[1]);
   assertEquals('settings', OptionsPage.getTopmostVisiblePage().name);
 
   ManageProfileOverlay.showDeleteDialog(this.testProfileInfo_(false));
-  this.setProfileManaged_(true);
+  this.setProfileManaged_(true, 'manage');
   messages = clickAndListen();
   assertEquals(0, messages.length);
   assertEquals('settings', OptionsPage.getTopmostVisiblePage().name);

chrome/browser/ui/webui/options/manage_profile_handler.cc

@@ -84,6 +84,8 @@ void ManageProfileHandler::GetLocalizedValues(
     { "manageProfilesDuplicateNameError",
         IDS_PROFILES_MANAGE_DUPLICATE_NAME_ERROR },
     { "manageProfilesIconLabel", IDS_PROFILES_MANAGE_ICON_LABEL },
+    { "manageProfilesExistingSupervisedUser",
+        IDS_PROFILES_CREATE_EXISTING_MANAGED_USER_ERROR },
     { "manageProfilesManagedSignedInLabel",
         IDS_PROFILES_CREATE_MANAGED_SIGNED_IN_LABEL },
     { "manageProfilesManagedNotSignedInLabel",

chrome/browser/ui/webui/options/managed_user_import_handler.cc

@@ -59,6 +59,7 @@ void ManagedUserImportHandler::GetLocalizedValues(
       { "managedUserImportText", IDS_IMPORT_EXISTING_MANAGED_USER_TEXT },
       { "createNewUserLink", IDS_CREATE_NEW_USER_LINK },
       { "managedUserImportOk", IDS_IMPORT_EXISTING_MANAGED_USER_OK },
+      { "managedUserImportSigninError", IDS_MANAGED_USER_IMPORT_SIGN_IN_ERROR },
       { "managedUserAlreadyOnThisDevice",
           IDS_MANAGED_USER_ALREADY_ON_THIS_DEVICE },
       { "noExistingManagedUsers", IDS_MANAGED_USER_NO_EXISTING_ERROR },
@@ -107,12 +108,6 @@ void ManagedUserImportHandler::RequestManagedUserImportUpdate(
   if (!IsAccountConnected() || HasAuthError()) {
     ClearManagedUsersAndShowError();
   } else {
-    // Account connected and no sign-in errors, then hide
-    // any error messages and send the managed users to update
-    // the managed user list.
-    web_ui()->CallJavascriptFunction(
-        "ManagedUserImportOverlay.hideErrorBubble");
-
     ManagedUserSyncService* managed_user_sync_service =
         ManagedUserSyncServiceFactory::GetForProfile(
             Profile::FromWebUI(web_ui()));
@@ -167,17 +162,12 @@ void ManagedUserImportHandler::SendExistingManagedUsers(
   }
 
   web_ui()->CallJavascriptFunction(
-      "ManagedUserImportOverlay.receiveExistingManagedUsers",
+      "options.ManagedUserListData.receiveExistingManagedUsers",
       managed_users);
 }
 
 void ManagedUserImportHandler::ClearManagedUsersAndShowError() {
-  web_ui()->CallJavascriptFunction(
-      "ManagedUserImportOverlay.receiveExistingManagedUsers");
-  base::string16 error_message =
-      l10n_util::GetStringUTF16(IDS_MANAGED_USER_IMPORT_SIGN_IN_ERROR);
-  web_ui()->CallJavascriptFunction("ManagedUserImportOverlay.onError",
-                                   base::StringValue(error_message));
+  web_ui()->CallJavascriptFunction("options.ManagedUserListData.onSigninError");
 }
 
 bool ManagedUserImportHandler::IsAccountConnected() const {

ui/webui/resources/js/util.js

@@ -381,3 +381,31 @@ function scrollLeftForDocument(doc) {
 function setScrollLeftForDocument(doc, value) {
   doc.documentElement.scrollLeft = doc.body.scrollLeft = value;
 }
+
+/**
+ * Replaces '&', '<', '>', '"', and ''' characters with their HTML encoding.
+ * @param {string} original The original string.
+ * @return {string} The string with all the characters mentioned above replaced.
+ */
+function HTMLEscape(original) {
+  return original.replace(/&/g, '&amp;')
+                 .replace(/</g, '&lt;')
+                 .replace(/>/g, '&gt;')
+                 .replace(/"/g, '&quot;')
+                 .replace(/'/g, '&#39;');
+}
+
+/**
+ * Shortens the provided string (if necessary) to a string of length at most
+ * |maxLength|.
+ * @param {string} original The original string.
+ * @param {number} maxLength The maximum length allowed for the string.
+ * @return {string} The original string if its length does not exceed
+ *     |maxLength|. Otherwise the first |maxLength| - 3 characters with '...'
+ *     appended.
+ */
+function elide(original, maxLength) {
+  if (original.length <= maxLength)
+    return original;
+  return original.substring(0, maxLength - 3) + '...';
+}