callstack / callstack/react-native-pager-view

onPageSelected and onScroll gives wrong position when animation wasn't completed on previous page on iPhone 12

Open
#503 6 comments 3 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
3.4k
Forks
476
Avg merge
10d 21h
Merged PRs (30d)
2

Description

## Environment
```
"react-native": "0.63.4",
"react": "16.14.0",
"react-native-pager-view": "^5.4.9"
```

iOS 15.2

## Description
onPageSelected and onScroll handlers giving wrong index on iPhone 12 simulator (as well as on real device too), but works on iPhone 11 (and older devices) correct. See video below (demonstrates apps on iPhone 11 and iPhone 12)

## Reproducible Demo

```

{children}

```

```
const onPageSelected = useCallback(
(e) => {
const pageIdx = e.nativeEvent.position;
console.log(pageIdx, 'PAGE IDX')
setActivePage(pageIdx);
onItemActive(pageIdx);
},
[onItemActive],
);
```

Video 1 (correct behaviour, iPhone 11 iOS 15.2, after animation is not finished onPageSelected provides correct page after gesture completed)
https://user-images.githubusercontent.com/9297785/149826584-b309417c-252e-4c55-b2c5-302dc1bb90f2.mp4

Video 2 (incorrect behaviour, iPhone 12 iOS 15.2, after animation is not finished onPageSelected provides previous page number after gesture completed)
https://user-images.githubusercontent.com/9297785/149826806-cbab3e2d-93f5-4ebf-a919-8e4b8d75f471.mp4

Contributor guide

Open the contributing guide

Research direction

Start with the PagerView usage and the onPageSelected/onScroll handlers shown in the issue, then reproduce the interrupted vertical swipe on an iPhone 12 running iOS 15.2 and compare it with an iPhone 11. Done means the event reports the completed destination page rather than the previous page after an unfinished animation.

Written by the indexing model from the issue text.

Assessment

Tech stack
ios, react, 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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.