Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can use pushState

Does anyone know of a library that determines if pushState can be used?

I was using this:

if(window.history.pushState){
    window.history.pushState(null, document.title, path);
}else{
    location.pathname = path;
}

But I just found out that there is a bug in Safari 5.0.2 that causes it not to work even though the above test passes: http://support.github.com/discussions/site/2263-line-links-broken.

I'm thinking there might be other gotchas and someone has probably already found them and wrapped em up but I haven't found anything yet.

Edit: @Crescent Fresh

From what I've seen it seems like pushState pushes onto the history stack and changes the url but doesn't update location.pathname. In my code I'm using setInterval to check if the path has updated.

var cachedPathname = location.pathname;
if(window.history.pushState){
    cachedPathname = location.pathname;
    setInterval(function(){
        if(cachedPathname !== location.pathname){
            cachedPathname = location.pathname;
            //do stuff
        }
    }, 100);
}

In Safari 5.0.2 the location.pathname doesn't change when pushState changes the url. This works in other browsers and versions of Safari.

like image 505
keegan3d Avatar asked Feb 11 '11 06:02

keegan3d


People also ask

Does pushState reload the page?

pushState() method can be used to push a new entry into the browser's history—and as a result, update the displayed URL—without refreshing the page.

Does pushState trigger Popstate?

New! Save questions or answers and organize your favorite content. Learn more.

How do I stop browser from pushing history?

Open Chrome browser and Click on Menu, under this section tap Settings. In Site settings, again continue to scroll down and choose Notifications. In Notifications section, select the site you want to allow or deny web push services.


2 Answers

Looking at the Modernizer source code this is how it checks for push state:

  tests['history'] = function() {
      return !!(window.history && history.pushState);
  };

So a simple way for you would just be:

var hasPushstate = !!(window.history && history.pushState);

One must first check for the existence of window.history before going two levels deep and that's probably why you were experiencing an error.

like image 114
Mauvis Ledford Avatar answered Sep 28 '22 03:09

Mauvis Ledford


pushState is part of the HTML5 History API. You can test for support using regular JavaScript like so:

if (typeof history.pushState !== "undefined") {
    // pushState is supported!
}

Alternatively, you can use the Modernizr library:

if (Modernizr.history) {
     // pushState is supported!
}
like image 44
dbau Avatar answered Sep 28 '22 04:09

dbau