Invariant Violation: `new NativeEventEmitter()` requires a non-null argument.

[zihaolam]

Describe the bug ERROR Invariant Violation: new NativeEventEmitter() requires a non-null argument.

This error is located at: in DatePickerIOS (created by DatePickerWrapper) in DatePickerWrapper (created by BookSessionModal) in RCTView in Unknown (created by BookSessionModal) in BookSessionModal (created by ModalScreen) in ModalScreen in Unknown (created by Route(modal)) in Suspense (created by Route(modal)) in Route (created by Route(modal)) in Route(modal) (created by SceneView) in StaticContainer in EnsureSingleNavigator (created by SceneView) in SceneView (created by SceneView) in RCTView (created by View) in View (created by DebugContainer) in RCTView (created by View) in View (created by AppContainer) in RCTView (created by View) in View (created by AppContainer) in AppContainer (created by DebugContainer) in DebugContainer (created by MaybeNestedStack) in RNSScreen (created by Animated(Anonymous)) in Animated(Anonymous) (created by InnerScreen) in Suspender (created by Freeze) in Suspense (created by Freeze) in Freeze (created by DelayedFreeze) in DelayedFreeze (created by InnerScreen) in InnerScreen (created by Screen) in Screen (created by MaybeNestedStack) in Suspender (created by Freeze) in Suspense (created by Freeze) in Freeze (created by DelayedFreeze) in DelayedFreeze (created by ScreenStack) in RNSScreenStack (created by ScreenStack) in ScreenStack (created by MaybeNestedStack) in MaybeNestedStack (created by SceneView) in RCTView (created by View) in View (created by SceneView) in RNSModalScreen (created by Animated(Anonymous)) in Animated(Anonymous) (created by InnerScreen) in Suspender (created by Freeze) in Suspense (created by Freeze) in Freeze (created by DelayedFreeze)

Expected behavior For the datepicker to render

To Reproduce

import React from "react";
import DatePicker from "react-native-date-picker";
import { View, Text } from "tamagui";

export const BookSessionModal = () => {
	const [isDatePickerOpen, setIsDatePickerOpen] = React.useState(false);
	const [selectedDate, setSelectedDate] = React.useState<Date>(new Date());
	return (
		<View>
			<Text>Book Session</Text>
			<DatePicker
				modal
				open={isDatePickerOpen}
				date={selectedDate}
				onConfirm={(date) => {
					setIsDatePickerOpen(false);
					setSelectedDate(date);
				}}
				onCancel={() => {
					setIsDatePickerOpen(false);
				}}
			/>
		</View>
	);
};

Smartphone (please complete the following information):

• OS: iOS
• React Native version 0.74.1
• react-native-date-picker version ^5.0.4

[andydotdaniel]

Are you running this in your unit test? I received the same error but only when running unit tests using Jest.

[MarcosJBM]

Having the same problem.

• React Native: 0.68.0

[jvgeee]

@zihaolam @MarcosJBM I was having this issue too, FYI in my experience Invariant Violation: new NativeEventEmitter() bugs in RN seem to be caused by a pods/bundling mismatch between RN and native modules.

For me, updating my packages, updating pods and rebuilding for IOS fixed it:

• npx expo install --fix (if using expo)
• npx pod-install (reinstall pods)
• npx expo run:ios (which re-builds for IOS)

[rocket13011]

For jest add on setup file jest.mock('react-native-date-picker', () => 'DatePicker');

[btsungu]

Any solution for this issue? The date picker works fine on Android but I get this error on iOS. I'm running RN 0.67 and React Native Date Picker ^5.0.4

[colingraydon]

Going back go version 4.4.0 solved it for my team.

[julekgwa]

on Expo running npx expo prebuild --clean solves the issue.

[fikkatra]

Going back to v5.0.1 avoids the issue for now

[ryansherby]

Any progress on this issue?

[ysnbyzli]

hi, I'm having the same problem too

[btsungu]

For me with RN 67 v4.2.2 solved the issue.

[ashirkhan94]

same issue for me any update?

 ERROR  Warning: Invariant Violation: `new NativeEventEmitter()` requires a non-null argument.

This error is located at:
    in DatePickerIOS (created by DatePickerWrapper)

[Linda2734]

Going back to v5.0.1 avoids the issue for now

I tried this, it got rid of the error but now the button is inactive. If anyone has any solutions, I have opened an issue, so you can reply there.

[Linda2734]

jvgeee

I tried this, it got rid of the error but now the button is inactive. If anyone has any solutions, I have opened an issue, so you can reply there.

[iverok]

You'll get this error if running in Expo Go (which it is documented will not work). If you are in expo, make sure you are using the development build.

[henninghall]

If someone is still seeing this issue with latest version, please let me know what version you are on and I will reopen.

(Also yes Expo Go is unsupported)

[senerdude]

"react-native-date-picker": "^5.0.13",

I have the same problem.

[rizikolik]

Same issue is happening on Expo development builds with version :5.0.13 Expo SDK-52 and RN:0.76.9 @henninghall

[monkemedia]

Anyone have a solution for this? I am also having problems with this error in Expo Development Build.

Picker: 5.0.13 Expo: 53.0.19

[RolandExSauce]

I got it working with: "@react-native-community/datetimepicker": "^8.4.1" - using react native bareflow with expo just for preview, here is my code: import React from "react"; import { View, Platform } from "react-native"; import DateTimePicker from "@react-native-community/datetimepicker"; import { IMyDatePickerProps } from "../../types/components.types"; import React from 'react'; import { View, Platform, Modal, StyleSheet } from 'react-native'; import DateTimePicker from '@react-native-community/datetimepicker'; import CustomBtn from './CustomBtn'; import { IMyDatePickerProps } from '../../types/components.types';

const MyDatePicker: React.FC<IMyDatePickerProps> = ({ value = new Date(), onChange, mode = "date", minimumDate, maximumDate, open = false, onClose, }) => { const [iosDate, setIosDate] = React.useState(value);

const handleChange = (event: any, selectedDate?: Date) => { if (Platform.OS === 'android') { onClose?.(); if (selectedDate) { onChange?.(selectedDate); } return; }

// For iOS, we just update the temp date
if (selectedDate) {
  setIosDate(selectedDate);
}

};

const handleIosConfirm = () => { onChange?.(iosDate); onClose?.(); };

if (Platform.OS === 'web') { return null; } return ( <> {Platform.OS === 'ios' && open ? ( <Modal transparent animationType="slide"> <View style={styles.iosContainer}> <View style={styles.iosHeader}> <CustomBtn onPress={onClose} btnText="Cancel" variant="none" noBackground noBorder textStyle={styles.iosButtonText} /> <View style={{ flex: 1 }} /> <CustomBtn onPress={handleIosConfirm} btnText="Done" variant="none" noBackground noBorder textStyle={[styles.iosButtonText, styles.iosConfirmText]} /> </View> <View style={styles.iosPickerContainer}> <DateTimePicker value={iosDate} mode={mode} display="spinner" onChange={handleChange} minimumDate={minimumDate} maximumDate={maximumDate} themeVariant="light" /> </View> </View> </Modal> ) : open ? ( <DateTimePicker value={value} mode={mode} display="default" onChange={handleChange} minimumDate={minimumDate} maximumDate={maximumDate} /> ) : null} </> ); };

const styles = StyleSheet.create({ iosContainer: { flex: 1, justifyContent: 'flex-end', backgroundColor: 'rgba(0,0,0,0.5)', }, iosHeader: { flexDirection: 'row', alignItems: 'center', padding: 16, backgroundColor: '#f8f8f8', borderTopWidth: 1, borderTopColor: '#dedede', }, iosButtonText: { fontSize: 16, color: '#007AFF', paddingHorizontal: 8, }, iosConfirmText: { fontWeight: '600', }, iosPickerContainer: { backgroundColor: 'white', }, }); export default MyDatePicker; I have a custombtn using Pressable, my versions: "expo": "^53.0.19", "expo-dev-client": "~5.2.4", "react-native": "0.79.5", "react-native-date-picker": "^5.0.13",

I hope this helps anyone 👍

[wavesandwaves]

Hi @henninghall, I'm seeing this with version 5.0.13 of react-native-date-picker, in a react-native cli project, react-native version 0.73.7.