[iOS] App crashes with multiple DateTimePicker modals - UIDatePickerContainerViewController conflicts

Offen
  • Stimmt etwas nicht?
#1,010 7 Kommentare 1 Reaktion 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Anfängerfreundlichkeit
28/100
Issue-Typ
Bug
Klarheit
Größtenteils klar
Aktivitätsstatus
Veraltet
Tech-Stack
ios, javascript, react-native
Bereich
mobile

Rechercherichtung

The report names the patch file patches/@react-native-community+datetimepicker+8.4.4.patch but does not identify the source files or tests to change. Read the patch and verify how its method swizzling and cleanup interact with the iOS picker lifecycle. Done means maintainers can reproduce the crash and confirm a reviewed fix prevents it; the issue has had no comment for 242 days.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

[iOS] App crashes with multiple DateTimePicker modals - UIDatePickerContainerViewController conflicts

Bug Report

Problem

iOS app crashes when multiple DateTimePicker components are used, particularly when:

  • Multiple date pickers exist on the same screen
  • Rapid navigation between screens containing date pickers
  • Conditional rendering of date picker components
Environment
  • Package Version: @react-native-community/[email protected]
  • React Native: 0.81.1
  • Platform: iOS (iOS 13.0+)
  • React: 19.1.0
Expected Behavior

Multiple date pickers should work without conflicts, allowing users to interact with different date/time selectors smoothly.

Actual Behavior
  • App crashes when multiple UIDatePickerContainerViewController instances are presented
  • UI becomes unresponsive
  • Inconsistent modal behavior
  • Memory leaks from orphaned containers
Reproduction Steps
  1. Create multiple DateTimePicker components in a React Native app
  2. Use them on the same screen or navigate rapidly between screens with date pickers
  3. Trigger multiple date picker modals in succession
  4. Observe crashes or UI freezing on iOS
Code Example
// This pattern causes issues on iOS
export const CustomDateTimePicker: FC<IDateTimePicker> = ({ mode = 'datetime', onChange, value }) => {
  const [visible, setVisible] = useState<boolean>(false);

  return Platform.OS === 'ios' ? (
    <View>
      <DateTimePicker
        display="default"
        value={new Date(value)}
        mode={mode}
        onChange={onValueChange}
      />
    </View>
  ) : (
    // Android implementation
  );
};

Proposed Solution

We've developed a working patch that resolves this issue through:

1. Method Swizzling

Intercepts UIViewController.presentViewController to handle date picker conflicts:

+ (void)initialize {
    // Swizzle presentViewController to prevent conflicts
    // (Full implementation in attached patch)
}
2. Proactive Cleanup
+ (void)destroyAllDatePickerContainers {
    // Recursively finds and dismisses all UIDatePickerContainerViewController instances
    // Prevents accumulation of orphaned modals
}
3. Touch Event Handling
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
    // Cleanup existing containers before any interaction
    [RNDateTimePicker destroyAllDatePickerContainers];
}

Results After Fix

  • ✅ Stable operation with multiple date pickers
  • ✅ No crashes or UI freezing
  • ✅ Proper modal lifecycle management
  • ✅ Memory leak prevention
  • ✅ Consistent behavior across all usage patterns

Files Included

  • Patch File: patches/@react-native-community+datetimepicker+8.4.4.patch
  • Full Documentation: Available upon request

Request

We would like this fix to be considered for inclusion in the main package to resolve this critical iOS stability issue. The patch:

  • ✅ Is thoroughly tested
  • ✅ Uses safe, proven techniques (method swizzling)
  • ✅ Has minimal performance impact
  • ✅ Maintains full API compatibility
  • ✅ Resolves the issue completely

Would the maintainers be open to reviewing this solution for potential integration into the main codebase?

Additional Information

This issue affects many React Native iOS applications using multiple date pickers. The patch provides a robust, production-ready solution that has been tested in real-world scenarios.

Happy to provide additional details, testing results, or adjust the implementation based on maintainer feedback.

Vorherrschende Sprache
JavaScript
Sterne
2.9k
Forks
459
Ø Merge
4 T. 16 Std.
Gemergte PRs (30 T.)
5

Entwicklungsumgebung

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus react-native-datetimepicker/datetimepicker

Alle Issues in react-native-datetimepicker/datetimepicker

Ähnliche Issues

Weitere Issues zu JavaScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.