Add `cancelsJSResponder ` prop to the gesture handlers by coado · Pull Request #4094 · software-mansion/react-native-gesture-handler

coado · 2026-04-16T09:36:14Z

Description

Adds a per-gesture cancelsJSResponder?: boolean prop on both platforms to the v3 handler hooks. It defaults to true to preserve the behavior of cancelling RN JS responder system.

On Android it moves the root-view dispatch off onCancel onto new orchestrator callbacks onCancelJSResponderRequested and onCancelJSResponderReleased. The orchestrator only files the "released" callback when the last active handler with cancelsJSResponder: true finishes.

on iOS the RNRootViewGestureRecognizer checks the handler prop before notifying the delegate.

Test plan

Added new test example with multiple handlers that might or might not cancel the JS responder.

Simulator Screenshot - iPhone 16 Pro Max - 2026-04-17 at 12 59 42

Copilot

Pull request overview

Adds a new preventRecognizers configuration option to gesture handlers to control whether GH activation cancels React Native JS responders (with native iOS/Android plumbing + an example to demonstrate behavior).

Changes:

Added preventRecognizers to shared gesture config types/whitelists so it can flow from JS to native.
Implemented native behavior gates on iOS (root recognizer) and Android (orchestrator → root helper interception) with default true.
Added docs + a new common-app example to showcase responder cancellation differences.

Reviewed changes

Copilot reviewed 13 out of 14 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
packages/react-native-gesture-handler/src/v3/types/ConfigTypes.ts	Adds `preventRecognizers` to common gesture config typing.
packages/react-native-gesture-handler/src/v3/hooks/utils/propsWhiteList.ts	Allows the new config prop to pass through native config filtering.
packages/react-native-gesture-handler/src/v3/detectors/NativeDetector.tsx	Minor formatting-only change near detector initialization.
packages/react-native-gesture-handler/src/handlers/gestures/GestureDetector/utils.ts	Adds `preventRecognizers` to allowed prop list for detector plumbing.
packages/react-native-gesture-handler/apple/RNRootViewGestureRecognizer.m	iOS: only trigger RN responder cancellation when `preventRecognizers` is enabled.
packages/react-native-gesture-handler/apple/RNGestureHandler.mm	iOS: default + config parsing for `preventRecognizers`.
packages/react-native-gesture-handler/apple/RNGestureHandler.h	iOS: exposes `preventRecognizers` on the handler.
packages/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootHelper.kt	Android: intercept/cancel RN touch stream when requested by orchestrator.
packages/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/core/GestureHandlerOrchestrator.kt	Android: emits request/release callbacks based on handler activation + finish.
packages/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/core/GestureHandler.kt	Android: stores/reads `preventRecognizers` from config with default `true`.
packages/docs-gesture-handler/docs/fundamentals/root-view.mdx	Doc formatting cleanup (indentation/trailing whitespace).
packages/docs-gesture-handler/docs/fundamentals/gesture-detector.mdx	Adds docs for `preventRecognizers` (but currently includes a broken tag and placement concerns).
apps/common-app/src/new_api/tests/rnResponderCancellation/index.tsx	New example screen demonstrating RN responder cancellation vs. concurrent handling.
apps/common-app/src/new_api/index.tsx	Registers the new example in the app’s examples list.

Comments suppressed due to low confidence (1)

packages/docs-gesture-handler/docs/fundamentals/gesture-detector.mdx:206

The closing tag for HeaderWithBadges was changed to </BadHeaderWithBadgesges>, which is not a valid component/tag and will break MDX rendering/build. Replace it with the correct </HeaderWithBadges> closing tag.

<HeaderWithBadges platforms={['web']}>
### touchAction
</HeaderWithBadges>

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

coado · 2026-04-17T12:12:44Z

@copilot review?

Copilot · 2026-04-17T12:16:28Z

@copilot review?

Here's the review of the current state of the PR:

Overall: The implementation is solid. All 3 previously flagged issues are resolved. Here's a brief summary per area:

Android:

