State Updates Not Reflected in PIP Mode with New Architecture enabled

Description

I’ve encountered an issue with state updates not reflecting in Picture-in-Picture (PIP) mode starting from React Native 0.76, which I believe is related to the new architecture (Fabric) being enabled by default.

To demonstrate the issue, I created a simple counter using the react-native-background-timer library.

The code is a simplified example created solely to replicate the issue. In my actual use case, I am not using react-native-background-timer. Instead, I perform state updates, such as resizing the video player when switching to Picture-in-Picture (PIP) mode. However, these state updates stop working once the app enters PIP mode, and this behavior only occurs in React Native 0.76 and above.

Steps to reproduce

import BackgroundTimer from 'react-native-background-timer';
import React, { useState, useEffect } from 'react';
import { View, Text, StyleSheet } from 'react-native';

const App = () => {
  const [count, setCount] = useState(0);

  useEffect(() => {
    const intervalId = BackgroundTimer.setInterval(() => {
      setCount(prevCount => prevCount + 1);
    }, 1000);

    return () => BackgroundTimer.clearInterval(intervalId);
  }, []);

  return (
    <View style={styles.container}>
      <Text style={styles.counter}>{count}</Text>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  counter: {
    fontSize: 48,
    fontWeight: 'bold',
  },
});

export default App;

This example works perfectly fine in React Native 0.75 and below. However, in version 0.76 and above (with the new architecture enabled), the state does not update once the app goes into PIP mode.

React Native Version

0.76.0 onwards or when newArch in enabled

Affected Platforms

Runtime - Android

Areas

Fabric - The New Renderer

Output of npx @react-native-community/cli info

-

Stacktrace or Logs

-

Reproducer

Screenshots and Videos

Video Links

You can access the following videos:

1. Video 1 - Test 75
2. Video 2 - Test 76

Beginne mit dem bereitgestellten Android-Zählerbeispiel und vergleiche sein Verhalten unter React Native 0.75 mit dem unter React Native 0.76+ bei aktivierter New Architecture. Untersuche den im Bericht genannten Fabric/PIP-Pfad und verwende die verlinkten Testvideos als Referenz. Als abgeschlossen gilt die Aufgabe, wenn Zustandsaktualisierungen weiterhin angezeigt werden, während sich die App im PIP-Modus befindet, ohne auf react-native-background-timer angewiesen zu sein.