0

I'm porting my Chrome extension into Safari, and I've encountered a little issue I would like to ask about.

Does anyone have an idea why the following code doesn't work in Safari, but does in Chrome?

shadow.addEventListener('click',function(e){
console.log(e);
if(e.target && e.path[0].id == "share"){
alert("clicked");
}
});

This gives me the following error in Safari: TypeError: undefined is not an object (evaluating 'e.path[0]') and the console.log doesn't give me anything useful either.

I prefer this way instead of adding a seperate click event listener for each element, but unfortunately it doesn't seem to work in Safari, or should I change something to make it work in Safari?

I should mention that I have added the event listener to the shadow dom.

Anders
  • 513
  • 2
  • 10
  • 32
  • It looks like Safari and Firefox don't have a path attribute on MouseEvent: https://stackoverflow.com/questions/36845515/mouseevent-path-equivalent-in-firefox-safari Maybe instead you can try accessing that element a different way (for example css selectors). Or you can do the polyfill that is in the answer to the question above. – mweiss Nov 26 '17 at 12:14
  • Thanks for your comment, I'll look into that, otherwise I will just have to add queryselectors or event listener on each element seperately. – Anders Nov 26 '17 at 12:19
  • @mweiss I'm struggling to find a way to handle click on dynamically added elements, didn't really find the code in the topic u linked helpful, do you have anything else? – Anders Nov 26 '17 at 15:56
  • What about using e.target to determine which child element was clicked? Here's an example in the mozilla docs https://developer.mozilla.org/en-US/docs/Web/API/Event/target#Example – mweiss Nov 26 '17 at 20:07
  • Tried that, it only gets the parent, not the actual child clicked.. Have also tried with event.stopPropagation, didn't work either – Anders Nov 26 '17 at 20:09
  • Hmmm... do you have a full code sample? Maybe I'm misunderstanding your problem. I set up a small code pen to demonstrate what I meant: https://codepen.io/anon/pen/zPLavj – mweiss Nov 26 '17 at 20:20
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/159857/discussion-between-mweiss-and-anders). – mweiss Nov 26 '17 at 20:21

0 Answers0