diff --git a/packages/rn-tester/IntegrationTests/GlobalEvalWithSourceUrlTest.js b/packages/rn-tester/IntegrationTests/GlobalEvalWithSourceUrlTest.js
index 6b1d83ed765a..3dd3a43ca128 100644
--- a/packages/rn-tester/IntegrationTests/GlobalEvalWithSourceUrlTest.js
+++ b/packages/rn-tester/IntegrationTests/GlobalEvalWithSourceUrlTest.js
@@ -12,15 +12,15 @@
import type {ExtendedError} from 'react-native/Libraries/Core/ExtendedError';
-const React = require('react');
-const ReactNative = require('react-native');
-const parseErrorStack = require('react-native/Libraries/Core/Devtools/parseErrorStack');
-const {View} = ReactNative;
+import * as React from 'react';
+import {useEffect} from 'react';
+import {NativeModules, View} from 'react-native';
+import parseErrorStack from 'react-native/Libraries/Core/Devtools/parseErrorStack';
-const {TestModule} = ReactNative.NativeModules;
+const {TestModule} = NativeModules;
-class GlobalEvalWithSourceUrlTest extends React.Component<{...}> {
- componentDidMount(): void {
+function GlobalEvalWithSourceUrlTest(): React.Node {
+ useEffect(() => {
if (typeof global.globalEvalWithSourceUrl !== 'function') {
throw new Error(
'Expected to find globalEvalWithSourceUrl function on global object but found ' +
@@ -75,13 +75,9 @@ class GlobalEvalWithSourceUrlTest extends React.Component<{...}> {
);
}
TestModule.markTestCompleted();
- }
+ }, []);
- render(): React.Node {
- return ;
- }
+ return ;
}
-GlobalEvalWithSourceUrlTest.displayName = 'GlobalEvalWithSourceUrlTest';
-
-module.exports = GlobalEvalWithSourceUrlTest;
+export default GlobalEvalWithSourceUrlTest;
diff --git a/packages/rn-tester/IntegrationTests/ImageSnapshotTest.js b/packages/rn-tester/IntegrationTests/ImageSnapshotTest.js
index 62895ae33e77..fd6ff9f7fe4a 100644
--- a/packages/rn-tester/IntegrationTests/ImageSnapshotTest.js
+++ b/packages/rn-tester/IntegrationTests/ImageSnapshotTest.js
@@ -10,33 +10,30 @@
'use strict';
-const React = require('react');
-const ReactNative = require('react-native');
-const {Image} = ReactNative;
-const {TestModule} = ReactNative.NativeModules;
+import * as React from 'react';
+import {useEffect} from 'react';
+import {Image, NativeModules} from 'react-native';
-class ImageSnapshotTest extends React.Component<{...}> {
- componentDidMount(): void {
+const {TestModule} = NativeModules;
+
+function ImageSnapshotTest(): React.Node {
+ useEffect(() => {
if (!TestModule.verifySnapshot) {
throw new Error('TestModule.verifySnapshot not defined.');
}
- }
+ }, []);
- done: (success: boolean) => void = (success: boolean) => {
+ const done = (success: boolean) => {
TestModule.markTestPassed(success);
};
- render(): React.Node {
- return (
- TestModule.verifySnapshot(this.done)}
- />
- );
- }
+ return (
+ TestModule.verifySnapshot(done)}
+ />
+ );
}
-ImageSnapshotTest.displayName = 'ImageSnapshotTest';
-
-module.exports = ImageSnapshotTest;
+export default ImageSnapshotTest;
diff --git a/packages/rn-tester/IntegrationTests/PromiseTest.js b/packages/rn-tester/IntegrationTests/PromiseTest.js
index a24963103b88..e9464d735b05 100644
--- a/packages/rn-tester/IntegrationTests/PromiseTest.js
+++ b/packages/rn-tester/IntegrationTests/PromiseTest.js
@@ -10,69 +10,77 @@
'use strict';
-const React = require('react');
-const ReactNative = require('react-native');
-const {View} = ReactNative;
-const {TestModule} = ReactNative.NativeModules;
+import * as React from 'react';
+import {useEffect, useRef} from 'react';
+import {NativeModules, View} from 'react-native';
-class PromiseTest extends React.Component<{...}> {
- shouldResolve: boolean = false;
- shouldReject: boolean = false;
- shouldSucceedAsync: boolean = false;
- shouldThrowAsync: boolean = false;
+const {TestModule} = NativeModules;
- componentDidMount() {
- // $FlowFixMe[unused-promise]
- Promise.all([
- this.testShouldResolve(),
- this.testShouldReject(),
- this.testShouldSucceedAsync(),
- this.testShouldThrowAsync(),
- ]).then(() =>
- TestModule.markTestPassed(
- this.shouldResolve &&
- this.shouldReject &&
- this.shouldSucceedAsync &&
- this.shouldThrowAsync,
- ),
- );
- }
+function PromiseTest(): React.Node {
+ const shouldResolve = useRef(false);
+ const shouldReject = useRef(false);
+ const shouldSucceedAsync = useRef(false);
+ const shouldThrowAsync = useRef(false);
- testShouldResolve: () => any = () => {
+ const testShouldResolve = () => {
return TestModule.shouldResolve()
- .then(() => (this.shouldResolve = true))
- .catch(() => (this.shouldResolve = false));
+ .then(() => {
+ shouldResolve.current = true;
+ })
+ .catch(() => {
+ shouldResolve.current = false;
+ });
};
- testShouldReject: () => any = () => {
+ const testShouldReject = () => {
return TestModule.shouldReject()
- .then(() => (this.shouldReject = false))
- .catch(() => (this.shouldReject = true));
+ .then(() => {
+ shouldReject.current = false;
+ })
+ .catch(() => {
+ shouldReject.current = true;
+ });
};
- testShouldSucceedAsync: () => Promise = async (): Promise => {
+ const testShouldSucceedAsync = async () => {
try {
await TestModule.shouldResolve();
- this.shouldSucceedAsync = true;
+ shouldSucceedAsync.current = true;
} catch (e) {
- this.shouldSucceedAsync = false;
+ shouldSucceedAsync.current = false;
}
};
- testShouldThrowAsync: () => Promise = async (): Promise => {
+ const testShouldThrowAsync = async () => {
try {
await TestModule.shouldReject();
- this.shouldThrowAsync = false;
+ shouldThrowAsync.current = false;
} catch (e) {
- this.shouldThrowAsync = true;
+ shouldThrowAsync.current = true;
}
};
- render(): React.Node {
- return ;
- }
-}
+ useEffect(() => {
+ async function runTests() {
+ await Promise.all([
+ testShouldResolve(),
+ testShouldReject(),
+ testShouldSucceedAsync(),
+ testShouldThrowAsync(),
+ ]);
-PromiseTest.displayName = 'PromiseTest';
+ TestModule.markTestPassed(
+ shouldResolve.current &&
+ shouldReject.current &&
+ shouldSucceedAsync.current &&
+ shouldThrowAsync.current,
+ );
+ }
+
+ runTests().catch(console.error);
+ }, []);
+
+ return ;
+}
-module.exports = PromiseTest;
+export default PromiseTest;
diff --git a/packages/rn-tester/IntegrationTests/SyncMethodTest.js b/packages/rn-tester/IntegrationTests/SyncMethodTest.js
index ab5166c057e4..1ee64ebe58ca 100644
--- a/packages/rn-tester/IntegrationTests/SyncMethodTest.js
+++ b/packages/rn-tester/IntegrationTests/SyncMethodTest.js
@@ -10,14 +10,14 @@
'use strict';
-const React = require('react');
-const ReactNative = require('react-native');
-const {View} = ReactNative;
+import * as React from 'react';
+import {useEffect} from 'react';
+import {NativeModules, View} from 'react-native';
-const {TestModule, RNTesterTestModule} = ReactNative.NativeModules;
+const {TestModule, RNTesterTestModule} = NativeModules;
-class SyncMethodTest extends React.Component<{...}> {
- componentDidMount(): void {
+function SyncMethodTest(): React.Node {
+ useEffect(() => {
if (
RNTesterTestModule.echoString('test string value') !== 'test string value'
) {
@@ -41,13 +41,9 @@ class SyncMethodTest extends React.Component<{...}> {
);
}
});
- }
+ }, []);
- render(): React.Node {
- return ;
- }
+ return ;
}
-SyncMethodTest.displayName = 'SyncMethodTest';
-
-module.exports = SyncMethodTest;
+export default SyncMethodTest;