document.location.reload(true) canceled in chrome

Viewed 806

I have a function to check if results are on the server.

var d = document;
var dl = d.location;
var w = window;
var wt = w.setTimeout;
var X = XMLHttpRequest;
function _checkreload() {
    var x = new X();
    x.open('GET', '?test=results');
    x.onreadystatechange = function (c) {
        if (x.readyState === 4) {
            if (x.status == 205) {
                dl.reload(true);
            } else {
                wt(_checkreload, 200);
            }
        }
    };
    x.send();
};

_checkreload();

Sometimes the reload is canceled for unknown reason:

enter image description here

Question

How to find out for what reason the reload is canceled?

Details of the request

Because the request is canceled there are no informations in the details pane. Even if some bytes has been sent to the server (or even responsed from the server back to the browser), chrome does not display them.

2 Answers

try to add a try {} catch inside your _checkReload function. This will help you know what is the error, if it's on JS side.

var d = document;
var dl = d.location;
var w = window;
var wt = w.setTimeout;
var X = XMLHttpRequest;
function _checkreload() {
    try { // Add a try here...
        var x = new X();
        x.open('GET', '?test=results');
        x.onreadystatechange = function (c) {
            if (x.readyState === 4) {
                if (x.status == 205) {
                    dl.reload(true);
                } else {
                    wt(_checkreload, 200);
                }
            }
        };
        x.send();
    } catch (err) { console.log(err); } // ... and a catch there.
};

_checkreload();

As your function reloads the HTML page, I recommend you to enable the Preserve log feature on the chrome developer tools. This will helps a lot while debugging.

Last but not least, please note that if you are running this code from localhost, you may face CORS errors.

Like some of the other comments are mentioning, it looks like your code is competing with loading all of the page assets.

To protect it you might need to wrap your function inside of an event listener for the load event of the window.

window.addEventListener('load', function(event){
    var d = document;
    var dl = d.location;
    var w = window;
    var wt = w.setTimeout;
    var X = XMLHttpRequest;
    function _checkreload() {
        var x = new X();
        x.open('GET', '?test=results');
        x.onreadystatechange = function (c) {
            if (x.readyState === 4) {
                if (x.status == 205) {
                    dl.reload(true);
                } else {
                    wt(_checkreload, 200);
                }
            }
        };
        x.send();
    };

    _checkreload();
});

If the timing every 200 ms is critical for this, you could set an event listener for loadstart and loadend of the window with timestamps for each. The difference between the events is your offset for the initialsetTimeout.

Related