URL's search query not changing

Question

Hi,
I'm trying to change the url's search query, but it's not updating. My custom SPFx web part calls this function:

however, the url does not update. When testing locally on the workbench, it works fine.
I tried to listen for the "popstate" event and it does work, the "window.location.search" updates correctly. However the url in the address bar does not change.

Answer 1

Hi @karolis.stoncius ,
I'm glad to hear you solve the problem ,if you have any issue about SharePoint, you are welcome to raise a ticket in this forum.

By the way, since the Microsoft Q&A community has a policy that "The question author cannot accept their own answer. They can only accept answers by others." and according to the scenario introduced here: Answering your own questions on Microsoft Q&A, I would make a brief summary of this thread:

[URL's search query not changing]

Issue Symptom:
Unable to update url by spfx web part in address bar

Current status:
Solved this by changing parent.location.href directly ( parent is the important part ), instead of using history.pushState.

You could click the "Accept Answer" button for this summary to close this thread, and this can make it easier for other community member's to see the useful information when reading this thread. Thanks for your understanding!

Answer 2

Hi @karolis.stoncius ,
Per my test, you could try following code to update urls.

    export default class HelloWorldWebPart extends BaseClientSideWebPart<IHelloWorldWebPartProps> {  
      public onInit(): Promise<void> {  
        ((history) => {  
          var pushState = history.pushState;  
          history.pushState = (state, key, path) => {  
              pushState.apply(history, [state, key, path]);  
              this._onUrlChange(path);  
          };  
        })(window.history);  
    return Promise.resolve();  
  }  

---

If the answer is helpful, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

---

Answer 3

Solved this by changing parent.location.href directly ( parent is the important part ), instead of using history.pushState.