Detect blocked popup in Chrome Detect blocked popup in Chrome google-chrome google-chrome

Detect blocked popup in Chrome


Well the "magical time" you speak of is probably when the popup's DOM has been loaded. Or else it might be when everything (images, outboard CSS, etc.) has been loaded. You could test this easily by adding a very large graphic to the popup (clear your cache first!). If you were using a Javascript Framework like jQuery (or something similar), you could use the ready() event (or something similar) to wait for the DOM to load before checking the window offset. The danger in this is that Safari detection works in a conflicting way: the popup's DOM will never be ready() in Safari because it'll give you a valid handle for the window you're trying to open -- whether it actually opens or not. (in fact, i believe your popup test code above won't work for safari.)

I think the best thing you can do is wrap your test in a setTimeout() and give the popup 3-5 seconds to complete loading before running the test. It's not perfect, but it should work at least 95% of the time.

Here's the code I use for cross-browser detection, without the Chrome part.

function _hasPopupBlocker(poppedWindow) {    var result = false;    try {        if (typeof poppedWindow == 'undefined') {            // Safari with popup blocker... leaves the popup window handle undefined            result = true;        }        else if (poppedWindow && poppedWindow.closed) {            // This happens if the user opens and closes the client window...            // Confusing because the handle is still available, but it's in a "closed" state.            // We're not saying that the window is not being blocked, we're just saying            // that the window has been closed before the test could be run.            result = false;        }        else if (poppedWindow && poppedWindow.test) {            // This is the actual test. The client window should be fine.            result = false;        }        else {            // Else we'll assume the window is not OK            result = true;        }    } catch (err) {        //if (console) {        //    console.warn("Could not access popup window", err);        //}    }    return result;}

What I do is run this test from the parent and wrap it in a setTimeout(), giving the child window 3-5 seconds to load. In the child window, you need to add a test function:

function test() {}

The popup blocker detector tests to see whether the "test" function exists as a member of the child window.

ADDED JUNE 15 2015:

I think the modern way to handle this would be to use window.postMessage() to have the child notify the parent that the window has been loaded. The approach is similar (child tells parent it's loaded), but the means of communication has improved. I was able to do this cross-domain from the child:

$(window).load(function() {  this.opener.postMessage({'loaded': true}, "*");  this.close();});

The parent listens for this message using:

$(window).on('message', function(event) {       alert(event.originalEvent.data.loaded)}); 

Hope this helps.


Just one improvement to InvisibleBacon's snipet (tested in IE9, Safari 5, Chrome 9 and FF 3.6):

var myPopup = window.open("popupcheck.htm", "", "directories=no,height=150,width=150,menubar=no,resizable=no,scrollbars=no,status=no,titlebar=no,top=0,location=no");if (!myPopup)    alert("failed for most browsers");else {    myPopup.onload = function() {        setTimeout(function() {            if (myPopup.screenX === 0) {                alert("failed for chrome");            } else {                // close the test window if popups are allowed.                myPopup.close();              }        }, 0);    };}


The following is a jQuery solution to popup blocker checking. It has been tested in FF (v11), Safari (v6), Chrome (v23.0.127.95) & IE (v7 & v9). Update the _displayError function to handle the error message as you see fit.

var popupBlockerChecker = {        check: function(popup_window){            var _scope = this;            if (popup_window) {                if(/chrome/.test(navigator.userAgent.toLowerCase())){                    setTimeout(function () {                        _scope._is_popup_blocked(_scope, popup_window);                     },200);                }else{                    popup_window.onload = function () {                        _scope._is_popup_blocked(_scope, popup_window);                    };                }            }else{                _scope._displayError();            }        },        _is_popup_blocked: function(scope, popup_window){            if ((popup_window.innerHeight > 0)==false){ scope._displayError(); }        },        _displayError: function(){            alert("Popup Blocker is enabled! Please add this site to your exception list.");        }    };

Usage:

var popup = window.open("http://www.google.ca", '_blank');popupBlockerChecker.check(popup);

Hope this helps! :)