From ab7d2faf71982642044df7035be5cae6dabaa5d4 Mon Sep 17 00:00:00 2001 From: Jarda Snajdr Date: Fri, 17 Mar 2023 13:47:40 +0100 Subject: [PATCH 1/4] detectHostComponentNames: render test tree inside act to avoid timer leaks --- src/helpers/host-component-names.tsx | 20 ++++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/src/helpers/host-component-names.tsx b/src/helpers/host-component-names.tsx index b6b06a008..f91bc0cea 100644 --- a/src/helpers/host-component-names.tsx +++ b/src/helpers/host-component-names.tsx @@ -1,6 +1,7 @@ import React from 'react'; import { Text, TextInput, View } from 'react-native'; import TestRenderer from 'react-test-renderer'; +import type { ReactTestRenderer } from 'react-test-renderer'; import { configureInternal, getConfig, HostComponentNames } from '../config'; import { getQueriesForElement } from '../within'; @@ -29,12 +30,19 @@ export function configureHostComponentNamesIfNeeded() { function detectHostComponentNames(): HostComponentNames { try { - const renderer = TestRenderer.create( - - Hello - - - ); + const renderer = (() => { + let result: ReactTestRenderer; + TestRenderer.act(() => { + result = TestRenderer.create( + + Hello + + + ); + }); + // @ts-ignore act is sync, so renderer is always initialised here + return result; + })(); const { getByTestId } = getQueriesForElement(renderer.root); const textHostName = getByTestId('text').type; From 609625119b53baf25c5e063cb727841b13bae85b Mon Sep 17 00:00:00 2001 From: Maciej Jastrzebski Date: Thu, 23 Mar 2023 10:13:51 +0100 Subject: [PATCH 2/4] chore: tweaks --- src/helpers/host-component-names.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/helpers/host-component-names.tsx b/src/helpers/host-component-names.tsx index f91bc0cea..beb5a1d95 100644 --- a/src/helpers/host-component-names.tsx +++ b/src/helpers/host-component-names.tsx @@ -40,7 +40,8 @@ function detectHostComponentNames(): HostComponentNames { ); }); - // @ts-ignore act is sync, so renderer is always initialised here + + // @ts-ignore act is syncronous, so renderer will already be initialised here return result; })(); From 706d2c83836e0cd121bfa1225e41f6e5699df327 Mon Sep 17 00:00:00 2001 From: Maciej Jastrzebski Date: Thu, 23 Mar 2023 10:40:51 +0100 Subject: [PATCH 3/4] refactor: extract common renderWithAct function --- src/helpers/host-component-names.tsx | 26 ++++++++---------------- src/render-act.ts | 19 ++++++++++++++++++ src/render.tsx | 30 ++++++---------------------- 3 files changed, 33 insertions(+), 42 deletions(-) create mode 100644 src/render-act.ts diff --git a/src/helpers/host-component-names.tsx b/src/helpers/host-component-names.tsx index beb5a1d95..475ba8518 100644 --- a/src/helpers/host-component-names.tsx +++ b/src/helpers/host-component-names.tsx @@ -1,8 +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 type { ReactTestRenderer } 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. @@ -30,21 +29,12 @@ export function configureHostComponentNamesIfNeeded() { function detectHostComponentNames(): HostComponentNames { try { - const renderer = (() => { - let result: ReactTestRenderer; - TestRenderer.act(() => { - result = TestRenderer.create( - - Hello - - - ); - }); - - // @ts-ignore act is syncronous, so renderer will already be initialised here - return result; - })(); - + 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..4879a6ee6 --- /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 syncronous, 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 From fd1396c5de580aafcd27156e54b269a634d4614c Mon Sep 17 00:00:00 2001 From: Maciej Jastrzebski Date: Thu, 23 Mar 2023 10:44:02 +0100 Subject: [PATCH 4/4] chore: tweaks --- src/render-act.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/render-act.ts b/src/render-act.ts index 4879a6ee6..ee7ceec74 100644 --- a/src/render-act.ts +++ b/src/render-act.ts @@ -14,6 +14,6 @@ export function renderWithAct( renderer = TestRenderer.create(component, options); }); - // @ts-ignore act is syncronous, so renderer is already initialised here + // @ts-ignore act is synchronous, so renderer is already initialised here return renderer; }