chore: remove redundant string validation feature

Author: mdjastrzebski

src/__tests__/render-string-validation.test.tsx

@@ -24,19 +24,13 @@ afterEach(() => {
 });
 
 test('should throw when rendering a string outside a text component', () => {
-  expect(() =>
-    render(<View>hello</View>, {
-      unstable_validateStringsRenderedWithinText: true,
-    }),
-  ).toThrow(
+  expect(() => render(<View>hello</View>)).toThrow(
     `${VALIDATION_ERROR}. Detected attempt to render "hello" string within a <View> component.`,
   );
 });
 
 test('should throw an error when rerendering with text outside of Text component', () => {
-  render(<View />, {
-    unstable_validateStringsRenderedWithinText: true,
-  });
+  render(<View />);
 
   expect(() => screen.rerender(<View>hello</View>)).toThrow(
     `${VALIDATION_ERROR}. Detected attempt to render "hello" string within a <View> component.`,
@@ -58,9 +52,7 @@ const InvalidTextAfterPress = () => {
 };
 
 test('should throw an error when strings are rendered outside Text', () => {
-  render(<InvalidTextAfterPress />, {
-    unstable_validateStringsRenderedWithinText: true,
-  });
+  render(<InvalidTextAfterPress />);
 
   expect(() => fireEvent.press(screen.getByText('Show text'))).toThrow(
     `${VALIDATION_ERROR}. Detected attempt to render "text rendered outside text component" string within a <View> component.`,
@@ -73,23 +65,17 @@ test('should not throw for texts nested in fragments', () => {
       <Text>
         <>hello</>
       </Text>,
-      { unstable_validateStringsRenderedWithinText: true },
     ),
   ).not.toThrow();
 });
 
-// test('should not throw if option validateRenderedString is false', () => {
-//   expect(() => render(<View>hello</View>)).not.toThrow();
-// });
-
 test(`should throw when one of the children is a text and the parent is not a Text component`, () => {
   expect(() =>
     render(
       <View>
         <Text>hello</Text>
         hello
       </View>,
-      { unstable_validateStringsRenderedWithinText: true },
     ),
   ).toThrow(
     `${VALIDATION_ERROR}. Detected attempt to render "hello" string within a <View> component.`,
@@ -102,17 +88,14 @@ test(`should throw when a string is rendered within a fragment rendered outside
       <View>
         <>hello</>
       </View>,
-      { unstable_validateStringsRenderedWithinText: true },
     ),
   ).toThrow(
     `${VALIDATION_ERROR}. Detected attempt to render "hello" string within a <View> component.`,
   );
 });
 
 test('should throw if a number is rendered outside a text', () => {
-  expect(() =>
-    render(<View>0</View>, { unstable_validateStringsRenderedWithinText: true }),
-  ).toThrow(
+  expect(() => render(<View>0</View>)).toThrow(
     `${VALIDATION_ERROR}. Detected attempt to render "0" string within a <View> component.`,
   );
 });
@@ -125,7 +108,6 @@ test('should throw with components returning string value not rendered in Text',
       <View>
         <Trans i18nKey="hello" />
       </View>,
-      { unstable_validateStringsRenderedWithinText: true },
     ),
   ).toThrow(
     `${VALIDATION_ERROR}. Detected attempt to render "hello" string within a <View> component.`,
@@ -138,7 +120,6 @@ test('should not throw with components returning string value rendered in Text',
       <Text>
         <Trans i18nKey="hello" />
       </Text>,
-      { unstable_validateStringsRenderedWithinText: true },
     ),
   ).not.toThrow();
 });
@@ -149,7 +130,6 @@ test('should throw when rendering string in a View in a Text', () => {
       <Text>
         <View>hello</View>
       </Text>,
-      { unstable_validateStringsRenderedWithinText: true },
     ),
   ).toThrow(
     `${VALIDATION_ERROR}. Detected attempt to render "hello" string within a <View> component.`,
@@ -175,7 +155,7 @@ const UseEffectComponent = () => {
 };
 
 test('should render immediate setState in useEffect properly', async () => {
-  render(<UseEffectComponent />, { unstable_validateStringsRenderedWithinText: true });
+  render(<UseEffectComponent />);
 
   expect(await screen.findByText('Text is visible')).toBeTruthy();
 });
@@ -195,9 +175,7 @@ const InvalidUseEffectComponent = () => {
 };
 
 test('should throw properly for immediate setState in useEffect', () => {
-  expect(() =>
-    render(<InvalidUseEffectComponent />, { unstable_validateStringsRenderedWithinText: true }),
-  ).toThrow(
+  expect(() => render(<InvalidUseEffectComponent />)).toThrow(
     `${VALIDATION_ERROR}. Detected attempt to render "Text is visible" string within a <View> component.`,
   );
 });

src/helpers/string-validation.ts

@@ -1,12 +1,10 @@
 import * as React from 'react';
-import { Profiler } from 'react';
 import act from './act';
 import { addToCleanupQueue } from './cleanup';
 import { getConfig } from './config';
 import debugDeep, { DebugOptions } from './helpers/debug-deep';
 import debugShallow from './helpers/debug-shallow';
 import { configureHostComponentNamesIfNeeded } from './helpers/host-component-names';
-import { validateStringsRenderedWithinText } from './helpers/string-validation';
 import { HostElement } from './renderer/host-element';
 import { RenderResult as RendererResult } from './renderer/renderer';
 import { renderWithAct } from './render-act';
@@ -16,7 +14,6 @@ import { getQueriesForElement } from './within';
 export interface RenderOptions {
   wrapper?: React.ComponentType<any>;
   createNodeMock?: (element: React.ReactElement) => unknown;
-  unstable_validateStringsRenderedWithinText?: boolean;
 }
 
 export type RenderResult = ReturnType<typeof render>;
@@ -37,55 +34,17 @@ export function renderInternal<T>(
   component: React.ReactElement<T>,
   options?: RenderInternalOptions,
 ) {
-  const {
-    wrapper: Wrapper,
-    detectHostComponentNames = true,
-    unstable_validateStringsRenderedWithinText,
-    ...restOptions
-  } = options || {};
+  const { wrapper: Wrapper, detectHostComponentNames = true, ...restOptions } = options || {};
 
   if (detectHostComponentNames) {
     configureHostComponentNamesIfNeeded();
   }
 
-  if (unstable_validateStringsRenderedWithinText) {
-    return renderWithStringValidation(component, {
-      wrapper: Wrapper,
-      ...restOptions,
-    });
-  }
-
   const wrap = (element: React.ReactElement) => (Wrapper ? <Wrapper>{element}</Wrapper> : element);
   const renderer = renderWithAct(wrap(component), restOptions);
   return buildRenderResult(renderer, wrap);
 }
 
-function renderWithStringValidation<T>(
-  component: React.ReactElement<T>,
-  options: Omit<RenderOptions, 'unstable_validateStringsRenderedWithinText'> = {},
-) {
-  let renderer: RendererResult;
-  const { wrapper: Wrapper, ...testRendererOptions } = options ?? {};
-
-  const handleRender: React.ProfilerOnRenderCallback = (_, phase) => {
-    if (renderer && phase === 'update') {
-      validateStringsRenderedWithinText(renderer.toJSON());
-    }
-  };
-
-  const wrap = (element: React.ReactElement) => (
-    <Profiler id="renderProfiler" onRender={handleRender}>
-      {Wrapper ? <Wrapper>{element}</Wrapper> : element}
-    </Profiler>
-  );
-
-  renderer = renderWithAct(wrap(component), testRendererOptions);
-
-  validateStringsRenderedWithinText(renderer.toJSON());
-
-  return buildRenderResult(renderer, wrap);
-}
-
 function buildRenderResult(
   renderer: RendererResult,
   wrap: (element: React.ReactElement) => JSX.Element,

src/render.tsx

@@ -55,10 +55,10 @@ declare type A11yRole =
 
 declare type A11yState = {|
   disabled?: boolean,
-  selected?: boolean,
-  checked?: boolean | 'mixed',
-  busy?: boolean,
-  expanded?: boolean,
+    selected ?: boolean,
+    checked ?: boolean | 'mixed',
+    busy ?: boolean,
+    expanded ?: boolean,
 |};
 
 declare type A11yValue = {
@@ -347,7 +347,6 @@ declare module '@testing-library/react-native' {
   declare interface RenderOptions {
     wrapper?: React.ComponentType<any>;
     createNodeMock?: (element: React.Element<any>) => any;
-    unstable_validateStringsRenderedWithinText?: boolean;
     unstable_isConcurrent?: boolean;
     unstable_strictMode?: boolean;
     unstable_concurrentUpdatesByDefault?: boolean;