hotkeys-js icon indicating copy to clipboard operation
hotkeys-js copied to clipboard

Allow default filter to work within ShadowDOM boundaries

Open diervo opened this issue 2 years ago • 1 comments

I modified the filter function to work within Shadow boundaries.

Would the maintainer's team be interested in adding this? Happy to do a PR to port it over.

diervo avatar Sep 21 '22 00:09 diervo

I also encountered this and would appreciate it as part of library so that hotkeys "just works" for web components. For now, I was able to override the default filter by replacing event.target.tagName with event.composedPath()[0].tagName, a la:

hotkeys.filter = (event) => {
  const target = event.target || event.srcElement;
  const tagName = event.composedPath()[0].tagName // this is the change from default filter
  let flag = true;
  if (
    target.isContentEditable
    || ((tagName === 'INPUT' || tagName === 'TEXTAREA' || tagName === 'SELECT') && !target.readOnly)
  ) {
    flag = false;
  }
  return flag;
}

composedPath docs

Thanks for the great library, @jaywcjlove

sllvn avatar Sep 24 '22 01:09 sllvn