Develop Reference

Window that was opened by window.open won't close

I'm having problems with a piece of code that has worked before for years, but seems to have stopped working now.
I'm opening a window with a login form and I'm listening via a WebSocket for events regarding that login. After the login was successful, I want to close the window (that my script has opened and kept the reference to) after a short moment. I'm using the following code:
const windowManager = {
window: null,
eventType: null,
}
function openWindow({ url, eventType }) {
windowManager.window = window.open(url)
windowManager.eventType = eventType
}
function closeWindow({ eventType }) {
if (windowManager.window && windowManager.eventType == eventType) {
setTimeout(() => {
windowManager.window && windowManager.window.close()
windowManager.window = null
}, 100)
}
}
I have confirmed that windowManager.window.close() is called and does not thrown an error. I have also extracted the code from the application and tested it separately and it still won't close the window. As I said, this piece of code has worked before and was not changed in the past two years or so.
I'm using the following browsers:
Safari 15.3
Firefox 97.0b9 (Developer Edition)
Chromium 94.0.4606.61
I'm grateful for any pointers which could help resolve this issue. Thanks a lot!

After figuring out that the above code worked totally fine with other sites like Google or GitHub, I found that the Cross-Origin-Opener-Policy header in our auth backend (which was the site that was opened with the code) is the culprit. We had just updated Helmet to version 5 which added the header by default.
Our solution was to set Cross-Origin-Opener-Policy to same-origin-allow-popups on both source and target window (which are hosted on the same origin, but served by different servers). It also worked when setting it to unsafe-none for the target window without setting it at all on the source window.

"navigator.msLaunchUri" in IE Edge always return success

"navigator.msLaunchUri" in IE Edge always return success ,
"noHandlerCallback" is not executed
I tried this :
navigator.msLaunchUri('App:123456',
function()
{
alert('success');
},
function()
{
alert('failed');
}
);
It will always return "success" and if the protocol was not supported it will open the windows store dialog and return "success"

I have seen that Edge behaves differently from IE11 in this regard. I am not sure if this exactly the same problem that you are experiencing but this is what I have seen.
If you register a protocol, launch it with IE11 and later unregister, Edge gets confused.
Short Answer:
Make sure that when you unregister your protocol, you completely remove the following registry keys if they exist:
HKEY_CURRENT_USER\Software\Classes\myprotocol
HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\ProtocolExecute\myprotocol
Long Answer:
When you call msLaunchUri, IE11 looks at the first key above to determine if the protocol is registered, but Edge looks at both keys.
The first one is the key that you use to register the protocol, the second one is a key created by IE11 when you launch the protocol from it.
So if the user happens to launch the protocol with IE11, then unregister, Edge will get confused.
To make sure Edge does not get confused, remove all the keys completely.

Popup to Parent Window Communication in Internet Explorer

I have an iframe embedded into a legacy application. Inside of the iframe I need to do oauth (I'm capturing authentication tokens for later use). In order to do oauth from within an iframe I need to use a popup window. What I need is for that popup window to communicate back to the iframe when oauth completes so the page within the iframe can refresh its data. I need to support IE 10+, Chrome, and Firefox, and everything I've tried works fine in Chrome/Firefox but fails in IE. My current solution (which almost works) looks like this:
/** From within the iframe **/
var storageName = 'SoProOauth';
var addAccountDeferred;
$window.addEventListener('storage', function (evt) {
if (evt.key == storageName) {
localStorage.removeItem(storageName);
getAccounts().then(function () {
addAccountDeferred.resolve();
});
}
});
// ... later ...
addAccount: function (type) {
addAccountDeferred = $q.defer();
var uri = util.format('/oauth/%s/connect?auth=%s&return_uri=%s',
type, configuration.get('auth'), encodeURI('/configure/oauthcomplete'));
if (Boolean(configuration.get('debug'))) {
uri += '&debug=true';
}
localStorage.removeItem(storageName);
var oauthWindow = $window.open(uri, 'oauth', 'width=800,height=600');
if (oauthWindow && oauthWindow.focus) oauthWindow.focus();
return addAccountDeferred.promise;
}
/** From within the popup **/
localStorage.setItem('SoProOauth', 'done');
$timeout(function () {
setInfo('This window can be closed');
$window.open('', '_self', '');
$window.close();
}, 500);
Basically, I'm writing to local storage from within the popup window, and listening for the write event in the parent window. This almost works - it works great in my local test environment but fails when I deploy it to the dev cluster. There could be two reasons why it fails: 1) when I run locally everything is over HTTP, but in the dev cluster it is over HTTPS (worse, the page that hosts the iframe is HTTP but the iframe contents are HTTPS), or 2) when I run locally everything is localhost, but in the dev cluster the iframe host is one machine (local intranet) and the contents of the iframe are public internet (AWS).
Other things I've tried: cookies (same result - works locally but fails deployed), and all of the window properties (window.opener, window.parent, and testing for window.closed() from within the iframe) - these don't work in IE as things get reset once the domain changes (which happens because we're doing oauth).
As you can see the UI code is AngularJS, but what you can't see is it is hosted by Node.js. So I've considered using something like socket.io but it seems so heavy-hitting - I really just need to send a quick event from the popup to the parent within the iframe. Any thoughts?

JQuery security error in Opera and Internet Explorer

I am developing an app for social network which works in IFrame. The app works just fine in Google Chrome and Microsoft Firefox browsers, but in Opera 12.15 JQuery library v1.10.1 fails to load with security error Unhandled error: Security error: attempted to read protected variable on line 1513.
The screenshot is here:
It looks like the same bug exists in Internet Explorer 10.
How to deal with it?
UPDATE:
I have made dirty hack by commenting the lines 1513-1517 in the code of jquery:
// Support: IE>8
// If iframe document is assigned to "document" variable and if iframe has been reloaded,
// IE will throw "permission denied" error when accessing "document" variable, see jQuery #13936
/*if ( parent && parent.frameElement ) {
parent.attachEvent( "onbeforeunload", function() {
setDocument();
});
}*/
The functionality of my app seems to work now, maybe it is necessary to create issue in JQuery repo...

Bug report was created - http://bugs.jquery.com/ticket/13980.
Bug is now fixed.

Add this before you include JQuery:
var isIE11 = !!(navigator.userAgent.match(/Trident/) && !navigator.userAgent.match(/MSIE/));
if (isIE11) {
if (typeof window.attachEvent == "undefined" || !window.attachEvent) {
window.attachEvent = window.addEventListener;
}
}
Hope it helps, It worked for me.

importNode for web-page document in another domain

I want to get at the 'outerHTML' of a node I've captured using document.evaluate (ie xPath) from a node on another web page that is from a different domain. I.e. I have a Firefox tab running my javascript that is trying to access the content of a second tab. I dont have control over the content of the web page in the second tab.
I used importNode along with the answer to a similar question...
How do I do OuterHTML in firefox?
I am able to do other cross domain manipulation, but cant get importNode to work. I only need this to work in Firefox.
This is where I've got to so far - get error message: "Access to property denied code: 1010" ...
netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserWrite");
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
var recordNodeClone = currentFrame.document.importNode(recordNode, true);
var fosterParentNode = document.createElement('div');
//Error for line below: Access to property denied" code: "1010
fosterParentNode.appendChild( recordNodeClone );
var recordNodeOuterHTML = fosterParentNode.innerHTML;
console.log("fosterParentNode=%o", fosterParentNode);
console.log("fosterParentNode.innerHTML=%o", fosterParentNode.innerHTML);