As of today, when I attempt to import Gapi in a React App bundled by Webpack and compiled by Babel, I am thrown a net::ERR_UNKNOWN_URL_SCHEME error. The error also indicates that my browser is trying to fetch about:blank when loading Gapi. I believe network requests indicates that these calls are being attempted by loaded Gapi scripts:
I've tried working around the issue with several React loader libraries and manually adding the Gapi script tag to head. I now believe this is primarily an issue with my configuration of Webpack. I am able to import Gapi without any problems in a plain html doc that I open in my browser. I had been able to use Gapi comfortably with Webpack prior to today.
Minimum reproducible example:
export type ReactGapiProps = {}
export const ReactGapi : FC<ReactGapiProps> = () =>{
const [tick, forceUpdate] = useReducer(x=>x+1, 0);
const script = document.createElement("script");
script.src = "https://apis.google.com/js/client.js";
script.onload = ( e : Event)=>{
if(script.onload){
script.onload(e)
}
forceUpdate()
}
document.head.appendChild(script);
return (
<div>
{window.gapi ? "Yay it worked!" : "Check the logs."}
</div>
)
}
Webpack config is CRA default.
Update 1: It looks like some Chrome extensions are not playing nicely with Gapi. I can use the API just fine on Firefox and Chrome on other machines. Here's what I have it narrowed down to:
Pop up blocker for Chrome™ - Poper Blocker Read and change all your data on the websites you visit
AdBlock — best ad blocker Read and change all your data on the websites you visit
Okta Browser Plugin Read and change all your data on the websites you visit
SendSafely Encryption for Chrome and Gmail Read and change your data on all sendsafely-au.com sites and all sendsafely.com sites
LastPass: Free Password Manager Read and change all your data on the websites you visit
Phish Alert Read and change your data on a number of websites
Disconnect Read and change all your data on the websites you visit
Update 2: I have not been able to replicate this error since the day I first encountered it. I'm going to try loading some of the extensions in Cypress today.