0

I am having a bizarre issue that I'm thinking may be a Chrome bug or possibly a bug with Visual Studio. My script is getting loaded twice. To verify the issue I created a test script that sets a cookie with a timestamp to show the code is getting appended twice. If I navigate to the page via a hyperlink it works fine. Also if I hit the back and forth buttons it also works fine -- but if I manually type the url for the second page in the browser it calls the script twice.

This only happens in Chrome and only when using a Asp.Net Web Application. If I use a Asp.Net website, it does not occur. These are new empty web applications with no extra files or settings changed.

My example html pages look like this:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Page 1</title>
    <script src="chromebug.js"></script>
</head>
<body>
    <h1>Page 1</h1>
    <a href="page1.html">Page 1</a>
    <a href="page2.html">Page 2</a>
    <a href="page3.html">Page 3</a>
</body>
</html>

And the chromebug.js look like this: 

function getCookieTest(name) {
    var cookie, cookies = document.cookie.split(';');
    name = name + '=';
    while ((cookie = cookies.pop())) {
        cookie = cookie.replace(/^\s+/, '');
        if (cookie.indexOf(name) === 0) {
            return cookie.substring(name.length, cookie.length);
        }
    }

    return null;
}

function setCookieTest(name, value, secs) {
    var c;
    if (secs > 0) {
        c = new Date();
        c.setSeconds(c.getSeconds() + secs);
        c = name + '=' + value + '; expires=' + c.toGMTString() + '; path=/';
    } else {
        c = name + '=' + value + '; path=/';
    }
    document.cookie = c;
    return
}

console.log('chromebug loaded');
var getdata = getCookieTest('loaded') || '';
setCookieTest('loaded', getdata.toString() + document.title + ':' + new Date().getTime().toString() + '|', 10000);
getdata = getCookieTest('loaded');
console.log(getdata); // show what has been saved in the cookie

Am I missing something? Any way to work around this?

I even created a video where the issue is demonstrated: http://screencast.com/t/MpXfbDMBvfY

KingOfHypocrites
  • 9,316
  • 9
  • 47
  • 69
  • What is the behavior of the script, and what it is displayed in the console that gives grounds to assume that the script is executed (loaded?) twice? – stdob-- Jul 04 '15 at 02:56
  • The whole script is above. I removed all my code to rule that out. It adds a timestamp for the second page twice to the cookie. – KingOfHypocrites Jul 04 '15 at 02:59
  • 1
    It is not clear what the problem is. Regardless of clicking on the link or typing the address manually or by clicking on the navigation buttons every time console output cookie is increased by one timestamp: `1435979438334|` ; `1435979438334|1435979480341|` ; `1435979438334|1435979480341|1435979504215|` ; `1435979438334|1435979480341|1435979504215|1435979520861|` – stdob-- Jul 04 '15 at 03:12
  • Thanks for checking in to this.. I updated my question with more details. It seems to be something with Chrome and Asp.Net Web Applications together. I made a short video showing the issue: http://screencast.com/t/MpXfbDMBvfY – KingOfHypocrites Jul 04 '15 at 14:30
  • 1
    Sorry, I cant test it with Asp.Net Web Applictions (it's not my stack). But it possible cause some like this: http://stackoverflow.com/questions/2009092/page-loads-twice-in-google-chrome – stdob-- Jul 04 '15 at 14:40
  • Thank you anyway. I appreciate you looking in to it. I checked the link you sent but couldn't find any solutions there. – KingOfHypocrites Jul 04 '15 at 15:04
  • 1
    It's very intresting behavior :) Can you clear coockie, repeat bug and show listing of some Chrome live http headers tools and part of web-server log? – stdob-- Jul 04 '15 at 15:28
  • Thank you, that was a useful tip. I see that the prefetch is making a request to the page. When I disable prefetch to make the page load faster in google chrome settings, it prevents it from being set twice. That explains why it only happens when I type it manually... because it's related to the autocomplete. Not sure how I can protect my script from this as it logs counter data each time you hit a page and this is causing duplicates. – KingOfHypocrites Jul 04 '15 at 16:01
  • 1
    Found it! if (document.webkitVisibilityState !== 'prerender') { – KingOfHypocrites Jul 04 '15 at 16:05
  • Thank you so much, going to post some screenshots, but I owe you the credit for pointing me to the live http headers. – KingOfHypocrites Jul 04 '15 at 16:06
  • A very non-obvious behavior :) – stdob-- Jul 04 '15 at 16:09

2 Answers2

2

Thanks so much to stdob for pointing me to the Live HTTP Headers extension. I'd recommend it if you are having a similar issue. https://chrome.google.com/webstore/detail/live-http-headers/iaiioopjkcekapmldfgbebdclcnpgnlo?hl=en

The issue in my case is with the Google Chrome prefetch optimization. When you type in the address bar, Google anticipates the page you will be loading and starts pulling down the scripts. If your script preforms some loading or cookie action upon loading this is problematic. When you uncheck this option you should see the duplicate loads go away.

However this is an easy way to control this without changing your settings. This is especially important since you have no control over your end-user's settings.

if (document.webkitVisibilityState && document.webkitVisibilityState == 'prerender') {
// avoid performing load logic
}
KingOfHypocrites
  • 9,316
  • 9
  • 47
  • 69
2

It's look like Chrome have non-obvious behavior when user manualy typing url in address bar. You can use some tools like Chrome live http headers to catch this behavior.

stdob--
  • 28,222
  • 5
  • 58
  • 73