onCancelJSResponderRequested is correctly placed after the FAILED/CANCELLED early-return guard in makeActive — no stale shouldIntercept=true risk for already-finished handlers.
onCancelJSResponderReleased checks that no other active handler still has cancelsJSResponder=true before clearing shouldIntercept. ✓

iOS:

cancelsJSResponder property defaults to YES in resetConfig, read from config in updateConfig. ✓
canBePreventedByGestureRecognizer: gates the delegate call on handler.cancelsJSResponder. ✓

TypeScript:

Prop flows correctly: CommonGestureConfig (v3 types) → CommonConfig whitelist (v3) → ALLOWED_PROPS (v2 utils). ✓

Docs: cancelsJSResponder is documented in base-gesture-config.mdx (not under GestureDetector props). ✓

No issues found in the current state.

j-piasecki

Can you update the title and description with the final prop name?

Also, I don't have an iOS device on hand, so can you check the following scenario?

There are two handlers and js recognizer on the same view. Gesture A with cancelsJSRecognizer: false, and a config that prevents it from activating (like minimumDistance: 100000 on pan). Gesture B has cancelsJSRecognizer: false and requires A to fail before it activates (useExclusiveGestures(A, B)), but should try to activate almost immediately (like pan with minimumDistance: 10). Now, in that scenario, does B trying to activate but getting blocked on A, cancel the JS recognizer, or not?

I've checked Android and there it works as expected (until A fails, the JS recognizer is not interrupted).

This reverts commit fff3181.

…etector.tsx Co-authored-by: Jakub Piasecki <jakub.piasecki@swmansion.com>

m-bert

Seems like @j-piasecki caught everything

…rcept to onCancell

…ct-native-gesture-handler into prevent-recognizers

coado · 2026-04-30T15:54:30Z

Can you update the title and description with the final prop name?

Also, I don't have an iOS device on hand, so can you check the following scenario?

There are two handlers and js recognizer on the same view. Gesture A with cancelsJSRecognizer: false, and a config that prevents it from activating (like minimumDistance: 100000 on pan). Gesture B has cancelsJSRecognizer: false and requires A to fail before it activates (useExclusiveGestures(A, B)), but should try to activate almost immediately (like pan with minimumDistance: 10). Now, in that scenario, does B trying to activate but getting blocked on A, cancel the JS recognizer, or not?

I've checked Android and there it works as expected (until A fails, the JS recognizer is not interrupted).

Not sure if you meant cancelsJSRecognizer: true on B, but in both cases seems like it works as expected.

…t incorrect JS responder cancellation PR #4094 moved the ACTION_CANCEL dispatch from RootViewGestureHandler.onCancel() into the orchestrator's makeActive() method, gated by handler.cancelsJSResponder. However, when requestDisallowInterceptTouchEvent triggers tryCancelAllHandlers(), the RootViewGestureHandler itself activates through makeActive(), and since cancelsJSResponder defaults to true, it incorrectly dispatches ACTION_CANCEL to the root view — cancelling the very native view (e.g. ScrollView) that requested the touch lock. Setting cancelsJSResponder=false on the RootViewGestureHandler prevents this spurious cancellation while preserving the correct behavior for user gesture handlers.

