title: Google API Sign In Button: Basic v. Custom
body: <p>I'm working on adding a Google Sign-In Button to a website.  In the docs, Google offers two options, a "basic" button:</p>
  
  <p><a href="https://developers.google.com/identity/sign-in/web/sign-in" rel="noreferrer">https://developers.google.com/identity/sign-in/web/sign-in</a></p>
  
  <p>and a "custom" button using <code>signin2.render()</code>:</p>
  
  <p><a href="https://developers.google.com/identity/sign-in/web/build-button" rel="noreferrer">https://developers.google.com/identity/sign-in/web/build-button</a></p>
  
  <p>The problem I'm encountering is that the two buttons exhibit different behavior.  If I sign in with either button, the button's "title" changes from "Sign In" to "Signed In" to reflect the sign-in status.  However, if I now refresh the page, then the basic button retains the title "Signed In", whereas the custom button changes its title back to "Sign In", suggesting (incorrectly) that the sign-in status has changed through the page refresh.  </p>
  
  <p>If I manually check the sign-in status post-refresh in the browser console by running:</p>
  
  <pre><code>auth = gapi.auth2.getAuthInstance()
  auth.isSignedIn.get()
  </code></pre>
  
  <p>I get <code>true</code> as a return, showing that the refresh indeed did not alter the sign-in status, contrary to the change in the button's title.</p>
  
  <p>So my question is: how can I get the custom button to behave like the basic button, so that its title does not change on refresh?  Another (related, I assume) behavior of the basic button that I like is that the button's "onsuccess" callback gets called on each page load (if the user is signed in), whereas the custom button does not do this.  So I'd also like to change this behavior on the custom button to match that of the basic button.  Any suggestions would be greatly appreciated!</p>
  
  <hr>
  
  <p>The parameters I'm passing to render look as follows:</p>
  
  <pre><code>function renderButton() {
      gapi.signin2.render('mybutton', {
      'scope': 'profile email',
      'width': 125,
      'height': 40,
      'longtitle': false,
      'theme': 'light',
      'onsuccess': onSuccess,
      'onfailure': onFailure
    });
  }
  </code></pre>