Set location.href on new _blank tab asynchronously not working on MS Edge

Question

I want to open new tab using _authTab = window.open('', '_blank'); an set it's url asynchronously for example setTimeout(() => _authTab!.location.href = 'https://stackoverflow.com/', 2000);. On chrome everything works fine: blank page is openned and after 2 seconds https://stackoverflow.com/ is loaded.

function setUrlAsync(): AsyncAction {
  let _authTab: Window | null;
  return async (dispatch, getState, api) => {
    try {
      let authTab: AuthWindow;
      _authTab = window.open('', '_blank'); // A new window has to be be opened synchronously to avoid pop-up blockers (https://stackoverflow.com/questions/2587677/avoid-browser-popup-blockers)
      setTimeout(() => _authTab!.location.href = 'https://stackoverflow.com/', 2000);
    } catch (error) {
      authActions.callbackUrlNotReceived({ error });
      throw error;
    }
  };
}

Ms Edge throws an error causing new tab stays _blank

[object Error]: {description: "Permission denied", message: "Permission denied", nr@seenError: true, number: -2146828218, stack: "Error: Permission denied at Anonymous function (https://52f62d4b.ngrok.io/:149596:15) at nrWrapper (Unknown script code:1:16969)"}
description: "Permission denied"
message: "Permission denied"
nr@seenError: true
number: -2146828218
stack: "Error: Permission denied at Anonymous function (https://52f62d4b.ngrok.io/:149596:15) at nrWrapper (Unknown script code:1:16969)"

__proto__: Error

EDIT Webpage is being used inside iframe

  <iframe 
      allow="accelerometer *; ambient-light-sensor *; autoplay *; camera *; encrypted-media *; fullscreen *; geolocation *; gyroscope *; magnetometer *; microphone *; midi *; payment *; picture-in-picture *; speaker *; usb *; vibrate *; vr *"
      sandbox="allow-forms allow-modals allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts" 
      src="....">
  </iframe>

Can you please at least explain negatives? – tprieboj Jan 13 '20 at 17:57 — tprieboj, Jan 13 '20 at 17:57

score 1 · Answer 1 · answered Jan 13 '20 at 16:16

1

Edge probably considers that '' url at window.open('', '_blank') as being in a different domain. Reference: WHATWG same-origin policy
Try opening a blank page.

answered Jan 13 '20 at 16:16

meneroush

61
4

score 1 · Answer 2 · answered Jan 14 '20 at 03:38

The url can be set in new open page on Edge if we remove the sandbox attributes.

A.html

<iframe allow="accelerometer *; ambient-light-sensor *; autoplay *; camera *; encrypted-media *; fullscreen *; geolocation *; gyroscope *; magnetometer *; microphone *; midi *; payment *; picture-in-picture *; speaker *; usb *; vibrate *; vr *"
        src="B.html">
</iframe>

B.html

<input type="button" value="test" onclick="opennew()" />
<script>
    function opennew() {
        var _authTab = window.open('', '_blank');
        setTimeout(() => _authTab.location.href = 'https://stackoverflow.com/', 2000);
    }
</script>

From the doc, we can see that many values of sandbox are not supported by Edge. So this might be the reason why the url can't be set on Edge when we use iframe with sandbox attribute.

Good point, but sandbox with those exact props has to be there. — tprieboj, Jan 14 '20 at 08:35
Then I think you could only try to load the url synchronously on Edge. I tried a lot of combinations of `sandbox` values and the result is always showing error with "Permission denied" on Edge. — Yu Zhou, Jan 15 '20 at 07:50

Set location.href on new _blank tab asynchronously not working on MS Edge

2 Answers2