software-mansion / software-mansion/react-native-svg
iOS: onPress is not working on the SVG Path
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 8k
- Forks
- 1.2k
- Avg merge
- 10d 9h
- Merged PRs (30d)
- 2
Description
Bug
I've created the following sample.

This is an arc which is rendered as per my expectations. When I press anywhere on the arc, on Android, onPress is always called properly but on iOS, sometimes onPress is called but sometimes it doesn't. Some part of the arc is not clickable on iOS.
Also, there isn't any positioning element(absolute/relative positioned) overlapping the arc.
Environment info
react-native: 0.61.5
react-native-svg: 9.13.3
Reproducible sample code
I'm using Path to show an elliptical arc as follows.
<Svg
height={deviceHeight - 200}
width={deviceWidth}
>
<Path
ref={ref => this.pathRef = ref}
fill="none"
stroke='rgba(214,51,51,.2)'
strokeWidth={35}
onPress={() => console.log('path on pressed called!')}
d="M 392.72727272727275 124.90909090909088 A 360 450 0 0 0 42.72727272727275 574.9090909090909"
/>
</Svg>
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the provided React Native sample and the Path element's onPress behavior on iOS, comparing it with Android using the stated react-native 0.61.5 and react-native-svg 9.13.3 versions. Done means every press on the rendered arc consistently triggers onPress on iOS, including the areas that currently fail.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100