addListener firing too many times with blank text on Android 12 (API level 31)

[paulocf92]

Environment

System: OS: Linux 5.15 Ubuntu 22.04.1 LTS 22.04.1 LTS (Jammy Jellyfish) CPU: (4) x64 Intel(R) Core(TM) i5-4440 CPU @ 3.10GHz Memory: 3.31 GB / 15.53 GB Shell: 5.1.16 - /bin/bash Binaries: Node: 16.14.0 - ~/.nvm/versions/node/v16.14.0/bin/node Yarn: 1.22.19 - ~/.yarn/bin/yarn npm: 8.3.1 - ~/.nvm/versions/node/v16.14.0/bin/npm Watchman: Not Found SDKs: Android SDK: Not Found IDEs: Android Studio: AI-203.7717.56.2031.7935034 Languages: Java: 1.8.0_352 - /usr/bin/javac npmPackages: @react-native-community/cli: Not Found react: 18.1.0 => 18.1.0 react-native: 0.70.4 => 0.70.4

Platforms

Android (API level 31)

Versions

• Android: 12
• iOS: --
• react-native-netinfo: 9.3.6
• react-native: 0.70.4
• react: 18.1.0

Description

I'm launching a Galaxy S21 Emulator (API level 31). When I get to this screen, there's an useEffect to handle copying text from clipboard via a listener. Thing is the app keeps triggering this "paste" function every time despite the text being empty ("") and it throws endless warnings; it's as if the "copy from clipboard" via listener is going nuts. It only happens on the API level 31 emulator. The goal is to allow the person to go to the SMS messages app, copy a text from a message, and automatically fill the expected field.

Reproducible Demo

You can add this useEffect.

useEffect(() => {
    const fetchCopiedText = async () => {
      const text = await Clipboard.getString();
      const formattedText = /(\d{4})/g.exec(text);

      if (formattedText && formattedText.length > 0) {
        setPin(formattedText[0]);
      }
    };

    const appState = AppState.addEventListener('change', fetchCopiedText);

    const clipListener = Clipboard.addListener(() => fetchCopiedText());

    return () => {
      appState.remove();
      clipListener.remove();
      Clipboard.setString('');
    };
  }, []);