"Prevent" popstate firing on hash change

fixhistory.coffee

currentPathname = null

window.onpopstate = (ev) ->

  return if document.location.pathname == currentPathname
  currentPathname = document.location.pathname

  #... (now handle a real back-button or page load event)

Don't forget document.location.search if you want query params.

window.onpopstate = (ev) ->
  return if ev.srcElement.location.pathname == ev.target.location.pathname
  # now handle a real back-button or page load event

Conventional JavaScript example.

In our case, a third party script was setting window.location.href to itself, which didn't have the intended effect (refreshing the page) due to a hash being present.

So, this script detects if the hash is being changed to itself and fires a refresh.

But there are a lot of other cool things you can do with this pattern so sharing here:

let currentHash = window.location.hash;

window.addEventListener('popstate', function( event ) {
	if ( window.location.hash == currentHash ) {
		window.location.reload();
	}

	currentHash = window.location.hash;
} );

window.onpopstate = (ev) ->
  return if ev.srcElement.location.pathname == ev.target.location.pathname
  # now handle a real back-button or page load event

srcElement and target are the same https://developer.mozilla.org/en-US/docs/Web/API/Event/srcElement