Question

Hey i have the following statechange event set on the window :

History.Adapter.bind(window,'statechange',function(e){ 
 console.log("statechange event occured ");
 //more code
    var newDoc = document.open();
    newDoc.write(file);
    newDoc.close();
});

i’m using history.js but that doesn’t matter in this case as it binds the statechange regulary, i am getting the value of file like should be and works fine.

Now i have this code (and other code) inside an external js file,
inside the file i’m iterating through all a tags and apply the following click event :

    $(element).on("click",function(e){
    e.preventDefault();
    //more code

    History.pushState({file : file},title, fullHref);


});

Now when i click the document is getting changed as expected but when trying to use back/forward buttons statechange event does not fire.

I should mention that this js is included in the files im loading as well.

So my initial thought was that as the document changes but the window doesn’t, the event remains. which is not true as it applies the statechange event multipile times. So i tried applying the event once using cookie but that still does the same thing.

Now if instead of changing the document i simply apply it with jQuerys .html() the statechange event gets fired as exepected so i guess it’s related to the document.

Why could this happen? I believe if i understood more about what happens to window events when changing documents i could solve this problem.

Tries :

• I have now also tried binding to the popstate event via regular History API, still same results give or take. pushState doesn’t fire popstate but back button does but without state.
• I have come to the conclusion that i shouldn’t be using history.js as i susspect the problem came from there so i “solved” my problems with popstate which still causing problems as document.open seems to be firing popstate. still looking for more information
• I’ve tried using on, same result

Information :

• the fact this example us using History is because of history.js, if i use regular history API still same problems.

I have read in mdn that :

{{ gecko_minversion_note(“1.9.2”, “Starting with Gecko 1.9.2, document.open() uses the

principal of the document whose URI it uses, instead of fetching the
principal off the stack. As a result, you can no longer call
document.write() into an untrusted document from chrome, even using
wrappedJSObject.”) }}

Which im not sure but i think could be realted to this problem

Answer 1

Well, in the end i discovered that all though you only change document, window events gets deleted as they lay inside the document.

I encoutred my problems with History.js i think because the fact that im changing documents break it at some point.

What i did was use native HTML5 history API and rebinded the popstate event in the new document.