NullPointerException android.widget.ScrollView in onTouchEvent

[gurbela]

NullPointerException android.widget.ScrollView in onTouchEvent

[gurbela]

It will be great if you provide a repro using this template: https://github.com/react-native-community/reproducer-react-native

I have simple scrolling, I use ScrollView, I started scrolling up and down and then the application on Android is crashed,
I using React Native 75.2 version, New architect of react native enabled.

[cipolleschi]

@gurbela please create a reproducer using this template. We cannot look into issue if they are not created with it.

Also, it is unclear if this is related to The New Architecture or not. We have a template to collect New Architecture issues that should be used if that's the case.

[react-native-bot]

⚠️	Missing Reproducible Example
ℹ️	We could not detect a reproducible example in your issue report. Please provide either: If your bug is UI related: a Snack If your bug is build/update related: use our Reproducer Template. A reproducer needs to be in a GitHub repository under your username.

[react-native-bot]

⚠️	Missing Reproducible Example
ℹ️	We could not detect a reproducible example in your issue report. Please provide either: If your bug is UI related: a Snack If your bug is build/update related: use our Reproducer Template

[shubhamguptadream11]

It will be great if you provide a repro using this template: https://github.com/react-native-community/reproducer-react-native

[shubhamguptadream11]

@gurbela Not able to repro it on latest version. I am using a scrollView with lots of items.
Can you share your App.tsx file?

[gurbela]

@gurbela Not able to repro it on latest version. I am using a scrollView with lots of items. Can you share your App.tsx file?

import 'react-native-gesture-handler';
import React, { useEffect, useLayoutEffect, } from 'react';
import { Provider } from 'react-redux';
import { PersistGate } from 'redux-persist/lib/integration/react';
import { store, persistor } from 'store';
import { Navigation } from 'navigation';

import { closeToast, openToast, saveToastRef } from 'utils/toast';
import { SafeAreaProvider } from 'react-native-safe-area-context';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
import { ErrorBoundary, Modal, ModalSheet, Toast } from 'components';
import { saveModalRef } from 'utils/modal';

import { LogBox, Platform, StatusBar } from 'react-native';
import { Colors } from 'theme/Variables';
import BootSplash from 'react-native-bootsplash';

import { useIsConnectionAlive } from 'hooks';
import { ApplicationErrorWrapper } from 'components';
import { useGlobalStyles } from 'theme/Global.styles';
import { modalSheetRef } from 'utils/modalSheet';
import { initSentry } from 'utils/sentry';
import { i18nInitializationPromise } from './translations';

LogBox.ignoreAllLogs();

const App = () => {
  const globalStyles = useGlobalStyles();

  useEffect(() => {
    const initializeApp = async () => {
      try {
        await i18nInitializationPromise;
      } catch (error) {
        console.warn('Failed to initialize i18n:', error);
      } finally {
        await BootSplash.hide({ fade: true });
      }
    };

    initializeApp();

    initSentry();

    return () => {
      closeToast();
    };
  }, []);

  //  We set statusbar custom color - only for android on the root level
  //   For IOS, we need to tweak the statusbar, so CustomStatusbar Component was created
  useLayoutEffect(() => {
    StatusBar.setBarStyle('dark-content');
    if (Platform.OS === 'android') {
      StatusBar.setBackgroundColor(Colors.dashboardBackground);
    }
  }, []);

  const { isConnectionAlive } = useIsConnectionAlive();

  useEffect(() => {
    if (!isConnectionAlive) {
      openToast('error.network_error', 'error');
    }

    return () => {
      closeToast();
    };
  }, [isConnectionAlive]);

  return (
    <ErrorBoundary>
      <GestureHandlerRootView style={globalStyles.fill}>
        <SafeAreaProvider>
          <Provider store={store}>
            <PersistGate loading={null} persistor={persistor}>
              <ApplicationErrorWrapper>
                <Navigation />
                <Modal ref={saveModalRef} />
                <ModalSheet ref={modalSheetRef} />
                <Toast ref={saveToastRef} />
              </ApplicationErrorWrapper>
            </PersistGate>
          </Provider>
        </SafeAreaProvider>
      </GestureHandlerRootView>
    </ErrorBoundary>
  );
};

export default App;

[shubhamguptadream11]

@gurbela Can you narrow down the issue to bare react native project?

[gurbela]

@gurbela Can you narrow down the issue to bare react native project?

  const scrollHandler = useAnimatedScrollHandler({
    onScroll: event => {
      const y = event.contentOffset.y;
      translateY.value = y > 0 ? y : 0;
      scroll.value = y;
      shouldClose.value = y > 0;
    },
  });

<Animated.FlatList
        nestedScrollEnabled
        data={['']}
        ref={sectionListRef}
        refreshControl={<RefreshControl refreshing={refreshing} onRefresh={handleRefresh} />}
        onScroll={scrollHandler}
        contentContainerStyle={styles.sectionListContent}
        showsVerticalScrollIndicator={false}
        renderItem={renderLists}
        maxToRenderPerBatch={1}
        removeClippedSubviews={true}
      />

I'm using scrollHandler, and it causes this error (a crash)