Skip to content

Commit

Permalink
fix TouchableWithoutFeedback and TouchableOpacity dropping onPress in…
Browse files Browse the repository at this point in the history
… React 18 (#42121)

Summary:

## Changelog: 
[General][Fixed] - TouchableWithoutFeedback and TouchableOpacity dropping touches with React 18.


TouchableWithoutFeedback and TouchableOpacity do not trigger onPress when used with React 18. This is because it resets its pressability configuration in `componentWillUnmount`. This is fine, we want to stop deliver events and restart all timers when component is unmounted.
```
componentWillUnmount(): void {
    this.state.pressability.reset();
  }
```

But TouchableWithoutFeedback and TouchableOpacity were not restarting the pressability configuration when component was mounted again. It was restarting the configuration in `componentDidUpdate`, which is not called when component is unmounted and mounted again.

Reviewed By: fkgozali

Differential Revision: D52388699
  • Loading branch information
sammy-SC authored and facebook-github-bot committed Jan 2, 2024
1 parent f1a7f08 commit 35b3bf3
Show file tree
Hide file tree
Showing 2 changed files with 8 additions and 0 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -314,6 +314,10 @@ class TouchableOpacity extends React.Component<Props, State> {
}
}

componentDidMount(): void {
this.state.pressability.configure(this._createPressabilityConfig());
}

componentWillUnmount(): void {
this.state.pressability.reset();
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -189,6 +189,10 @@ class TouchableWithoutFeedback extends React.Component<Props, State> {
this.state.pressability.configure(createPressabilityConfig(this.props));
}

componentDidMount(): mixed {
this.state.pressability.configure(createPressabilityConfig(this.props));
}

componentWillUnmount(): void {
this.state.pressability.reset();
}
Expand Down

0 comments on commit 35b3bf3

Please sign in to comment.