Javascript 'alert' function inside catch block only works when dev tools are opened in chrome

Question

Hello StackOverflow community!

I've encountered a very weird problem and couldn't find any useful information on how to solve it.

Somehow, a piece of javascript code works only when the dev tools window is opened (docked or as a separate window) in google chrome.

The original problem : Due to our application structure, we need to open multiple popups automatically when a page is served. Since the popups are NOT opened through a direct user interaction (like onclick), modern browsers would automatically block these popups. Because of the large amount of code that would need to be refactored to avoid this, our solution was:

• check if the browser is blocking some popups.
• if so: inform the user about this and suggest to turn off their browser's popup blocking function for our website (by adding it to the exception list for example).

Not a very elegant solution I know, but there was no other way so please don't comment on how to do this differently.

The javascript code:

let popupBlockingErrorShown = false;

this.OpenWindow = function (url, name, args) {

        var i = Popups.length; //Popups is an array defined as a global variable that keeps track of all 
                               //opened popup windows

        Popups[i] = window.open(url, name, args);

        try {

            Popups[i].focus();

        } catch (e) {

            if (!popupBlockingErrorShown) {

                alert("very user friendly message explaining to turn of popup blocking");

                popupBlockingErrorShown = true;
            }


        };
    }

The windows have to be popups. The popupBlockingErrorShown variable is to prevent having an alert message for each popup.

Works fine in firefox. But in google chrome there is this behaviour:

• without dev tools open : the first popup opens normally, the others are blocked, there is no alert message .

• with dev tools open : the first popup opens but gets 'stuck' on loading (it's an empty page). The alert message shows normally.

Keeping the browser-window open and simply switching between dev tools opened or closed gives the same behaviour.

Anyone can help me? Much appreciated!

This is my first stackoverflow question and I'm still very new to programming, I have a bit over a year of experience. Remarks on my 'asking questions'-skills are welcome.

Answer 1

Ok thanks to wOxxOm's comment I've found a workaround. So the problem was related to what window was focused on. I've added a piece of code in the catch-block to show an alert on a successfully opened popup (if there is one) :

   try {

           Popups[i].focus();

        } catch (e) {

            if (!popupBlockingErrorShown) {
                if (Popups[i - 1]) { //there is a previous popup and it's been focused on.
                    Popups[i - 1].alert(UIMessages[33]); //show alert on opened popup.
                    popupBlockingErrorShown = true;
                }
                else {
                    alert(UIMessages[33]);
                    popupBlockingErrorShown = true;
                }
            }
        }

Thanks @wOxxOm !