@@ -62,7 +62,94 @@ In order to load mocks provided by RNGH, add the following to your jest config:
6262
6363## Testing Gestures' and Gesture handlers' callbacks
6464
65- RNGH provides APIs, specifically [ ` fireGestureHandler ` ] ( #firegesturehandler ) and [ ` getByGestureTestId ` ] ( #getbygesturetestid ) , to trigger selected handlers.
65+ RNGH provides the following APIs for triggering selected handlers:
66+
67+ - [ ` createGestureController ` ] ( #creategesturecontroller ) to imperatively control a gesture lifecycle one step at a time.
68+ - [ ` fireGestureHandler ` ] ( #firegesturehandler ) to dispatch a complete event stream.
69+ - [ ` getByGestureTestId ` ] ( #getbygesturetestid ) to find a gesture by its test ID.
70+
71+ ### createGestureController
72+
73+ ``` ts
74+ import { createGestureController } from ' react-native-gesture-handler/jest-utils' ;
75+
76+ createGestureController : (componentOrGesture ) => GestureController ;
77+ ```
78+
79+ Creates an imperative controller that dispatches gesture lifecycle events one step
80+ at a time. This allows the test to assert application state between lifecycle steps
81+ without manually supplying ` state ` , ` oldState ` , or ` handlerTag ` .
82+
83+ ` componentOrGesture ` can be:
84+
85+ - A Gesture Handler component found using a Jest query such as ` getByTestId ` .
86+ - A gesture object.
87+ - A gesture test ID string.
88+
89+ When a gesture object is passed directly, the event payload type is inferred from
90+ the gesture. Every lifecycle method accepts an optional partial event payload and
91+ fills omitted handler-specific properties with defaults.
92+
93+ The controller exposes these methods:
94+
95+ | Method | Behavior |
96+ | ------------ | ---------------------------------------------------------------------------------------------------------------- |
97+ | ` begin() ` | Starts a stream and calls ` onBegin ` . If the previous stream finished, the controller resets it before beginning. |
98+ | ` activate() ` | Activates a begun stream and calls ` onActivate ` . |
99+ | ` update() ` | Dispatches an update for an active stream and calls ` onUpdate ` . It can be called multiple times. |
100+ | ` end() ` | Ends a begun or active stream. Calls ` onDeactivate ` if active, then ` onFinalize ` with ` canceled: false ` . |
101+ | ` fail() ` | Fails a begun or active stream. Calls ` onDeactivate ` if active, then ` onFinalize ` with ` canceled: true ` . |
102+ | ` cancel() ` | Cancels a begun or active stream. Calls ` onDeactivate ` if active, then ` onFinalize ` with ` canceled: true ` . |
103+ | ` getState() ` | Returns the controller's current state without dispatching an event. |
104+
105+ After ` end() ` , ` fail() ` , or ` cancel() ` , the terminal state remains available through
106+ ` getState() ` . Calling ` begin() ` again starts another stream with the same controller.
107+ Calling methods in an invalid order throws an error. State-machine fields such as
108+ ` state ` , ` oldState ` , ` handlerTag ` , and ` nativeEvent ` cannot be supplied in event
109+ payloads because the controller manages them internally.
110+
111+ ``` tsx
112+ test (' updates application state after each gesture step' , () => {
113+ const onBegin = jest .fn ();
114+ const onActivate = jest .fn ();
115+ const onUpdate = jest .fn ();
116+ const onFinalize = jest .fn ();
117+
118+ const panGesture = renderHook (() =>
119+ usePanGesture ({
120+ disableReanimated: true ,
121+ onBegin ,
122+ onActivate ,
123+ onUpdate ,
124+ onFinalize ,
125+ })
126+ ).result .current ;
127+
128+ const controller = createGestureController (panGesture );
129+
130+ controller .begin ();
131+ expect (onBegin ).toHaveBeenCalledTimes (1 );
132+
133+ controller .activate ();
134+ expect (onActivate ).toHaveBeenCalledTimes (1 );
135+
136+ controller .update ({ translationX: 50 });
137+ expect (onUpdate ).toHaveBeenCalledWith (
138+ expect .objectContaining ({ translationX: 50 })
139+ );
140+
141+ controller .end ();
142+ expect (onFinalize ).toHaveBeenCalledWith (
143+ expect .objectContaining ({ canceled: false })
144+ );
145+ });
146+ ```
147+
148+ :::note
149+ ` createGestureController ` controls lifecycle events directly. It does not generate
150+ pointer input, run platform gesture recognizers, or evaluate relations between
151+ gestures.
152+ :::
66153
67154### fireGestureHandler
68155
@@ -133,7 +220,7 @@ components.
133220` testID ` must be unique among components rendered in test.
134221:::
135222
136- ## Example
223+ ## fireGestureHandler example
137224
138225Extracted from RNGH tests, check [ ` api_v3.test.tsx ` ] ( https://github.com/software-mansion/react-native-gesture-handler/blob/main/packages/react-native-gesture-handler/src/__tests__/api_v3.test.tsx ) for full implementation.
139226
0 commit comments