Blazor open new tab/window using JSRuntime

Question

I implemented opening a new tab/window from C# using the JSRuntime. It works fine on the desktop, but when using safari on the phone it doesn't do anything: the new tab fails to open on mobile devices.

Any one has had any luck getting this to work?

await JSRuntime.InvokeAsync<object>("open", url, "_blank");

Answer 1

Add a javascript method to open the URL in another tab and call that method using JsRuntime.

If you use window.open() js method it wont work on all browsers so need to dynamically create an a element and raise a click event on it.

See below:

window.NavigateTo = (url) => {
  const link = document.createElement('a');
  link.href = url;
  link.target = '_blank';
  document.body.appendChild(link);
  link.click();
  link.remove();
}