Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Allow intercepting events from within shadow DOM. #17

Merged
merged 2 commits into from
Sep 2, 2023

Conversation

aearly
Copy link

@aearly aearly commented Sep 1, 2023

Fixes #14.

  • Adds an example of a link within a shadow DOM that is not intercepted in browsers without the native Navigation API.
  • The polyfill now looks up ev.composedPath()[0] rather than ev.target to find links. ev.target will only be the containing web component -- it doesn't cross shadow DOM boundaries.

Checklist

@aearly aearly changed the title Add example with shadow DOM links Allow intercepting events from within shadow DOM. Sep 1, 2023
@fabiancook
Copy link
Contributor

Thanks! Makes sense and looks good.

Ran into this in tests... it might be though because of events being created outside of the DOM... so they don't have the full DOM API available

process unhandled rejection TypeError: ev.composedPath is not a function

I'll do a commit for this right now, would be good to change too:

export interface EventPrototype {
    target: ElementPrototype;
    composedPath?(): ElementPrototype[];
    defaultPrevented: unknown;
    submitter: Record<string, unknown>;
}

And use, assuming too that it could be possible to get no values returned as well (maybe if its a CustomEvent, has composedPath but isn't populated somehow?):

function getComposedPathTarget(event: EventPrototype) {
  if (!event.composedPath) {
    return event.target;
  }
  const targets = event.composedPath();
  return targets[0] ?? event.target; 
}

fabiancook added a commit that referenced this pull request Sep 2, 2023
@fabiancook fabiancook merged commit 390ab7d into virtualstate:main Sep 2, 2023
4 of 5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

interceptEvents doesnt catch shadowDom links events
2 participants