refactor: improve native state management

Author: mdjastrzebski

src/cleanup.ts

@@ -1,12 +1,10 @@
-import { clearNativeState } from './native-state';
 import { clearRenderResult } from './screen';
 
 type CleanUpFunction = () => void;
 
 const cleanupQueue = new Set<CleanUpFunction>();
 
 export default function cleanup() {
-  clearNativeState();
   clearRenderResult();
 
   cleanupQueue.forEach((fn) => fn());

src/fire-event.ts

@@ -154,6 +154,6 @@ function setNativeStateIfNeeded(element: ReactTestInstance, eventName: string, v
     isHostTextInput(element) &&
     isTextInputEditable(element)
   ) {
-    nativeState?.valueForElement.set(element, value);
+    nativeState.valueForElement.set(element, value);
   }
 }

src/helpers/text-input.ts

@@ -17,7 +17,7 @@ export function getTextInputValue(element: ReactTestInstance) {
 
   return (
     element.props.value ??
-    nativeState?.valueForElement.get(element) ??
+    nativeState.valueForElement.get(element) ??
     element.props.defaultValue ??
     ''
   );

src/native-state.ts

@@ -11,15 +11,7 @@ export type NativeState = {
   contentOffsetForElement: WeakMap<ReactTestInstance, Point>;
 };
 
-export let nativeState: NativeState | null = null;
-
-export function initNativeState(): void {
-  nativeState = {
-    valueForElement: new WeakMap(),
-    contentOffsetForElement: new WeakMap(),
-  };
-}
-
-export function clearNativeState(): void {
-  nativeState = null;
-}
+export let nativeState: NativeState = {
+  valueForElement: new WeakMap(),
+  contentOffsetForElement: new WeakMap(),
+};

src/render.tsx

@@ -12,7 +12,6 @@ import { validateStringsRenderedWithinText } from './helpers/string-validation';
 import { renderWithAct } from './render-act';
 import { setRenderResult } from './screen';
 import { getQueriesForElement } from './within';
-import { initNativeState } from './native-state';
 
 export interface RenderOptions {
   wrapper?: React.ComponentType<any>;
@@ -128,7 +127,6 @@ function buildRenderResult(
   });
 
   setRenderResult(result);
-  initNativeState();
 
   return result;
 }

src/user-event/paste.ts

@@ -33,7 +33,7 @@ export async function paste(
   dispatchEvent(element, 'selectionChange', EventBuilder.TextInput.selectionChange(rangeToClear));
 
   // 3. Paste the text
-  nativeState?.valueForElement.set(element, text);
+  nativeState.valueForElement.set(element, text);
   dispatchEvent(element, 'change', EventBuilder.TextInput.change(text));
   dispatchEvent(element, 'changeText', text);
 

src/user-event/scroll/__tests__/scroll-to.test.tsx

@@ -103,7 +103,7 @@ describe('scrollTo()', () => {
     ]);
   });
 
-  test('remembers previous scroll position', async () => {
+  test('remembers previous scroll offset', async () => {
     const { events } = renderScrollViewWithToolkit();
     const user = userEvent.setup();
 

src/user-event/scroll/scroll-to.ts

@@ -56,24 +56,24 @@ export async function scrollTo(
     options.contentSize?.height ?? 0,
   );
 
-  const initialPosition = nativeState?.contentOffsetForElement.get(element) ?? { x: 0, y: 0 };
+  const initialOffset = nativeState.contentOffsetForElement.get(element) ?? { x: 0, y: 0 };
   const dragSteps = createScrollSteps(
     { y: options.y, x: options.x },
-    initialPosition,
+    initialOffset,
     linearInterpolator,
   );
   await emitDragScrollEvents(this.config, element, dragSteps, options);
 
-  const momentumStart = dragSteps.at(-1) ?? initialPosition;
+  const momentumStart = dragSteps.at(-1) ?? initialOffset;
   const momentumSteps = createScrollSteps(
     { y: options.momentumY, x: options.momentumX },
     momentumStart,
     inertialInterpolator,
   );
   await emitMomentumScrollEvents(this.config, element, momentumSteps, options);
 
-  const finalPosition = momentumSteps.at(-1) ?? dragSteps.at(-1) ?? initialPosition;
-  nativeState?.contentOffsetForElement.set(element, finalPosition);
+  const finalOffset = momentumSteps.at(-1) ?? dragSteps.at(-1) ?? initialOffset;
+  nativeState.contentOffsetForElement.set(element, finalOffset);
 }
 
 async function emitDragScrollEvents(

src/user-event/type/type.ts

@@ -95,7 +95,7 @@ export async function emitTypingEvents(
     return;
   }
 
-  nativeState?.valueForElement.set(element, text);
+  nativeState.valueForElement.set(element, text);
   dispatchEvent(element, 'change', EventBuilder.TextInput.change(text));
   dispatchEvent(element, 'changeText', text);
 

website/docs/12.x/docs/api/events/user-event.mdx

@@ -269,10 +269,10 @@ Each scroll interaction consists of a mandatory drag scroll part, which simulate
 
 ### Options {#scroll-to-options}
 
-- `y` - target vertical drag scroll position
-- `x` - target horizontal drag scroll position
-- `momentumY` - target vertical momentum scroll position
-- `momentumX` - target horizontal momentum scroll position
+- `y` - target vertical drag scroll offset
+- `x` - target horizontal drag scroll offset
+- `momentumY` - target vertical momentum scroll offset
+- `momentumX` - target horizontal momentum scroll offset
 - `contentSize` - passed to `ScrollView` events and enabling `FlatList` updates
 - `layoutMeasurement` - passed to `ScrollView` events and enabling `FlatList` updates