Jquery event handler "keydown" is called two times

SDKs
1

Hi! I’ve noticed some problem when I add (document).on('keydown', ...) after dom load. The callback is fired two times. (i watched call stack, first time without sentryWrapped, second time with sentryWrapped). You can try to paste this and look: (() => {
$(document).on(‘keydown’, () => {
console.log(123);
});
});

By the way, if I delete “on dom load”, i.e.

$(document).on(‘keydown’, () => {
console.log(123);
});

that problem disappears. Any ideas ? Thanks.

P.S. if I change on dom load to setTimeout, the problem doesn’t disappear.
P.S. 2 When I added sentry init after dom load, that problem disappears. (but i think it is not a good solution)

2

Just got the same behavior with a MouseEvent and a standard addEventListener (so it’s not related to jQuery).

At the end of my page I call:

[].slice.call(document.querySelectorAll('.open-form-modal')).forEach(elem => {
    elem.addEventListener('click', openFormModal);
});

And if/whenever the DOM changes, I call it again. That’s when the problem appears. I rely on a standard behavior of JS which is that you can call addEventListener more than once and it discards previous listeners if the event and the named function are the same.

But I think the first time the addEventListener is called, Sentry isn’t loaded yet so the function is not wrapped. And the next few times (can be a long time after the page has loaded), Sentry wraps the function, whatever that means. And then on a click it’s executed twice. Never more. The unwrapped and the wrapped one.

Edit: I know this is an old topic but it was basically the only instance of that issue I found so I told myself “let’s group them”.

3

Solved by removing data-lazy="no" in Sentry script tag. I guess launching Sentry after all the js has been launched but before any error has happened doesn’t make a lot of sense? I suppose the bug will reappear after the first error encountered on the page though. Good enough.