I have a single page application and would like to navigate through the history using browser back and forward button. I am facing an issue when i click the back button once it does not navigate to the previous page but stays on the current page. Then when i click the browser back again it takes me to the previous page. I have tried out the following.

class PageModule {
      constructor() {
        window.addEventListener("popstate",function(){
          this.handleHistory(true);
        }.bind(this),false);
       }

  

handleHistory(popStateEventFired = false){
    if(popStateEventFired){
      history.replaceState();
    }else{
      history.pushState(null,null);
    }

    history.pushState(null,null);
    
  }
        

When i issue a search i add the search param as a query param in the url ?question=testsearch and call the method handleHistory(). I have checked other answers to similar problem but they dont seem to help. I have to do this using vanilla javascript or knockoutjs as we maintain HTML bindings using knockoutjs but am not able to achieve this properly. Any help is appreciated