.throttle modifier does not properly stopPropagation or preventDefault when using .stop or .prevent

[hudon]

See a more concrete example here: #3277 (comment)

Basically, if you use modifiers like so: dragover.stop.prevent.throttle, the throttling mechanism is such that for the throttled calls, the event will propagate (and not prevent default).

The problematic logic is the combination of the on() function and throttle() function.

on() does this to wrap the handler with a handler that tries to stop/prevent:

    if (modifiers.includes('prevent')) handler = wrapHandler(handler, (next, e) => { e.preventDefault(); next(e) })
    if (modifiers.includes('stop')) handler = wrapHandler(handler, (next, e) => { e.stopPropagation(); next(e) })

And then throttle does this:

function throttle(func, limit) {
    let inThrottle
    return function() {
        let context = this, args = arguments
        if (! inThrottle) {
            func.apply(context, args)
            inThrottle = true
            setTimeout(() => inThrottle = false, limit)
        }
    }
}

So when the call is throttled (ie. inThrottle is true), stopPropagation is not called, and the event bubbles. Furthermore, preventDefault is not called, so the default is not prevent.

somewhat related discussions:

• `.prevent` doesn't work when event scope is `.window` #3277
• x-on keydown with window and throttle modifiers doesn't work #3376

[hudon]

proposed solution: #3479