Fix warning message of the user profile is not seen on second instance

In my cl: https://codereview.chromium.org/2258043002/, I combined updating
removing warning message for both desktopUser and non-owner User into one
function. However, for desktopUser build, it is done in a callback. To isolate
these two platform warning message updates, the updating removing warning
message function is divided into two functions.

BUG=639737
TEST=tested on both browser build and chromeOS build, the bug is fixed.

Review-Url: https://codereview.chromium.org/2265133003
Cr-Commit-Position: refs/heads/master@{#413974}

chrome/app/generated_resources.grd

@@ -13231,7 +13231,7 @@ Please check your email at <ph name="ACCOUNT_EMAIL">$2<ex>jane.doe@gmail.com</ex
           All files and local data associated with the supervised user will be permanently deleted once this supervised user is removed. Visited websites and settings for this supervised user may still be visible by the manager at <ph name="MANAGEMENT_URL">$1<ex>www.example.com</ex></ph>.
         </message>
         <message name="IDS_LOGIN_POD_NON_OWNER_USER_REMOVE_WARNING" desc="Text shown as a warning when attempting to remove non-owner user.">
-          All files and local data associated with this user will be permanently deleted once this user is removed. $2 can still sign in later.
+          All files and local data associated with this user will be permanently deleted once this user is removed. $1 can still sign in later.
         </message>
         <if expr="not chromeos">
           <message name="IDS_USER_MANAGER_GO_GUEST_PROFILES_LOCKED_ERROR" desc="Error message displayed when trying to browser as guest while all profiles are locked.">

ui/login/account_picker/user_pod_row.js

@@ -1534,8 +1534,6 @@ cr.define('login', function() {
       this.actionBoxMenuRemoveElement.hidden = true;
       this.actionBoxRemoveUserWarningElement.hidden = false;
 
-      // Show extra statistics information for desktop users
-      var message;
       if (!this.user.isDesktopUser) {
         this.moveActionMenuUpIfNeeded_();
         if (!this.user.legacySupervisedUser) {
@@ -1545,12 +1543,11 @@ cr.define('login', function() {
               '.action-box-remove-user-warning-table-nonsync').style.display
               = 'none';
           var message = loadTimeData.getString('removeNonOwnerUserWarningText');
-          var element_id = '.action-box-remove-non-owner-user-warning-text';
-          this.updateRemoveWarningDialogSetMessage_(element_id,
-                                                    this.user.profilePath,
-                                                    message);
+          this.updateRemoveNonOwnerUserWarningMessage_(this.user.profilePath,
+                                                       message);
         }
       } else {
+        // Show extra statistics information for desktop users
         this.querySelector(
           '.action-box-remove-non-owner-user-warning-text').hidden = true;
         this.RemoveWarningDialogSetMessage_(true, false);
@@ -1613,7 +1610,6 @@ cr.define('login', function() {
       if (total_count)
         this.classList.remove('has-no-stats');
 
-      var elementSelector = '.action-box-remove-user-warning-text';
       var is_synced_user = this.user.emailAddress !== "";
       // Write total number if all statistics are loaded.
       if (num_stats_loaded === Object.keys(stats_elements).length) {
@@ -1622,8 +1618,7 @@ cr.define('login', function() {
           var message = loadTimeData.getString(
               is_synced_user ? 'removeUserWarningTextSyncNoStats' :
                                'removeUserWarningTextNonSyncNoStats');
-          this.updateRemoveWarningDialogSetMessage_(elementSelector,
-                                                    this.user.profilePath,
+          this.updateRemoveWarningDialogSetMessage_(this.user.profilePath,
                                                     message);
         } else {
           window.updateRemoveWarningDialogSetMessage =
@@ -1640,8 +1635,7 @@ cr.define('login', function() {
           message = loadTimeData.getString(
               is_synced_user ? 'removeUserWarningTextSyncNoStats' :
                                'removeUserWarningTextNonSyncNoStats');
-          this.updateRemoveWarningDialogSetMessage_(elementSelector,
-                                                    this.user.profilePath,
+          this.updateRemoveWarningDialogSetMessage_(this.user.profilePath,
                                                     message);
         } else {
           message = loadTimeData.getString(
@@ -1649,8 +1643,7 @@ cr.define('login', function() {
                                'removeUserWarningTextNonSyncCalculating');
           substitute = loadTimeData.getString(
               'removeUserWarningTextCalculating');
-          this.updateRemoveWarningDialogSetMessage_(elementSelector,
-                                                    this.user.profilePath,
+          this.updateRemoveWarningDialogSetMessage_(this.user.profilePath,
                                                     message, substitute);
         }
       }
@@ -1658,22 +1651,19 @@ cr.define('login', function() {
 
     /**
      * Refresh the message in the remove user warning dialog.
-     * @param {string} elementSelector The elementSelector of warning dialog.
      * @param {string} profilePath The filepath of the URL (must be verified).
      * @param {string} message The message to be written.
      * @param {number|string=} count The number or string to replace $1 in
      * |message|. Can be omitted if $1 is not present in |message|.
      */
-    updateRemoveWarningDialogSetMessage_: function(elementSelector,
-                                                   profilePath,
-                                                   message,
+    updateRemoveWarningDialogSetMessage_: function(profilePath, message,
                                                    count) {
       if (profilePath !== this.user.profilePath)
         return;
       // Add localized messages where $1 will be replaced with
       // <span class="total-count"></span> and $2 will be replaced with
       // <span class="email"></span>.
-      var element = this.querySelector(elementSelector);
+      var element = this.querySelector('.action-box-remove-user-warning-text');
       element.textContent = '';
 
       messageParts = message.split(/(\$[12])/);
@@ -1696,6 +1686,35 @@ cr.define('login', function() {
       this.moveActionMenuUpIfNeeded_();
     },
 
+    /**
+     * Update the message in the "remove non-owner user warning" dialog on CrOS.
+     * @param {string} profilePath The filepath of the URL (must be verified).
+     * @param (string) message The message to be written.
+     */
+    updateRemoveNonOwnerUserWarningMessage_: function(profilePath, message) {
+      if (profilePath !== this.user.profilePath)
+        return;
+      // Add localized messages where $1 will be replaced with
+      // <span class="email"></span>.
+      var element = this.querySelector(
+          '.action-box-remove-non-owner-user-warning-text');
+      element.textContent = '';
+
+      messageParts = message.split(/(\$[1])/);
+      var numParts = messageParts.length;
+      for (var j = 0; j < numParts; j++) {
+        if (messageParts[j] == '$1') {
+          var elementToAdd = document.createElement('span');
+          elementToAdd.classList.add('email');
+          elementToAdd.textContent = this.user.emailAddress;
+          element.appendChild(elementToAdd);
+        } else {
+          element.appendChild(document.createTextNode(messageParts[j]));
+        }
+      }
+      this.moveActionMenuUpIfNeeded_();
+    },
+
     /**
      * Handles a click event on remove user confirmation button.
      * @param {Event} e Click event.