Reading window.history.state object in Webkit

Question

Safari and Chrome (and, I'm guessing, all Webkit browsers) do not respond to window.history.state which is specified in the evolving HTML5 standard here and is implemented in Firefox.

Is there a workaround to read it? Perhaps it is possible to trigger a popstate event in code and return the state from the event handler?

Solution 1

window.history.state is not implemented in webkit broswers currently. There is a request for it, but no steps towards implementation were done so far.

There is a project called history.js which is aiming to provide cross-compatible history management experience.

History.js gracefully supports the HTML5 History/State APIs (pushState, replaceState, onPopState) in all browsers. Including continued support for data, titles, replaceState. Supports jQuery, MooTools and Prototype. For HTML5 browsers this means that you can modify the URL directly, without needing to use hashes anymore. For HTML4 browsers it will revert back to using the old onhashchange functionality.

From that project, History.getState() seems to do what is requested.

Solution 2

I ran into this issue yesterday. I didn't need a cross browser solution since the target platform is running an oldish version of WebKit, so I created a quick and simple polyfill for history.state in WebKit:

// Polyfill for history.state in older webkit engines
if (!history.hasOwnProperty('state')) {
    (function (push, rep) {
        // history.state is always initialised to null
        history.state = null;

        history.pushState = function (state) {
            push.apply(history, arguments);

            history.state = state;
        };
        history.replaceState = function (state) {
            rep.apply(history, arguments);

            history.state = state;
        };

        window.addEventListener('popstate', function (e) {
            history.state = e.state;
        }, true);

    })(history.pushState, history.replaceState);
}