## Description Fixes #4295 On Android, 3.x cancels the React Native JS responder whenever any native view calls `requestDisallowInterceptTouchEvent` during a touch. Two common scenarios break because of this (neither involves any RNGH gesture): - **RN `Pressable`/`Touchable*` wrapping a `TextInput`** — `ReactEditText` unconditionally calls `parent.requestDisallowInterceptTouchEvent(true)` on every `ACTION_DOWN`, even when `editable={false}` and `pointerEvents="none"` (`pointerEvents` isn't enforced in native Android dispatch for `ReactEditText`, only in RN's JS hit test). Taps landing on the input dispatch `topTouchCancel` and the press never completes (#4295 — this is what breaks Gluestack UI's Select). - **Any default-config `PanResponder`** — on grant, RN's `JSResponderHandler.setJSResponder` blocks native parents via `requestDisallowInterceptTouchEvent(true)` (`onShouldBlockNativeResponder` defaults to `true` on Android). That call bounces back through the RNGH root view, which then cancels the responder that was just granted: every drag logs `onPanResponderGrant` → `onPanResponderTerminate`. **Root cause:** #4094 moved the JS-responder cancellation from `RootViewGestureHandler.onCancel` into `GestureHandlerOrchestrator.makeActive`, gated on the new `cancelsJSResponder` flag — which defaults to `true` for every handler, **including the internal `RootViewGestureHandler`**. That handler activates inside `tryCancelAllHandlers()` (the `requestDisallowInterceptTouchEvent` path), so a mechanism that previously only cancelled RNGH's own handlers now also kills the JS responder. The fix opts the internal root handler out of JS-responder cancellation. This restores: - **v2 semantics** — root-handler activation cancelled other RNGH handlers but never dispatched a JS-responder cancel; handlers activating still cancel it through their own flag (incidentally, this also restores the behavior of v2's removed `handleSetJSResponder`: a JS responder taking over with `blockNativeResponder` cancels RNGH handlers, not itself), - **stock RN semantics** — `ReactSurfaceView.requestDisallowInterceptTouchEvent` deliberately keeps the JS touch stream alive; RN core only cancels the responder via explicit `onChildStartedNativeGesture` calls (e.g. `ScrollView`, `SwipeRefreshLayout` — those paths are unaffected by this change), - **iOS parity** — `RNRootViewGestureRecognizer` only notifies the delegate when the *preventing* recognizer maps to an RNGH handler with `cancelsJSResponder` set; the root recognizer itself never triggers the cancellation, so iOS never had this bug. The flag cannot be reverted accidentally: `resetConfig()` only runs through `Factory.setConfig` (the JS config path), and the root handler is constructed directly with a negative tag and never configured from JS. The "block release" timing is keyed on `gestureHandlers.isEmpty()`, not on the flag, so it is also unaffected. ## Test plan <details><summary>Repro 1 — #4295 (TextInput inside RN Pressable)</summary> <p> ```jsx <GestureHandlerRootView style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}> <Pressable onPress={() => setCount((c) => c + 1)} style={{ borderWidth: 1, padding: 10 }}> <TextInput value="Tap me" editable={false} pointerEvents="none" /> <Text>Icon area (works)</Text> </Pressable> <Text>Press count: {count}</Text> </GestureHandlerRootView> ``` </p> </details> <details><summary>Repro 2 — default PanResponder terminated on grant</summary> <p> ```jsx const responder = PanResponder.create({ // default onShouldBlockNativeResponder (true on Android) — do not override onStartShouldSetPanResponder: () => true, onPanResponderGrant: () => log('grant'), onPanResponderRelease: () => log('release'), onPanResponderTerminate: () => log('TERMINATE'), }); <GestureHandlerRootView style={{ flex: 1 }}> <View {...responder.panHandlers} style={{ width: 250, height: 180 }} /> </GestureHandlerRootView> ``` </p> </details> Verified on Android emulator (Pixel 7 Pro, API 34) with `basic-example` (RN 0.86, Fabric): - Repro 1 — before: taps on the `TextInput` area never fire `onPress` (count stays 0); taps on the sibling `Text` work. After: all taps fire (3/3 on the input area, sibling still works). - Repro 2 — before: every drag logs `grant` → `TERMINATE`. After: `grant` → `release`. - iOS (iPhone 17 Pro simulator, same RN version): Repro 1 works correctly with and without this change — confirms iOS is unaffected and this stays Android-only. - `RN responder cancellation` test example (added in #4094), Single handler tab, both toggle states — behavior unchanged by this PR: - `cancelsJSResponder: true`: `onResponderGrant` → moves → `onResponderTerminate` → `GH pan ACTIVE` → finalize (success), - `cancelsJSResponder: false`: responder keeps receiving moves, ends with `onResponderRelease`, pan still activates and finalizes with success.

coado added 12 commits April 8, 2026 16:36

initial

4897ae0

Add on Android

8fd0c11

