I am developing an Ionic mobile app for IOS and using svg for a number of animations. The problem is the onClick event is not performing as well as the Ionic on-touch and on-tap events. That makes sense but I am just wondering, what is the best way to get a similarly responsive tap event on an svg element.
Here is a CodePen Example comparing svg element onClick vs Ionic tap/touch here, might be hard to notice the difference on desktop browser but the onClick is not as responsive for me on IOS e.g. iPad 2 iPad 3.
<button class="button button-light button-dark" on-touch="onTouch()">
touch
</button>
vs
<svg>
<rect x="10" y="10" height="500" width="500" onClick="svgClick()"/>
</svg>