[Bug]: (Mobile) Tapping on sp-menu-item in sp-menu will also tap on element underneath

[RuxG]

Code of conduct

• I agree to follow this project's code of conduct.

Impacted component(s)

sp-menu, sp-menu-item

Expected behavior

On mobile, while having the following rendering logic:

1. An sp-menu that is rendered conditionally
2. An sp-checkbox that is rendered conditionally, in the place of the sp-menu, after an sp-menu-item is tapped

By tapping on the sp-menu-item, the tap event should not propagate to the checkbox underneath.

Actual behavior

By tapping on the sp-menu-item, the tap event is propagated to the checkbox underneath, and it becomes checked right after being rendered.

Screenshots

No response

What browsers are you seeing the problem in?

Chrome, Safari

How can we reproduce this issue?

MenuTapEvent.mov

You can reproduce the issue on: https://studio.webcomponents.dev/edit/2oibVYTXHpdxV0KB302m/src/index.ts?p=stories

Sample code or abstract reproduction which illustrates the problem

No response

Severity

SEV2

Logs taken while reproducing problem

No response

[najikahalsema]

I marked this bug as SEV2.

SWC-693