Skip to content

TouchableWithoutFeedback only fires onLayout and onPress if child is a View #18611

Description

@rmacqueen

Environment

Environment:
OS: macOS High Sierra 10.13.2
Node: 8.9.4
Yarn: 1.3.2
npm: 5.6.0
Watchman: 4.9.0
Xcode: Xcode 9.2 Build version 9C40b
Android Studio: 3.0 AI-171.4443003

Packages: (wanted => installed)
react: 16.0.0 => 16.0.0
react-native: 0.51.0 => 0.51.0

Steps to Reproduce

This is a follow up to #10180 which was prematurely closed.

The TouchableWithoutFeedback component will not fire its onLayout or onPress functions unless the immediate child of the component is a View. Using any other custom component as the child, even if said component is itself implemented with a View at the top level, will prevent TouchableWithoutFeedback from functioning properly.

This won't work:

const MyCustomComponent = () => {
    <View>
        <Text>Hello world</Text>
    </View>
}

<TouchableWithoutFeedback onLayout={...} onPress={...}>
  <MyCustomComponent />
</TouchableWithoutFeedback>

but this will work:

<TouchableWithoutFeedback onLayout={...} onPress={...}>
    <View>
        <Text>Hello world</Text>
    </View>
</TouchableWithoutFeedback>

Expected behaviour is that both those above examples should work - that is, the onLayout and onPress callbacks should get invoked at their appropriate times.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Ran CommandsOne of our bots successfully processed a command.StaleThere has been a lack of activity on this issue and it may be closed soon.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions