When clicking an element within a shadow DOM, use it as the target instead of the shadow root

[multikoop]

Description:

This code change enhances the AllElementsClickedTrigger to fire event on the actual clicked target when inside an (open) shadow dom.
Fixes: #543

Review

• Functional review done
• Potential edge cases thought about (behavior of the code with strange input, with strange internal state or possible interactions with other Matomo subsystems)
• Usability review done (is anything maybe unclear or think about anything that would cause people to reach out to support)
• Security review done
• Wording review done
• Code review done
• Tests were added if useful/possible
• Reviewed for breaking changes
• Developer changelog updated if needed
• Documentation added if needed
• Existing documentation updated if needed

[MatomoForumNotifications]

This pull request has been mentioned on Matomo forums. There might be relevant details there:

https://forum.matomo.org/t/event-tracking-inside-webcomponents-shadowdom/47205/2

[snake14]

Successfully tested this change and it looks good to me. Any concerns @AltamashShaikh ?

[AltamashShaikh]

@snake14 Changes look good, but we need to add this in other click triggers too AllDownloadsClickTrigger.web.js, AllLinksClickTrigger.web.js,

[justinvelluppillai]

Is it going to work in older browsers?

[snake14]

@justinvelluppillai That's a good point. According to Can I use, it's supported by pretty much all newer browsers. So, it doesn't look like it would work for IE or some older browsers. Is that a deal breaker?

[justinvelluppillai]

This line of code would just need to not run and not break or error for older browsers, so just making sure it's adequately handling that is the key.

[snake14]

@justinvelluppillai I would expect target.shadowRoot to evaluate as undefined for older browsers. So, I think it would be alright.

[multikoop]

Thanks for the discussions. Yes I also was thinking of an enhancement for other relevant triggers (like mentioned by @AltamashShaikh ) Since the AllDownloadsClickTrigger the clickCallBack has advanced implementation I do not feel experienced enough with the needed code change. Maybe someone else.... :-)

[multikoop]

As mentioned by @AltamashShaikh I have added the code change (to deal with the target element inside shadow dom) to AllDownloadsClickTrigger.web.js and AllLinksClickTrigger.web.js. so that the change is consistent in available All*ClickTriggers

[multikoop]

Hhhm, any idea why 1 build job failed?

[snake14]

@multikoop Yep. It looks like there was a random server error during one of the specific builds. I restarted it and it ran successfully this time. It's all good now.

[AltamashShaikh]

@multikoop Left 1 minor comment to make code more readable

[AltamashShaikh]

@multikoop Thank you for your contribution, your changes should go live with release of Matomo 4.12

[multikoop]

Thanks for the discussion and accepting the contribution. Looking forward to the release 🤩