Cannot read property 'style' of null

[Wylianne]

The example works fine, but if I use router.navegation the page generated this error.

Uncaught TypeError: Cannot read property 'style' of null at G_ (cb=gapi.loaded_1:70) at H_. (cb=gapi.loaded_1:73) at Function. (cb=gapi.loaded_0:191) at MessagePort.c.port1.onmessage (cb=gapi.loaded_0:111)

[tom10271]

I have the same issue too.

The flow is: Sign in with Google Redirect to Main page Wait for seconds Logout in Main Page, It should go back to login page Then error throws

[tom10271]

https://github.com/google/google-api-javascript-client/issues/281

[miltador]

Hi! I will look into it this weekend, bare with me!

[gusarov]

In my case problem appears during navigation through tabs. And apparently element ID is not there after ngAfterViewInit indeed. So, I just added waiting for the button to appear, like this:

	var btn = document.getElementById(btnId);
	if (!btn) {
		console.log('sso', 'wait for button started');
		var waitForRes;
		var waitFor = new Promise((res, rej) => {
			waitForRes = res;
		});
		this.ngZone.runOutsideAngular(()=>{
			var timer = setInterval(() => {
				btn = document.getElementById(btnId);
				console.log('sso', 'wait for button...', btn);
				if (btn != null) {
					clearInterval(timer);
					this.ngZone.run(() => {
						waitForRes();
					});
				}
			}, 100);
		});
		await waitFor;
		console.log('sso', 'button is there!', btn);
	}

	console.log('sso', 'renderGoogle Loaded');
	gapi.signin2.render(btnId, { ...

So, there is nothing bad with gapi I believe... except that it was advised to use ngAfterViewInit for render call. But during SPA navigation with a router, switching components back and forth the target element ID that we supposed to path to Render call is actually not ready.