refactor: pass through Test Renderer options (#1594)

Author: mdjastrzebski

src/render-act.ts

@@ -4,15 +4,16 @@ import act from './act';
 
 export function renderWithAct(
   component: React.ReactElement,
-  options?: TestRendererOptions,
+  options?: Partial<TestRendererOptions>,
 ): ReactTestRenderer {
   let renderer: ReactTestRenderer;
 
   // This will be called synchronously.
   void act(() => {
+    // @ts-expect-error TestRenderer.create is not typed correctly
     renderer = TestRenderer.create(component, options);
   });
 
-  // @ts-ignore act is synchronous, so renderer is already initialised here
+  // @ts-ignore act is synchronous, so renderer is already initialized here
   return renderer;
 }

src/render.tsx

@@ -15,7 +15,7 @@ import { getQueriesForElement } from './within';
 
 export interface RenderOptions {
   wrapper?: React.ComponentType<any>;
-  createNodeMock?: (element: React.ReactElement) => any;
+  createNodeMock?: (element: React.ReactElement) => unknown;
   unstable_validateStringsRenderedWithinText?: boolean;
 }
 
@@ -35,38 +35,37 @@ export interface RenderInternalOptions extends RenderOptions {
 
 export function renderInternal<T>(
   component: React.ReactElement<T>,
-  {
+  options?: RenderInternalOptions,
+) {
+  const {
     wrapper: Wrapper,
-    createNodeMock,
-    unstable_validateStringsRenderedWithinText,
     detectHostComponentNames = true,
-  }: RenderInternalOptions = {},
-) {
+    unstable_validateStringsRenderedWithinText,
+    ...testRendererOptions
+  } = options || {};
+
   if (detectHostComponentNames) {
     configureHostComponentNamesIfNeeded();
   }
 
   if (unstable_validateStringsRenderedWithinText) {
     return renderWithStringValidation(component, {
       wrapper: Wrapper,
-      createNodeMock,
+      ...testRendererOptions,
     });
   }
 
   const wrap = (element: React.ReactElement) => (Wrapper ? <Wrapper>{element}</Wrapper> : element);
-
-  const renderer = renderWithAct(wrap(component), createNodeMock ? { createNodeMock } : undefined);
-
+  const renderer = renderWithAct(wrap(component), testRendererOptions);
   return buildRenderResult(renderer, wrap);
 }
 
 function renderWithStringValidation<T>(
   component: React.ReactElement<T>,
-  {
-    wrapper: Wrapper,
-    createNodeMock,
-  }: Omit<RenderOptions, 'unstable_validateStringsRenderedWithinText'> = {},
+  options: Omit<RenderOptions, 'unstable_validateStringsRenderedWithinText'> = {},
 ) {
+  const { wrapper: Wrapper, ...testRendererOptions } = options ?? {};
+
   const handleRender: React.ProfilerProps['onRender'] = (_, phase) => {
     if (phase === 'update') {
       validateStringsRenderedWithinText(screen.toJSON());
@@ -79,7 +78,7 @@ function renderWithStringValidation<T>(
     </Profiler>
   );
 
-  const renderer = renderWithAct(wrap(component), createNodeMock ? { createNodeMock } : undefined);
+  const renderer = renderWithAct(wrap(component), testRendererOptions);
   validateStringsRenderedWithinText(renderer.toJSON());
 
   return buildRenderResult(renderer, wrap);

typings/index.flow.js

@@ -348,6 +348,9 @@ declare module '@testing-library/react-native' {
     wrapper?: React.ComponentType<any>;
     createNodeMock?: (element: React.Element<any>) => any;
     unstable_validateStringsRenderedWithinText?: boolean;
+    unstable_isConcurrent?: boolean;
+    unstable_strictMode?: boolean;
+    unstable_concurrentUpdatesByDefault?: boolean;
   }
 
   declare export var render: (

website/docs/Render.md

@@ -38,7 +38,7 @@ This option allows you to wrap the tested component, passed as the first option
 #### `createNodeMock` option
 
 ```ts
-createNodeMock?: (element: React.Element<any>) => any,
+createNodeMock?: (element: React.Element) => unknown,
 ```
 
 This option allows you to pass `createNodeMock` option to `ReactTestRenderer.create()` method in order to allow for custom mock refs. You can learn more about this option from [React Test Renderer documentation](https://reactjs.org/docs/test-renderer.html#ideas).