MD Settings: Use dom-if for the profile disconnect dialog.

chrome/browser/resources/settings/people_page/people_page.js

Index: chrome/browser/resources/settings/people_page/people_page.js
diff --git a/chrome/browser/resources/settings/people_page/people_page.js b/chrome/browser/resources/settings/people_page/people_page.js
index 76115fddd4583d3a59b160bcc82c51c1338189b6..b933dff5ec2a52c8d0048b2da7372ca39e79cd15 100644
--- a/chrome/browser/resources/settings/people_page/people_page.js
+++ b/chrome/browser/resources/settings/people_page/people_page.js
@@ -79,6 +79,9 @@ Polymer({
       value: function() {
         return settings.SyncBrowserProxyImpl.getInstance();
       },
+
+      /** @private */
+      showingDisconnectDialog_: Boolean,

[tommycli, 2017/03/27 16:11:23]

I think the other instances i've seen have been "showFooDialog_" rather than
'showing'. Also I believe this property may be at the wrong indent level.
(within another property)

[dpapad, 2017/03/27 20:47:39]

Done and done.

     },
 
 // <if expr="chromeos">
@@ -184,12 +187,16 @@ Polymer({
       // If the sync status has not been fetched yet, optimistically display
       // the disconnect dialog. There is another check when the sync status is
       // fetched. The dialog will be closed then the user is not signed in.
-      if (this.syncStatus && !this.syncStatus.signedIn)
+      if (this.syncStatus && !this.syncStatus.signedIn) {
         settings.navigateToPreviousRoute();
-      else
-        this.$.disconnectDialog.showModal();
-    } else if (this.$.disconnectDialog.open) {
-      this.$.disconnectDialog.close();
+      } else {
+        this.showingDisconnectDialog_ = true;
+        this.async(function() {

[Dan Beam, 2017/03/25 11:26:04]

is it possible that this.showingDisconnectDialog_ is now false?

[tommycli, 2017/03/27 16:11:23]

It does seem possible...

We could recheck the variable... or we could also post async the close call
below, and in that case, it should post and execute the 'show' and 'close' tasks
in the correct order.

[dpapad, 2017/03/27 20:47:39]

I believe this is not possible. The boolean is set to false, only when the
dialog is closed, and the dialog can't be closed until it has been opened first.
Also, we use the same pattern in other places (flip boolean, async(), get a ref
to the dialog and call showModal), and have never seen an issue. I'd rather not
do anything more than necessary here, until it proves to be a problem.

+          this.$$('#disconnectDialog').showModal();
+        }.bind(this));
+      }
+    } else if (this.showingDisconnectDialog_) {
+      this.$$('#disconnectDialog').close();
     }
   },
 
@@ -253,8 +260,8 @@ Polymer({
       settings.ProfileInfoBrowserProxyImpl.getInstance().getProfileStatsCount();
 // </if>
 
-    if (!syncStatus.signedIn && this.$.disconnectDialog.open)
-      this.$.disconnectDialog.close();
+    if (!syncStatus.signedIn && this.showingDisconnectDialog_)
+      this.$$('#disconnectDialog').close();
 
     this.syncStatus = syncStatus;
   },
@@ -300,6 +307,7 @@ Polymer({
 
   /** @private */
   onDisconnectClosed_: function() {
+    this.showingDisconnectDialog_ = false;

[tommycli, 2017/03/27 16:11:23]

Hmm... I'm not sure this call is even necessary. On the navigate to previous
route, it should also close the dialog.

[dpapad, 2017/03/27 20:47:39]

The dialog will be closed from the navigation (happens in currentRouteChanged),
but the boolean needs to be flipped to false to be consistent (note that we are
using restamp with the dom-if). If I don't flip the boolean here, it will always
stay "true" passed that point.

     if (settings.getCurrentRoute() == settings.Route.SIGN_OUT)
       settings.navigateToPreviousRoute();
     this.fire('signout-dialog-closed');
@@ -312,7 +320,7 @@ Polymer({
 
   /** @private */
   onDisconnectCancel_: function() {
-    this.$.disconnectDialog.close();
+    this.$$('#disconnectDialog').close();
   },
 
   /** @private */
@@ -328,7 +336,7 @@ Polymer({
       this.syncBrowserProxy_.signOut(deleteProfile);
     }.bind(this));
 
-    this.$.disconnectDialog.close();
+    this.$$('#disconnectDialog').close();
   },
 
   /** @private */