Greasemonkey popup loop not waiting for load-event listener

Question

I'm writing a Greasemonkey script to automatically delete my notifications from a site, based on words I enter into a search box.

The delete "button" is basically a link, so I'm trying to open the first link in a new tab. Then, after it loads enough, open the rest of the links, one by one, in that same tab.

I figured out how to get the links I needed and how to loop and manipulate them. I was able to grab the first delete-link and open it in a new tab. I added an event listener to make sure the page was loaded before going to the next link.
I finally made that work so added my search box and button. Then I had to figure out how to wrap the whole thing in the event listener again.

So, I now have the whole thing working, except only the last link loads.
All links are going to my waitFor function so they should open, so it seems the event listener isn't working so it goes through the loop too fast and only the last link loads.

How do I make this script not continue the loop until the previous loaded page is fully loaded?

Complete code except for box and button creation:

var mytable = document.getElementById ('content').getElementsByTagName ('table')[0]
var myrows = mytable.rows

//function openLinkInTab () {
//mywin2.close ();
//}

var mywin2;
mywin2 = window.open ("http://www.aywas.com/message/notices/test/", "my_win2");
var links;

var waitFor = function (i) {
    links = myrows[i].cells[1].getElementsByTagName ("a");
    mywin2 = window.open (links[0].href, "my_win2");
}

var delnotifs = function () {
    var matching;
    var toRemove;
    toRemove = document.getElementById ('find').value;
    alert (toRemove)
    for (i = 0; i < 10; i++) {

        matching = myrows[i].cells[0].innerHTML;

        if (matching.indexOf (toRemove) > 0) {
            mywin2.addEventListener ('load', waitFor (i), false);
        }
    }
}

searchButton.addEventListener ('click', delnotifs, true);

So, why isn't it waiting for `mywin2.addEventListener('load', waitFor(i), false);`? I have a feeling it's something extremely simple that I'm missing here, but I just can't see it.

I also tried mywin2.addEventListener('load', function(){waitFor(i)}, false); and it still does the same thing, so it's not a problem of being a call instead of a pointer.

Swapping mywin2.addEventListener('load', waitFor(i), false); for if (mywin2.document.readyState === "complete") { waitFor(i)} doesn't work either.

And while I'm at it... every time I see code looping through a list like this it uses

for(i=1;i < myrows.length;i++)

Which was skipping the first link in the list since arrays start at zero. So my question is, if I switch 'i' to zero, and the loop only goes while 'i' is < length, doesn't that mean it won't go through the whole list? Shouldn't it be

for(i=0;i != myrows.length;i++)  

Answer 1

When you open a popup (or tab) with window.open, the load event only fires once -- even if you "open" a new URL with the same window handle.

To get the load listener to fire every time, you must close the window after each URL, and open a new one for the next URL.

Because popups are asynchronous and you want to load these links sequentially, don't use a for() loop for that. Use the popup load status to "chain" the links.

Here is the code to do that. It pushes the links onto an array, and then uses the load event to grab and open the next link. You can see the code in action at jsFiddle. :

var searchButton    = document.getElementById ('gmPopUpBtn');
var mytable         = document.getElementById ('content').getElementsByTagName ('table')[0];
var myrows          = mytable.rows;
var linksToOpen     = [];
var mywin2          = null;

function delnotifs () {
    var toRemove    = document.getElementById ('find').value;

    for (var J = 0, L = myrows.length;  J < L;  J++) {
        var matching = myrows[J].cells[0].innerHTML;

        if (matching.indexOf (toRemove) > 0) {
            var links = myrows[J].cells[1].getElementsByTagName ("a");
            linksToOpen.push (links[0].href); //-- Add URL to list
        }
    }
    openLinksInSequence ();
};

function openLinksInSequence () {
    if (mywin2) {
        mywin2.close ();
        mywin2      = null;
    }

    if (linksToOpen.length) {
        var link    = linksToOpen.shift ();
        mywin2      = window.open (link, "my_win2");

        mywin2.addEventListener ('load', openLinksInSequence, false);
    }
}
searchButton.addEventListener ('click', delnotifs, true);

Answer 2

See https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener. The second argument of the addEventLister function must be a pointer to a function and not a call.