State Updates Not Reflected in PIP Mode with New Architecture enabled
Chưa có ai nhận issue này.
- Ngôn ngữ chính
- C++
- Star
- 127k
- Fork
- 25.3k
- Merge trung bình
- 1 ngày 23 giờ
- Pull request đã merge (30 ngày)
- 4
Mô tả
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:
Hướng dẫn đóng góp
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Hướng nghiên cứu
Bắt đầu với ví dụ bộ đếm Android được cung cấp và so sánh hành vi của nó trên React Native 0.75 với 0.76+ khi New Architecture được bật. Kiểm tra đường dẫn Fabric/PIP được đề cập trong báo cáo và sử dụng các video kiểm thử được liên kết làm tài liệu tham chiếu. Được xem là hoàn tất khi các cập nhật trạng thái vẫn tiếp tục hiển thị trong lúc ứng dụng ở chế độ PIP mà không phụ thuộc vào react-native-background-timer.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Đánh giá
- Công nghệ
- react-native
- Lĩnh vực
- mobile
- Loại issue
- Lỗi
- Độ khó
- 4/5
- Thời gian dự kiến
- 3-5 ngày
- Mức độ hoạt động
- Đình trệ
- Độ rõ ràng
- Khá rõ ràng
- Mức phù hợp với người mới
- 38/100