MD Extensions: pack-dialog success message

Bug: 795012
Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: Ifab4bd719569504821dc18db8ac785fadfaa71b3
Reviewed-on: https://chromium-review.googlesource.com/828461
Commit-Queue: Scott Chen <scottchen@chromium.org>
Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org>
Cr-Commit-Position: refs/heads/master@{#524547}

chrome/browser/resources/md_extensions/pack_dialog.html

@@ -61,7 +61,7 @@
     </dialog>
     <template is="dom-if" if="[[lastResponse_]]" restamp>
       <extensions-pack-dialog-alert model="[[lastResponse_]]"
-          on-warning-confirmed="onWarningConfirmed_" on-close="resetResponse_">
+          on-close="onAlertClose_">
       </extensions-pack-dialog-alert>
     </template>
   </template>

chrome/browser/resources/md_extensions/pack_dialog.js

@@ -89,25 +89,33 @@ cr.define('extensions', function() {
      * @private
      */
     onPackResponse_: function(response) {
-      if (response.status === chrome.developerPrivate.PackStatus.SUCCESS) {
-        this.$.dialog.close();
-      } else {
-        this.set('lastResponse_', response);
-      }
+      this.lastResponse_ = response;
     },
 
     /**
-     * The handler function when user chooses to 'Proceed Anyway' upon
-     * receiving a waring.
+     * In the case that the alert dialog was a success message, the entire
+     * pack-dialog should close. Otherwise, we detach the alert by setting
+     * lastResponse_ null. Additionally, if the user selected "proceed anyway"
+     * in the warning dialog, we pack the extension again with override flags.
+     * @param {!Event} e
      * @private
      */
-    onWarningConfirmed_: function() {
+    onAlertClose_: function(e) {
+      e.stopPropagation();
+
+      if (this.lastResponse_.status ==
+          chrome.developerPrivate.PackStatus.SUCCESS) {
+        this.$.dialog.close();
+        return;
+      }
+
+      /* This is only possible for a warning dialog. */
+      if (this.$$('extensions-pack-dialog-alert').returnValue == 'success') {
         this.delegate.packExtension(
             this.lastResponse_.item_path, this.lastResponse_.pem_path,
             this.lastResponse_.override_flags, this.onPackResponse_.bind(this));
-    },
+      }
 
-    resetResponse_: function() {
       this.lastResponse_ = null;
     },
   });

chrome/browser/resources/md_extensions/pack_dialog_alert.html

@@ -10,16 +10,19 @@
 <dom-module id="extensions-pack-dialog-alert">
   <template>
     <style include="cr-shared-style paper-button-style">
+      .body {
+        white-space: pre-wrap;
+        word-break: break-word;
+      }
     </style>
 
     <dialog is="cr-dialog" id="dialog" close-text="$i18n{close}">
       <div class="title" slot="title">[[title_]]</div>
-      <div class="body" slot="body">
-        [[model.message]]
-      </div>
+      <!-- No whitespace or new-lines allowed within the div.body tag. -->
+      <div class="body" slot="body">[[model.message]]</div>
       <div class="button-container" slot="button-container">
-        <paper-button class="cancel-button" on-tap="onCancelTap_"
-            hidden="[[!cancelLabel_]]">
+        <paper-button class$="[[getCancelButtonClass_(confirmLabel_)]]"
+            on-tap="onCancelTap_" hidden="[[!cancelLabel_]]">
           [[cancelLabel_]]
         </paper-button>
         <paper-button class="action-button" on-tap="onConfirmTap_"

chrome/browser/resources/md_extensions/pack_dialog_alert.js

@@ -20,8 +20,19 @@ cr.define('extensions', function() {
       /** @private */
       cancelLabel_: String,
 
-      /** @private */
-      confirmLabel_: String,
+      /**
+       * This needs to be initialized to trigger data-binding.
+       * @private
+       */
+      confirmLabel_: {
+        type: String,
+        value: '',
+      }
+    },
+
+    /** @return {string} */
+    get returnValue() {
+      return this.$.dialog.returnValue;
     },
 
     /** @override */
@@ -41,8 +52,10 @@ cr.define('extensions', function() {
           this.title_ = loadTimeData.getString('packDialogErrorTitle');
           this.cancelLabel_ = loadTimeData.getString('ok');
           break;
-        // If status were success, this dialog should not be attached at all.
         case chrome.developerPrivate.PackStatus.SUCCESS:
+          this.title_ = loadTimeData.getString('packDialogTitle');
+          this.cancelLabel_ = loadTimeData.getString('ok');
+          break;
         default:
           assertNotReached();
           return;
@@ -54,6 +67,14 @@ cr.define('extensions', function() {
       this.$.dialog.showModal();
     },
 
+    /**
+     * @return {string}
+     * @private
+     */
+    getCancelButtonClass_: function() {
+      return this.confirmLabel_ ? 'cancel-button' : 'action-button';
+    },
+
     /** @private */
     onCancelTap_: function() {
       this.$.dialog.cancel();
@@ -63,7 +84,6 @@ cr.define('extensions', function() {
     onConfirmTap_: function() {
       // The confirm button should only be available in WARNING state.
       assert(this.model.status === chrome.developerPrivate.PackStatus.WARNING);
-      this.fire('warning-confirmed');
       this.$.dialog.close();
     }
   });

chrome/test/data/webui/extensions/extension_pack_dialog_test.js

@@ -105,6 +105,8 @@ cr.define('extension_pack_dialog_tests', function() {
 
     test(assert(TestNames.PackSuccess), function() {
       var dialogElement = packDialog.$$('dialog');
+      var packDialogAlert;
+      var alertElement;
 
       packDialog.show();
       expectTrue(extension_test_util.isElementVisible(dialogElement));
@@ -125,6 +127,18 @@ cr.define('extension_pack_dialog_tests', function() {
             return PolymerTest.flushTasks();
           })
           .then(() => {
+            packDialogAlert = packDialog.$$('extensions-pack-dialog-alert');
+            alertElement = packDialogAlert.$.dialog;
+            expectTrue(extension_test_util.isElementVisible(alertElement));
+            expectTrue(extension_test_util.isElementVisible(dialogElement));
+            expectTrue(!!packDialogAlert.$$('.action-button'));
+
+            // After 'ok', both dialogs should be closed.
+            MockInteractions.tap(packDialogAlert.$$('.action-button'));
+            return PolymerTest.flushTasks();
+          })
+          .then(() => {
+            expectFalse(extension_test_util.isElementVisible(alertElement));
             expectFalse(extension_test_util.isElementVisible(dialogElement));
           });
     });
@@ -155,11 +169,11 @@ cr.define('extension_pack_dialog_tests', function() {
         alertElement = packDialogAlert.$.dialog;
         expectTrue(extension_test_util.isElementVisible(alertElement));
         expectTrue(extension_test_util.isElementVisible(dialogElement));
-        expectFalse(packDialogAlert.$$('.cancel-button').hidden);
-        expectTrue(packDialogAlert.$$('.action-button').hidden);
+        expectTrue(!!packDialogAlert.$$('.action-button'));
 
         // After cancel, original dialog is still open and values unchanged.
-        MockInteractions.tap(packDialogAlert.$$('.cancel-button'));
+        MockInteractions.tap(packDialogAlert.$$('.action-button'));
+        Polymer.dom.flush();
         expectFalse(extension_test_util.isElementVisible(alertElement));
         expectTrue(extension_test_util.isElementVisible(dialogElement));
         expectEquals(kRootPath, packDialog.$$('#root-dir').value);