Cross-window Javascript communication 2.0
Back in April 2005, I wrote about a JavaScript system to regain control of an orphaned popup window. A couple of days ago, Robert Emmery left a comment stating that he had a simpler solution that didn’t require the somewhat clumsy notifier mechanism. Of course, at first, I didn’t believe him. Surely, nobody can solve a problem that I thought was insolvable! 
Anyway, I challenged Rob to produce an example that reproduced exactly what mine did and he did so I declare my solution officially obsolete. Here’s Rob’s solution:
In the main window:
var popupWin = null;
function openPopup() {
var url = "popup.htm";
popupWin = open( "", "popupWin", "width=500,height=400" );
if( !popupWin || popupWin.closed || !popupWin.doSomething ) {
popupWin = window.open( url, "popupWin", "width=500,height=400" );
} else popupWin.focus();
}
function doSomething() {
openPopup();
popupWin.doSomething();
}
In the popup:
self.focus();
function doSomething() {
alert("I'm doing something");
}
As you can see it’s much cleaner. Thanks Rob!
Rob is the founder of SpaceCatch Inc, a social networking service that will launch some time in January.
You can read about the original solution and it’s problem here.
September 21st, 2007 at 10:19 pm
Thank you a million time for this I’ve been looking to do this since quite a long and you perfectly solve my problem.
Hugs
mika
August 10th, 2007 at 9:24 pm
Thank you for the excellent article. I’ve used the techniques here to create a fairly complex object that manages some pop up windows in a web application. It is pretty slick and this was a key component in it.
Also, thanks Adam for your post about adding onload events to new pop ups. I used Simon’s functions to create some pretty sweet communication between windows. Thanks again everyone!
August 2nd, 2007 at 8:07 pm
Whoops, that should be “var foo = function() { … }” in the last paragraph. Sorry. Also, missing the word “why” from the last sentence in the first paragraph.
–adam
August 2nd, 2007 at 7:59 pm
Actually, for complex or slow webpages/sites, the above example won’t work because you have a race condition between the second page loading and the first page executing the javascript function call on the second page. The function doSomething() doesn’t exist until the browser parses that code and says it exists. This is some people above are getting the error.
One solution is to put a sleep timer in between the window open call and the call to doSomething(), however again, for complex or slow webpages or sites, you have no idea how long this delay needs to be and Firefox kindly warns the user if a JavaScript function executes for too long.
I believe the right way would be to override the window’s onload event handler to ensure that everything exists before executing any function call. But what if you already have an onload function defined? How can I get more than one function to execute at page load time without having a massive function or a function that calls a bunch of other functions?
I’m glad you asked. The solution is to have a callback manager for the onload event handler. You can find the code here: http://simonwillison.net/2004/May/26/addLoadEvent/
Do a search on “Andreas Karlsson” to find his callback manager code. Basically it maintains an array of functions to execute. This way, you can define your functions via “var foo = function { … } and then call “window.onload.addCallback(foo); to register your function. This way, you are guaranteed that the page has finished loading and you don’t need any sleep scripts.
–adam
May 4th, 2007 at 2:41 pm
I stumbled on almost the exact same solution. I didn’t think an empty url would leave the popup alone,though, so I used an empty javascript: url in stead. But then there’s the problem that led me here:
In my case, I don’t want to open the popup if it isn’t already there,
just send a command if it is.
The ‘open’ call will always return a window, possibly to an empty new
one. I suppose I could close it again immediately if the URL or
contents reveal a dummy, but it’s not very elegant; this operation
will occur quite frequently in my app.
So: is it possible to check for the pre-existence of a named window?
(without using timers in the popup, of course. The popup can be
cooperative i initialising, if that will help).
April 24th, 2007 at 2:31 am
This is just what I was looking for. It works great in Mac OS X with Safari, Firefox, Opera, Camino, iCab, Netscape and even old Firebird. With Explorer (5.23), surprisingly, the pop-up window never opens.
April 13th, 2007 at 2:57 pm
This works in IE 6 but it does not work in Firefox 2.0.0.3. I get the error
popupWin.doSomething is not a function
March 15th, 2007 at 5:32 pm
Nice one! I spent hours searching for some kind of getWindowByName() functionality, read tons of tutorials that all go obsolete as soon as the opener window is reloaded. Your solution is really very helpful!
January 17th, 2007 at 9:57 am
michi: It works here. Send me your example so I can have a look. My email is martin at this domain
January 17th, 2007 at 12:37 am
Hello,
nice solution, but I have problems with it. Copied js code exactly from this page, tried and it is not working ;( the popup opens, but doSomething function is not fired. in firefox I get following error: Error: popupWin.doSomething is not a function. but it looks on some strange problem, because when I tried it more times (only by refreshing the page and clicking on a button), it worked sometimes. do anyone has any solution?