pass preventRecognizers per Android root view

1f123b1

preventRecognizers per gesture detector

b939be1

prevent recognizers Android

dc9270f

rename

aae857b

remove smth

986a56a

testing v3

1197ee7

better example

da47e89

set preventRecognizers on gesture handlers

a97742e

fix docx

fca5a98

fix docs again

f9b2835

Copilot AI review requested due to automatic review settings April 16, 2026 09:36

Copilot started reviewing on behalf of coado April 16, 2026 09:36 View session

fix

ea95543

Copilot AI reviewed Apr 16, 2026

View reviewed changes

coado added 5 commits April 16, 2026 13:29

block recognizers after the state is checked

2e97530

fix typo

c4b49ec

docs

68c31bb

better example

ca4c6d3

rename to cancelsJsResponder

fd57422

Copilot started work on behalf of coado April 17, 2026 12:12 View session

Copilot finished work on behalf of coado April 17, 2026 12:17

coado changed the title ~~[DRAFT] Add preventRecognizers prop to the gesture handlers~~ Add preventRecognizers prop to the gesture handlers Apr 23, 2026

coado marked this pull request as ready for review April 23, 2026 14:10

coado assigned m-bert and j-piasecki Apr 23, 2026

j-piasecki reviewed Apr 24, 2026

View reviewed changes

Comment thread packages/react-native-gesture-handler/apple/RNRootViewGestureRecognizer.m Outdated

coado changed the title ~~Add preventRecognizers prop to the gesture handlers~~ Add cancelsJSResponder prop to the gesture handlers Apr 24, 2026

coado and others added 5 commits April 24, 2026 11:40

merge

fff3181

Revert "merge"

758cea7

This reverts commit fff3181.

Update packages/react-native-gesture-handler/src/v3/detectors/NativeD…

803ee7c

…etector.tsx Co-authored-by: Jakub Piasecki <jakub.piasecki@swmansion.com>

removed from allowed props list

92fecd7

better comment

770b410

m-bert reviewed Apr 24, 2026

View reviewed changes

coado added 3 commits April 24, 2026 14:15

better docs

eea0192

pass onJSResponderCancelListener to the orchestrator, move shouldInte…

d8ff02f

…rcept to onCancell

changing example

9f24c36

coado force-pushed the prevent-recognizers branch from 3a3d592 to 9f24c36 Compare April 24, 2026 14:30

coado added 7 commits April 24, 2026 16:33

Merge branch 'main' into prevent-recognizers

4d509d3

empty

0c13b44

merge

bc8f207

Merge branch 'prevent-recognizers' of github.com:software-mansion/rea…

7795b1a

…ct-native-gesture-handler into prevent-recognizers

use badges

403a750

fix types

3f7c16e

change description

d419464

j-piasecki reviewed Apr 27, 2026

View reviewed changes

Comment thread ...andler/android/src/main/java/com/swmansion/gesturehandler/core/GestureHandlerOrchestrator.kt Outdated

Comment thread ...ndler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootHelper.kt

pass non-null callback

6eac6c7

j-piasecki approved these changes May 7, 2026

View reviewed changes

coado merged commit 5505329 into main May 7, 2026
12 checks passed

coado deleted the prevent-recognizers branch May 7, 2026 13:05

j-piasecki mentioned this pull request May 11, 2026

Fix handling keyboard should persists taps #4158

Merged

m-bert mentioned this pull request Jul 6, 2026

Don't block JS responder in RootHelper #4297

Merged

coderabbitai Bot mentioned this pull request Aug 7, 2026

feat(g3): Slice 1 — foundations (routes + UI kit + realtime invalidation + datetime) exposwifty31/VetTrack---RN-Migration-#23

Merged

Uh oh!

Uh oh!

Conversation

coado commented Apr 16, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Test plan

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

coado commented Apr 17, 2026

Uh oh!

Copilot AI commented Apr 17, 2026

Uh oh!

j-piasecki left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

m-bert left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

coado commented Apr 30, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

coado commented Apr 16, 2026 •

edited

Loading