SnapSVG animation callback on set of elements not firing

Question

See JSfiddle!

I am wanting to animate a set of elements and execute a callback when finished like so:

s.selectAll('.active').animate( {
        transform: matrix 
    },
    300,
    mina.linear,
    function() {
       //callback doesnt fire
       alert('callback')
    }
)

The elements are animated correctly but the callback isnt executed.

However, when I apply the animation to a group of elements, the callback is fired:

group.animate( {
        transform: matrix 
    },
    300,
    mina.linear,
    function() {
       alert('callback')
    }
)

.. But I don't want to put my selected elements in a group as this would cause more complications in other places.

Is it possible to animate a set of elements that I got via a .select() or .selectAll() while being able to fire the callback?

Thanks a lot in advance!

Edit: For future readers, you can animate a set of elements by using forEach and counting if all elements are done animating:

function hideToPoint(elements, x, y, callback) {
    var finished = 0;
    elements.forEach(function(e) {

        e.animate( {
                //do stuff
            },
            300,
            mina.linear,
            function () {
                finished++;
                if (finished == elements.length) {
                    callback();
                }
            }
        )
    })
}

Answer 1

I'm going to have a stab at answering a couple of problems, even though I'm not sure if related to the callback. Its hard to tell if its just the example code or not without a proper test like a jsfiddle.

However, there are at least 2 problems in the code above.

Creating a matrix is with

new Snap.Matrix();   // as opposed to Snap.matrix()

Also

elements.animate()

The problem here is that animate acts on one element (edit: looks like it can work on elements within a set, but not the callback as example here, edit2: callbacks on sets may now be supported), not multiple elements as such (you can sometimes apply somethings to a set which deals with them individually, but as far as I'm aware, thats not the case with animate).

So you either want to do a

elements.forEach( function(el) { el.animate({blah: value}, 2000, mina.linear.callback ) 
});

or if its an svg group (as opposed to a set), the original code would possibly work (but I would call it 'myGroup' or something instead of 'elements' for code readability and guessing what it contains)

fiddle (have included a different animation using snap animation string)