fireEvent Cannot read property 'charAt' of undefined

[sammysium]

Ask your Question

I doubt it is a bug but I have a Picker component and I am the following, trying to fire onValueChange:

const onEventMock = jest.fn();
const {getByTestId} = render();

const picker = getByTestId('TID_Language_Selector');

fireEvent(picker, 'onValueChange', 'ab');
expect(onEventMock).toHaveBeenCalledWith('ab');

It fails with fireEvent Cannot read property 'charAt' of undefined

I already tried fireEvent.onChange(picker) but it has no effect. How can I stimulate onValueChange event?

[thymikee]

What is Picker? Please provide as much detail as possible, libs used, their versions etc

[sammysium]

@thymikee sorry. I have solved it. Sorry I didn't update this ticket.

[thymikee]

Would be lovely to post the steps to solve it if someone stumps upon a similar problem :)

[i-mighty]

Could this issue be opened again?
I'm having a similar issue for fireEvent(button, 'press')
button is a TestInstance for a NativeBase Button

[thymikee]

@i-mighty please provide a repro we can download. Once triaged, I'd be happy to reopen and we can work on a fix :)

[nise2]

Hi, same problem there. I am trying to implement the react-native-picker with react-native-testing-library latest version (v5.0.3).

The implementation have changed from my latest version of react-native-testing-library (v.1.13.2).

Here is a working example with press event on a Button component :
Old version : fireEvent(myButton, 'press');
New version : fireEvent.press(myButton);

The problem now, is that this is not working with the valueChange event on a Picker component.
Old version (working): fireEvent(pickerComponent, valueChange, 'myValue');
But with the new version, it fails with : "Cannot read property 'charAt' of undefined"

I tried :

• fireEvent.change(pickerComponent, {target: {value: 'myValue'}});
• fireEvent.valueChange(pickerComponent, 'myValue');

How I can make it work with the new implementation ? Here is the doc : https://www.native-testing-library.com/docs/api-events

Could you share with us your solution please @sammysium ?

[sammysium]

Hey, I got it to work by: fireEvent(getByTestId('TID_Language_Selector'), 'valueChange', 'en_US'); where TID_Language_Selector is the picker testID en_US is the JSON language file

…

On Sat, May 23, 2020 at 9:54 AM nise2 ***@***.***> wrote: Hi, same problem there. I am trying to implement the react-native-picker <https://github.com/react-native-community/react-native-picker> with react-native-testing-library ***@***.***/react-native> latest version (v5.0.3). The implementation have changed from my latest version of react-native-testing-library (v.1.13.2). Here is a working example with *press* event on a Button component : Old version : fireEvent(myButton, 'press'); New version : fireEvent.press(myButton); The problem now, is that this is not working with the *valueChange* event on a Picker component. I tried : - fireEvent.change(pickerComponent, {target: {value: 'myValue'}}); - fireEvent.valueChange(pickerComponent, 'myValue'); - fireEvent(pickerComponent, valueChange, 'myValue'); (which failed with "Cannot read property 'charAt' of undefined` How I can make it work with the new implementation ? Here is the doc : https://www.native-testing-library.com/docs/api-events Could you share with us your solution please @sammysium <https://github.com/sammysium> ? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#289 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ALF7AKH2PAEVELLDHIICO2DRS75UJANCNFSM4MRROSLQ> .

-- Regards, Sium One Acre Fund | *Farmers First*

[nise2]

@sammysium Well thanks for your answer, unfortunately it still fails with the same error. Here is my code (with the declaration of pickerComponent) :

const pickerComponent = getByTestId('myPickerComponentTestId');
fireEvent(pickerComponent, 'valueChange', 'myValue')

Which version of react-testing-library are you using ?

[sammysium]

I am using "@react-native-community/picker": "^1.3.0", Can you post the full code of your component with the picker?

…

On Sat, May 23, 2020 at 10:17 AM nise2 ***@***.***> wrote: @sammysium <https://github.com/sammysium> Well thanks for your answer, unfortunately it still fails with the same error. Here is my code (with myComponent showed) : const myComponent = getByTestId('myPickerComponentId'); fireEvent(myComponent, 'valueChange', 'myValue') Which version of react-testing-library are you using ? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#289 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ALF7AKCMZIYWTEHHOHWWXLTRTAAJNANCNFSM4MRROSLQ> .

-- Regards, Sium One Acre Fund | *Farmers First*

[sammysium]

sorry: "react-native-testing-library": "^1.13.2", On Sat, May 23, 2020 at 10:20 AM Sium Kiflemariam < sium.kiflemariam@oneacrefund.org> wrote:

…

I am using ***@***.***/picker": "^1.3.0", Can you post the full code of your component with the picker? On Sat, May 23, 2020 at 10:17 AM nise2 ***@***.***> wrote: > @sammysium <https://github.com/sammysium> Well thanks for your answer, > unfortunately it still fails with the same error. Here is my code (with > myComponent showed) : > > const myComponent = getByTestId('myPickerComponentId'); > fireEvent(myComponent, 'valueChange', 'myValue') > > Which version of react-testing-library are you using ? > > — > You are receiving this because you were mentioned. > Reply to this email directly, view it on GitHub > <#289 (comment)>, > or unsubscribe > <https://github.com/notifications/unsubscribe-auth/ALF7AKCMZIYWTEHHOHWWXLTRTAAJNANCNFSM4MRROSLQ> > . > -- Regards, Sium One Acre Fund | *Farmers First*

-- Regards, Sium One Acre Fund | *Farmers First*

[nise2]

Actually I just found out I mixed up the two libraries...

I asked on your feed (concerning react-native-testing-library) instead of https://github.com/testing-library/native-testing-library. My bad... Yup, this is working fine as expected with this current library.

Thanks !

[andres-pino]

I had the same error but it was a fool mistake for me, I was trying to press a button element like this:
fireEvent(buttonElement)
But I missed to use the press function in the fireEvent object, so the solution was
fireEvent.press(buttonElement)