Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Removing last page when it's active causes a crash in iOS on RN 0.64

See original GitHub issue

Environment

react-native: 0.63.4
react-native-pager-view: 5.4.7

Description

If we remove the last child of the PagerView, when it’s active, iOS crashes with:

Exception thrown while executing UI block: *** -[__NSArrayM objectAtIndexedSubscript:]: index 4 beyond bounds [0 .. 3]

__44-[RCTUIManager flushUIBlocksWithCompletion:]_block_invoke
    RCTUIManager.m:1199
__44-[RCTUIManager flushUIBlocksWithCompletion:]_block_invoke.496
__RCTExecuteOnMainQueue_block_invoke
_dispatch_call_block_and_release
_dispatch_client_callout
_dispatch_main_queue_callback_4CF
__CFRUNLOOP_IS_SERVICING_THE_MAIN_DISPATCH_QUEUE__
__CFRunLoopRun
CFRunLoopRunSpecific
GSEventRunModal
-[UIApplication _run]
UIApplicationMain
main
start

Reproducible Demo

This is a minimal case that we can verify this crash happening. A simple app to navigate to the 5th (last) page and press the text to remove it. iOS should crash.

import React, {useState} from 'react';
import {Text, View} from 'react-native';
import PagerView from 'react-native-pager-view';

const App = () => {
  const [pages, setPages] = useState(5);

  return (
    <PagerView style={{flex: 1}} initialPage={0}>
      {new Array(pages).fill().map((_, i) => (
        <View
          key={i}
          style={{width: '100%', height: '100%', justifyContent: 'center', alignItems: 'center'}}>
          {i !== pages - 1 ? (
            <Text>Please navigate to next page -></Text>
          ) : (
            <Text
              onPress={() => {
                setPages(pages - 1);
              }}>
              Press me to remove this page
            </Text>
          )}
        </View>
      ))}
    </PagerView>
  );
};