Skip to content

No handler function found with fireEvent.press on disabled TouchableOpacity #469

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
Andarius opened this issue Jul 30, 2020 · 9 comments · Fixed by #470
Closed

No handler function found with fireEvent.press on disabled TouchableOpacity #469

Andarius opened this issue Jul 30, 2020 · 9 comments · Fixed by #470

Comments

@Andarius
Copy link

Describe the bug

When running fireEvent.press on a disabled TouchableOpacity, the following error appears: No handler function found for event: "press"

Expected behavior

Should not raise an error

Steps to Reproduce

Run the following

import { TouchableOpacity } from 'react-native'

describe.only('Test TouchableOpacity', () => {
    const Button = ({ onPress }) => {
        return <TouchableOpacity testID='testBtn' disabled={true} onPress={onPress}></TouchableOpacity>
    }

    const onPressSpy = sinon.spy()

    it('onPress does not trigger', () => {
        const { getByTestId } = render( <Button onPress={onPressSpy}/>)
        fireEvent.press(getByTestId('testBtn'))
        expect(props.onPress.callCount).toBe(0)
    })
})

Versions

  npmPackages:
    @testing-library/react-native: ^7.0.0 => 7.0.0 
    react: 16.13.1 => 16.13.1 
    react-native: 0.63.0 => 0.63.0 
    react-test-renderer: ^16.13.0 => 16.13.1 
@thymikee thymikee added bug Something isn't working and removed bug Something isn't working labels Jul 30, 2020
@thymikee
Copy link
Member

The "touchable" is disabled, so the handler won't be invoked, hence the error thrown. I think we could improve the wording to be more obvious here.

@thymikee
Copy link
Member

cc @mdjastrzebski as he also has some thoughts on the topic :)

@Andarius
Copy link
Author

Andarius commented Jul 30, 2020

So what is the correct option here to test a disabled touchable ? Something like

const Button = ({ onPress, isDisabled }) => {
    return <TouchableOpacity testID='testBtn' disabled={isDisabled} onPress={isDisabled ? () => {}: onPress} />
}

?

@thymikee

This comment has been minimized.

@Andarius

This comment has been minimized.

@thymikee

This comment has been minimized.

@Andarius

This comment has been minimized.

@mdjastrzebski
Copy link
Member

@Andarius I think your original complain is a valid point. So fireEvent throws error when it does not find any matching event handler, which should suggested to the programmer that there is a problem with assertions or components under test.

However the case when there is event handler but is disabled should probably be handled without throwing error.

@thymikee
Copy link
Member

thymikee commented Jul 31, 2020

We've just released 7.0.1 which now doesn't throw. So please adjust your tests to something like this:

fireEvent.press(getByTestId('testBtn'));
expect(handlePress).not.toHaveBeenCalled();

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants