Force keyboard events to stop propagating

[lawruble13]

May resolve #60, if that issue describes unintended behaviour.

[mwcraig]

Thanks for the PR and opening the issue.

The intent is definitely that keyboard events should be captured. When I tried your example in #60 with the current release and Chrome on a Mac, though, it looks like events are being captured. What browsers/ipyevents version are you using?

[lawruble13]

Hm, that is odd! I'm testing on Windows 10, build 1909, with Chrome 86.0.4240.183 and ipyevents 0.8.1/1.8.1. One thing I will note that I forgot to in the original issue is that this only occurs when the key is held, and the repeat events are firing.

I did also just test in Chrome on a Mac, and I didn't see the issue, so there might be something different in how MacOS and Windows handle repeating key events.

[mwcraig]

That is really useful to know -- I don't have a windows machine to test on at the moment. I don't see how this would do any harm on other platforms, nor do I see a case where throttling + letting the event propagate is desirable so it seems ok to merge. I don't understand why this isn't working: https://github.com/mwcraig/ipyevents/blob/master/src/events.ts#L268

Though, tbh, much about DOM events mystifies me.

[lawruble13]

Without having looked into the way Chrome handles events, or the underscore library too much, my guess is that the throttling prevents the code stopping event propagation from running, and if the browser/library queues the delayed handler asynchronously then the handlers which should be preempted run before the delayed handler, but there's a lot going on that's still a mystery to me too.

[mwcraig]

Can you please check whether throttling still works for you for wheel? On my mac the throttling example from https://github.com/mwcraig/ipyevents/blob/master/doc/Widget%20DOM%20Events.ipynb doesn't work. Th code from that notebook cell is

no_rate_box = Label("No rate limit (all scroll events passed)", layout={'border': '2px solid red', 'width': '100%'}) 
throttle_box = Label("Throttle (no more than 0.5 event per sec)", layout=no_rate_box.layout)
debounce_box = Label("Debounce (wait 0.5 sec between scrolls)", layout=no_rate_box.layout)

event_no_rate = Event(source=no_rate_box, watched_events=['wheel'])

# If you omit throttle_or_debounce it defaults to throttle
event_throttle = Event(source=throttle_box, watched_events=['wheel'], wait=500)

event_debounce = Event(source=debounce_box, watched_events=['wheel'], wait=500, throttle_or_debounce='debounce')

wheel_info = HTML("Waiting for a scroll...")

def update_display(event):
    lines = [
        'timeStamp: {}'.format(event['timeStamp']),
        'deltaY: {}'.format(event['deltaY'])
    ]
    content = '<br>'.join(lines)
    wheel_info.value = content

event_no_rate.on_dom_event(update_display)
event_throttle.on_dom_event(update_display)
event_debounce.on_dom_event(update_display)

instructions = HTML("Mouse over each box then scroll to see response")

VBox([instructions, HBox([no_rate_box, throttle_box, debounce_box], layout={'width': '100%'}), wheel_info])

[lawruble13]

On Windows, it does appear to still work for me, in what manner is it not working? (I can test it again on Mac, but that machine's a bit inconvenient for me)

[mwcraig]

It isn't throttling for me. I'll dig into the websocket traffic today and see if I can track down why.