Google Login gapi.auth2.init(): not resolving or r

Question

I have some google login code I use to display a google login button as well as listen for changes in sign in. It works perfect the majority of the time, but I've had some users tell me it doesn't work and have to use our manual login. I can't seem to replicate the problem. We work with students and often only one student in a classroom will not be able to see the button... yet, they're all on the same type of chromebooks.

I've added an AJAX call to send me an email for debugging if after 10 seconds gapi.auth2.init() isn't resolved or rejected. That's how I know the issue is with gapi.auth2.init(). Below is the relevant part of the code. Thank you a billion for any help you can offer!

var gapi_step = 'loading platform';

function gapi_init(callback) {

    gapi_step = 'gapi_load()'; // client library loaded

    auth2 = gapi.auth2.init({
        client_id: client_id,
        cookiepolicy: 'single_host_origin'
    });

    auth2.then(function () {

        gapi_step = 'gapi_load() callback';

        // code to set up listeners and show UI panels containing login button

    }, function(error) {

      // code to email error: it never gets here
      $.ajax({
          url: 'email.php', // url that sends email
          type: 'post',
          data: {
              'failed': 'gapi.auth2.init',
              'error': error,
              'gapi_step': gapi_step,
              'navigator.userAgent': navigator.userAgent,
              'navigator.appVersion': navigator.appVersion,
              'gapi': typeof(gapi)
          }
      });
    });
}

When, it gets stuck, after 10 seconds it sends out an email telling me the value of gapi_step. It always seems to be "gapi_load()". It never gets to "gapi_load() callback"

The after 10 seconds bit works 'cause I get emails, but it looks something like this:

function debugGoogleLoginButton(seconds) {
    var delay = seconds * 1000;
    setTimeout(function(){ 
        if ( // check if UI wasn't updated  

            // these UI panels will show up if the promise is resolved  
            ($('.panel_google-signed-out').is(':hidden')) &&
            ($('.panel_google-signed-in').is(':hidden')) 
        ){
            // ajax call to send email with value of gapi_step & browser info
            $.ajax({
                url: 'email.php', // url that sends email
                type: 'post',
                data: {
                    'gapi_step': gapi_step,
                    'navigator.userAgent': navigator.userAgent,
                    'navigator.appVersion': navigator.appVersion,
                    'gapi': typeof(gapi)
                }
            });     
        }
    }, delay);
}

$(document).ready(function(){ 
    debugGoogleLoginButton(10); 
});

Here's what the output of the emails look like:

{"gapi_step":"gapi_load()",
"navigator_userAgent":"Mozilla\/5‌​.0 (X11; CrOS x86_64 8743.85.0) AppleWebKit\/537.36 (KHTML, like Gecko) Chrome\/54.0.2840.101 Safari\/537.36","navigator_appVersion":"5.0 (X11; CrOS x86_64 8743.85.0) AppleWebKit\/537.36 (KHTML, like Gecko) Chrome\/54.0.2840.101 Safari\/537.36",
"IP":"207.31.42.81"}

And I'd get a different email if the promise was rejected that would show the error message as well as the data above. That's sent out where it says // code to email error

I guess the big question is what could cause the promise to not resolve or reject for one student, but not the rest of his class. What would cause the promise to hang like that and not throw an error?

Teachers have told me that the button never displays on only certain chromebooks, but does display on the rest. That rules out any firewall issues.