henninghall / react-native-date-picker

React Native Date Picker is datetime picker for Android and iOS. It includes date, time and datetime picker modes. The datepicker is customizable and is supporting different languages. It's written with native code to achieve the best possible look, feel and performance.
MIT License
2.25k stars 346 forks source link

App getting crashed with new arch enabled when we touch at both top and bottom edges - EventEmitter#receiveTouches is not supported by the Fabric Interop Layer #714

Closed sudheerkarumanchi closed 11 months ago

sudheerkarumanchi commented 1 year ago

Dear @Team,

Thanks for upgrading and providing support for new arch. We are seeing a weird issue with date time picker modal esp. when we touch at top/bottom edges of picker view.

Currently we are using 4.3.3 version.

Unfortunately i was not able to upload the screenshot reference.

java.lang.UnsupportedOperationException: EventEmitter#receiveTouches is not supported by the Fabric Interop Layer
at com.facebook.react.fabric.interop.InteropEventEmitter.receiveTouches(InteropEventEmitter.java:57) at com.facebook.react.uimanager.events.TouchesHelper.sendTouchesLegacy(TouchesHelper.java:103) at com.facebook.react.uimanager.events.ReactEventEmitter.receiveTouches(ReactEventEmitter.java:93)

sudheerkarumanchi commented 1 year ago

@henninghall - any suggestions for a temporary/immediate resolution to the above issue? awaiting for your reply. Thanks.

henninghall commented 1 year ago

Hi, could you share a screencap of how to reproduce this?

sudheerkarumanchi commented 1 year ago

@henninghall - Attached the screenshot (marked the touch area in red color) for your reference. On picker view if we touch somewhere above 07:56 on top or below 11:00 or while fast scrolling and touches at edges top/bottom, it’s getting crashed and resulting in above error shared previously.

Sample code - `<View style={{ flex: 1, backgroundColor: '#1A1A1A', }}> <Modal isVisible={true} backdropColor={COLOR_GRAY} backdropTransitionOutTiming={0} style={{ justifyContent: "center", alignItems: "center", }}> <View style={{ backgroundColor: "#1a1a1a", justifyContent: "center", alignItems: "center", }}>

{ }} mode="time" is24hourSource="device" fadeToColor="#1a1a1a" textColor="#ffffff" style={{ borderWidth: 5, borderColor: 'white', }} />
            </View>
        </Modal>
    </View>`

This behaviour is seen esp. in Android but in iOS. Also the border color is not seen in android but reflecting in iOS. Capture+_2023-10-16-09-58-00 Capture+_2023-10-16-09-58-31 Capture+_2023-10-16-09-58-31~2_(1)

henninghall commented 1 year ago

I can't reproduce this, could you provide a repo where this is reproducable? What react native version are you using?

henninghall commented 1 year ago

(meanwhile you can use androidVariant="nativeAndroid" as a workaround)

sudheerkarumanchi commented 1 year ago

Hi @henninghall,

currently we are using "react-native": "0.72.4", "react-native-date-picker": "^4.3.3" and enabled new architecture, hermes tried this androidVariant="nativeAndroid" too. still the issue persists.

https://github.com/henninghall/react-native-date-picker/assets/48941933/f6250d31-c4f0-41e0-b081-848f59b1b820

sudheerkarumanchi commented 1 year ago

@henninghall Did you take a look at this issue and suggest a remedy? let me know if you require any additional details. Looking for your response

henninghall commented 1 year ago

Looked at it a bit, still not reproduced. Are you running an emulator? Which sdk?

One thing you can try, I don’t think it will work but React Native 0.62.6 had som fix for the event emitter.

If possible it would be really helpful if you could share a repo where this is reproducible.

sudheerkarumanchi commented 1 year ago

@henninghall - Able to reproduce this issue across android OS 11, 12, 13 devices when the date picker is added in a modal and touch at top/bottom of date picker. This error is not seen with out modal and in normal view.

`<View style={{ flex: 1, backgroundColor: '#1A1A1A', }}> <Modal isVisible={true} backdropColor={COLOR_GRAY} backdropTransitionOutTiming={0} style={{ justifyContent: "center", alignItems: "center", }}> <View style={{ height: '100%', backgroundColor: "red", justifyContent: "center", alignItems: "center", }}>

{ }} mode="time" is24hourSource="device" fadeToColor="#1a1a1a" textColor="#ffffff" style={{ borderWidth: 5, borderColor: 'white', }} /> ` If we run and see the above sample code, there will be some grey color area between date picker, modal edges and touching that area is crashing. Will try to create git repo and share it.
henninghall commented 1 year ago

Tried the code above with new arch and hermes, could not reproduce the crash. If you could share a repo, we can continue from there.

anatooly commented 9 months ago

This actual issue of all last versions & newArchEnabled=true. On prev. "react-native-date-picker": "^3.3.2", app crash when render on last version crash when call method onDateChange.

"react-native": "0.73.4", "react-native-date-picker": "^4.3.6",

FATAL EXCEPTION: main
Process: ***, PID: 24092
java.lang.UnsupportedOperationException: EventEmitter#receiveTouches is not supported by the Fabric Interop Layer
                                                                                                        at com.facebook.react.fabric.interop.InteropEventEmitter.receiveTouches(InteropEventEmitter.java:57)
                                                                                                        at com.facebook.react.uimanager.events.TouchesHelper.sendTouchesLegacy(TouchesHelper.java:103)
                                                                                                        at com.facebook.react.uimanager.events.ReactEventEmitter.receiveTouches(ReactEventEmitter.java:93)
                                                                                                        ...
makalaravikiran commented 8 months ago

Same issue, with below case,

When mode: spinner, inside modal and fabric enabled.

makalaravikiran commented 8 months ago

@henninghall , could you reopen the issue and look into it.

Hatta-Food-Hub commented 3 months ago

Please anyone found this solution getting same issue in "react-native-date-picker": "^5.0.4",

Hatta-Food-Hub commented 3 months ago

(meanwhile you can use androidVariant="nativeAndroid" as a workaround)

Where i'm already using flavours

Hatta-Food-Hub commented 3 months ago

Same issue, with below case,

When mode: spinner, inside modal and fabric enabled.

exactly

Hatta-Food-Hub commented 3 months ago

FATAL EXCEPTION: main Process: com.driverhattafoodhub.development, PID: 8139 java.lang.UnsupportedOperationException: EventEmitter#receiveTouches is not supported by the Fabric Interop Layer

ladiandrasi commented 1 month ago

We also faced this issue when using date-picker v5.0.7 inside of a react-native Modal. This react-native PR solved the issue for us.