I have a svelte component in a shadow dom structure. It’s a part of a group of radio buttons, and when a user clicks on a radio button, it triggers a callback function that takes the event as an argument and saves the value to a store.

When I’m executing code on the browser, this works without issue– the values match up perfectly! However, when I try to tackle this in a unit test, the event’s target.value property is undefined. The click event still triggers as expected, and it has information such as target.tagName that one would expect– just no value. I’m awaiting my click functions as well as awaiting responses when I run my actual tests– I’m observing that the event is undefined by inserting breakpoints into the actual file as I go.

I suspect that this issue has something to do with event propagation through the shadow dom to the light dom, but I’ve been unable to determine the root cause or how to fix this.

I’m using testing-library/svelte and the shadow-dom-testing-library for my unit tests. The component in question is an auro-radio-group: https://auro.alaskaair.com/components/auro/radio#gsc.tab=0