javascriptmousetrap

Mousetrap firing twice

This is my code:

Mousetrap.bind('l', (e) => {
  console.log('l')
})

Mousetrap.bind('k+l', (e) => {
  console.log('k+l')
})

I have 2 questions:

1. When I press l I'm seeing both logs. Any ideas why?

2. When I'm pressing k + l, I'm seeing both logs too (I understand why) but any ideas how to prevent this?

Thanks

Solution

  • That's because k is not a valid modifier key.

    As described in the docs:

    For modifier keys you can use shift, ctrl, alt, or meta.

    In other words, k+l is normalized to l, i.e. you are binding l twice.

    For more details, you can check out the relevant bit of logic in the mousetrap source directly.