One tap not dismissing on authenticating with button

180 Views Asked by At

I am currently migrating GSI to FedCM following this guide https://developers.google.com/identity/gsi/web/guides/fedcm-migration.

My use case shows both one tap and a Sign In With Google button on the same page. When use_fedcm_for_prompt is true and I authenticate with the button, one tap doesn't seem to dismiss itself. It requires a fresh page reload to dismiss. Without FedCM, when I authenticate with the button, one tap always dismissed with the old experience.

I initialized google identity by:

google.accounts.id.initialize({
  client_id: 'MOCK_CLIENT_ID',
  auto_select: true,
  cancel_on_tap_outside: false,
  callback: () => {
    // Perform auth
  },
  prompt_parent_id: 'MOCK_PARENT_ID',
  itp_support: true,
  use_fedcm_for_prompt: true
});

// Show one tap
google.accounts.id.prompt();

// Render Google button
// buttonElement is the HTML element of the parent rendering the Google button
google.accounts.id.renderButton(buttonElement, {
  theme: 'outline',
  size: 'large',
  logo_alignment: 'left',
  locale: 'en_US',
  text: 'continue_with',
  width: '400',
});

I've tried to manually dismiss one tap with google.accounts.id.cancel() through callbacks and click listeners on the button, but when FedCM is enabled google.accounts.id.cancel() doesn't dismiss the prompt anymore.

google.accounts.id.renderButton(buttonElement, {
  theme: 'outline',
  size: 'large',
  logo_alignment: 'left',
  locale: 'en_US',
  text: 'continue_with',
  width: '400',
  click_listener: () => {
    google.accounts.id.cancel()
  },
});

Is there any work around to this to make sure one tap dismisses itself when I authenticate with the button? I shouldn't need to manually dismiss one tap after it authenticates with either the button or one tap.

0

There are 0 best solutions below