Update Query Parameter in URL

updateQueryParam

Updates a query parameter in the browser's current URL without reloading the page, using the History API.

Function Signature

function updateQueryParam(key: string, value: string): void

Parameters

Returns

• void: This function does not return a value.

Example Usage

import { updateQueryParam } from 'toolbox-x/dom';

// Assuming current URL: https://example.com/?user=alex&role=admin

updateQueryParam('user', 'sam');
// Browser URL is now: https://example.com/?user=sam&role=admin

Behavior Details

• No Reload: Uses window.history.replaceState under the hood. The URL changes visually and programmatically in the browser, but the page does not reload.
• State Replacement: Because it uses replaceState, it updates the current browser history entry rather than pushing a new one, keeping the back button history unchanged.
• Browser Only: Depends on window and the History API; it will fail if executed on the server.