Override location.search javascript without reloading page

Question

I want to modify the location.search attribute, right now if I do:

<script>location.search = "dummyparam=dummyvalue";</script>

But it realoads the page to the new url including the new values of location.search, what I want is to fake it.

I tried using:

Object.defineProperty(window, 'location', {
  search: "fakeparam=fakevalue"
});

Also doing:

Object.defineProperty(location, 'search', {
  search: "fakeparam=fakevalue"
});

But none worked, any clues?

Thanks!

Answer 1

The only way you can modify the url (including location.search) without reloading is using HTML5 history API push state.

You can do something like:

window.history.pushState("", "", "/this-is-new-url?fakeparam=fakevalue");