ANY tips on how to debug this further would be great. The button never renders at all meaning I cannot integrate google's sign in process at all into this application. Any next steps appreciated11 ->
I am following the [documentation here] (https://developers.google.com/identity/gsi/web/guides/client-library)
There is no errors in developer tools console. Does google sign-in scripts have logging I can turn on or something to see what is going on and why render fails?
I put this code in TWO apps(one working, one not working) at the end of the body in my index.html for my angular application
<script src="https://accounts.google.com/gsi/client" async></script> </body> </html>
I add the following html in both apps
<div id="g_id_onload" data-client_id="301124526277-kkp3v1t9479jnmgqdeh2rerk9nabmo94.apps.googleusercontent.com" data-context="signin" data-ux_mode="popup" data-login_uri="/postGoogleToken" data-nonce="" data-auto_prompt="false"> </div> <div class="g_id_signin" data-type="standard" data-shape="pill" data-theme="outline" data-text="signin_with" data-size="large" data-logo_alignment="left"> </div>
Although, I tweaked the html in my non-working app to see where the divs would be and to make sure they had room ->
<div class="flex-auto h-20 w-10 border-2 border-blue-900" id="g_id_onload" data-client_id="309934505077-kkp3v1t9479jnmgqdeh2rerk9nab94mo.apps.googleusercontent.com" data-context="signin" data-ux_mode="popup" data-login_uri="/postGoogleToken" data-nonce="" data-auto_prompt="false"> </div> <div class="flex-auto g_id_signin h-20 w-80 border-2 border-red-600" data-type="standard" data-shape="pill" data-theme="outline" data-text="signin_with" data-size="large" data-logo_alignment="left"> </div>
In the working app, the login button renders a very long button 100% of width and then re-renders into a better normal google sign-in button.
In my app that does not work, the button does not render at all.
picture of my working app AND picture of my app that does not work (no google sign-in button) with red and blue borders around the google divs to see if at least the viewing area was big enough..
<Image containing PII removed by staff>