title: How to use pushState,replaceState and popState correctly?
body: <p>I'm trying to use the history API but I can't get it working as I'd expect. I've look at several examples but they all appear to be doing something wrong. That is, this flow doesn't work as expected:</p>
  
  <ol>
  <li>On new page call pushState</li>
  <li>On popState load desired page</li>
  </ol>
  
  <p>What I'm finding happens is that for #2 the URL is not modified to the old state (testing in Firefox). Unless I call pushState, or replaceState again the URL stays where it was. I'm also finding that somehow the first page ends up duplicated in the browser's history (holding down back I can see it).</p>
  
  <p>How exactly should the history be used so that Back/Forward/Reload all work like a traditional page flow?</p>