Fix background page loading

appengine/swarming/elements/res/imp/common/auth-signin.html

 <!--
   Copyright 2016 The LUCI Authors. All rights reserved.
   Use of this source code is governed under the Apache License, Version 2.0
   that can be found in the LICENSE file.
 
   The `auth-signin` element displays sign-in/sign-out button, user email and
   avatar.
   It has a google-signin/google-signin-aware element under the hood that handles
   the actual OAuth logic.
 
@@ skipping 29 matching lines @@
       a {
         color: white;
       }
       .center {
         vertical-align: middle;
       }
     </style>
 
     <google-signin-aware id="aware"
       client-id="[[client_id]]"
+      offline
       scopes="email"
       on-google-signin-aware-success="_onSignin"
       on-google-signin-aware-signed-out="_onSignout">
     </google-signin-aware>
 
     <template is="dom-if" if="[[!signed_in]]">
       <div id="signinContainer">
         <a on-tap="signIn" href="#">Sign in</a>
       </div>
     </template>
@@ skipping 28 matching lines @@
           notify: true,
         },
         signed_in: {
           type: Boolean,
           readOnly: true,
           value: false,
           notify: true,
         },
       },
 
-      attached: function() {
+      ready: function() {
         if (!this.client_id) {
           return;
         }
         // If a page is opened in a new tab, we are (likely) already logged in
         // so we wait for the gapi and auth2 to be loaded and re-extract our
         // access_token.
-        var trySignin = window.setTimeout(function(){
+        window.setTimeout(function(){
           // The 'gapi' checks are the same that signin-aware does. We do them
           // to avoid extraneous errors in the console.
-          if (('gapi' in window) && ('auth2' in window.gapi) &&
-              !this.signed_in && !this._signingIn) {
-            var user = gapi.auth2.getAuthInstance().currentUser.get();
-            if (user && user.getAuthResponse().access_token) {
-              // User is already logged in, can use the access_token.
-              this._onSignin();
+          if (!this.signed_in && !this._signingIn){
+            if (('gapi' in window) && ('auth2' in window.gapi)) {
+              var user = gapi.auth2.getAuthInstance().currentUser.get();
+              if (user && user.getAuthResponse().access_token) {
+                // User is already logged in, can use the access_token.
+                this._onSignin();
+              } else {
+                window.setTimeout(this.ready.bind(this), 50);
+              }
             } else {
-              this.$.aware.signIn();
+              window.setTimeout(this.ready.bind(this), 50);
             }
-          } else {
-            window.setTimeout(this.attached.bind(this));
           }
-        }.bind(this),
-        // 300 ms is chosen because this seems to be long enough for the signin
-        // to happen normally on a "visible" page and avoid the popup that
-        // always happens when signIn() is manually called. It is also short
-        // enough such that when the page is opened in a new tab, it seems to
-        // happen automatically.
-        300);
+        }.bind(this), 50);
       },
 
       _onSignin: function() {
         this._signingIn = true;
         var user = gapi.auth2.getAuthInstance().currentUser.get();
         var profile = user.getBasicProfile();
         this._setProfile({
           email: profile.getEmail(),
           imageUrl: profile.getImageUrl()
         });
@@ skipping 27 matching lines @@
       signIn: function() {
         this.$.aware.signIn();
       },
 
       signOut: function() {
         this.$.aware.signOut();
       }
     });
   </script>
 </dom-module>