Why isn't the gapi library working with my chrome extension?

In background.js I loaded the script. When using oauth2, the promise from the init function does not return and nothing is logged. However, when I remove oauth2 (clientId and scope) then the promise returns and 'GAPI INITED' is logged.

Any idea why gapi works without oauth2 but then doesn't work with oauth2? Any workarounds?

Gapi Loaded:

var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = "https://apis.google.com/js/client.js";
head.appendChild(script);

window.onload = function () {
  setTimeout(function () {
    gapi.load('client:auth2', initClient);
  }, 500);
};

function initClient() {
  console.log('GAPI PRE INIT');

  gapi.client.init({
      apiKey: API_KEY,
      discoveryDocs: DISCOVERY_DOCS,
      clientId: CLIENT_ID, //Only access 'GAPI INITED' when this line is commented out
      scope: SCOPE //Only access 'GAPI INITED' when this line is commented out
  }).then(function () {
    // Listen for sign-in state changes.
    console.log('GAPI INITED');
    gapi.auth2.getAuthInstance().isSignedIn.listen(updateSigninStatus);

    
  });
}