diff --git a/src/helpers/host-component-names.tsx b/src/helpers/host-component-names.tsx
index b6b06a008..475ba8518 100644
--- a/src/helpers/host-component-names.tsx
+++ b/src/helpers/host-component-names.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
+import * as React from 'react';
import { Text, TextInput, View } from 'react-native';
-import TestRenderer from 'react-test-renderer';
import { configureInternal, getConfig, HostComponentNames } from '../config';
+import { renderWithAct } from '../render-act';
import { getQueriesForElement } from '../within';
const userConfigErrorMessage = `There seems to be an issue with your configuration that prevents React Native Testing Library from working correctly.
@@ -29,13 +29,12 @@ export function configureHostComponentNamesIfNeeded() {
function detectHostComponentNames(): HostComponentNames {
try {
- const renderer = TestRenderer.create(
+ const renderer = renderWithAct(
Hello
);
-
const { getByTestId } = getQueriesForElement(renderer.root);
const textHostName = getByTestId('text').type;
const textInputHostName = getByTestId('textInput').type;
diff --git a/src/render-act.ts b/src/render-act.ts
new file mode 100644
index 000000000..ee7ceec74
--- /dev/null
+++ b/src/render-act.ts
@@ -0,0 +1,19 @@
+import TestRenderer from 'react-test-renderer';
+import type {
+ ReactTestRenderer,
+ TestRendererOptions,
+} from 'react-test-renderer';
+
+export function renderWithAct(
+ component: React.ReactElement,
+ options?: TestRendererOptions
+): ReactTestRenderer {
+ let renderer: ReactTestRenderer;
+
+ TestRenderer.act(() => {
+ renderer = TestRenderer.create(component, options);
+ });
+
+ // @ts-ignore act is synchronous, so renderer is already initialised here
+ return renderer;
+}
diff --git a/src/render.tsx b/src/render.tsx
index 79452fffd..11811b3f4 100644
--- a/src/render.tsx
+++ b/src/render.tsx
@@ -1,17 +1,17 @@
-import TestRenderer from 'react-test-renderer';
import type { ReactTestInstance, ReactTestRenderer } from 'react-test-renderer';
import * as React from 'react';
import { Profiler } from 'react';
import act from './act';
import { addToCleanupQueue } from './cleanup';
-import debugShallow from './helpers/debugShallow';
-import debugDeep, { DebugOptions } from './helpers/debugDeep';
-import { getQueriesForElement } from './within';
-import { setRenderResult, screen } from './screen';
-import { validateStringsRenderedWithinText } from './helpers/stringValidation';
import { getConfig } from './config';
import { getHostChildren } from './helpers/component-tree';
+import debugDeep, { DebugOptions } from './helpers/debugDeep';
+import debugShallow from './helpers/debugShallow';
import { configureHostComponentNamesIfNeeded } from './helpers/host-component-names';
+import { validateStringsRenderedWithinText } from './helpers/stringValidation';
+import { renderWithAct } from './render-act';
+import { setRenderResult, screen } from './screen';
+import { getQueriesForElement } from './within';
export type RenderOptions = {
wrapper?: React.ComponentType;
@@ -19,10 +19,6 @@ export type RenderOptions = {
unstable_validateStringsRenderedWithinText?: boolean;
};
-type TestRendererOptions = {
- createNodeMock: (element: React.ReactElement) => any;
-};
-
export type RenderResult = ReturnType;
/**
@@ -129,20 +125,6 @@ function buildRenderResult(
return result;
}
-function renderWithAct(
- component: React.ReactElement,
- options?: TestRendererOptions
-): ReactTestRenderer {
- let renderer: ReactTestRenderer;
-
- act(() => {
- renderer = TestRenderer.create(component, options);
- });
-
- // @ts-ignore act is sync, so renderer is always initialised here
- return renderer;
-}
-
function updateWithAct(
renderer: ReactTestRenderer,
wrap: (innerElement: React.ReactElement) => React.ReactElement