RN: Flowify packages/rn-tester (#51788)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/51788

Adds `flow` to the remaining files that are lacking it in the `packages/rn-tester` directory.

This also adds any necessary type annotations and fixes lint warnings.

Changelog:
[Internal]

Reviewed By: SamChou19815

Differential Revision: D75899307

fbshipit-source-id: 27a74ed0007b3b754446a45931c2c148312d5e3a

.eslintrc.js

@@ -27,6 +27,7 @@ module.exports = {
       files: ['*.js', '*.js.flow', '*.jsx'],
       parser: 'hermes-eslint',
       rules: {
+        'no-void': 0,
         // These rules are not required with hermes-eslint
         'ft-flow/define-flow-type': 0,
         'ft-flow/use-flow-type': 0,

packages/community-cli-plugin/src/commands/start/OpenDebuggerKeyboardHandler.js

@@ -92,7 +92,6 @@ export default class OpenDebuggerKeyboardHandler {
         this.#clearTerminalMenu();
       } else if (targets.length === 1) {
         const target = targets[0];
-        // eslint-disable-next-line no-void
         void this.#tryOpenDebuggerForTarget(target);
       } else {
         this.#targetsShownForSelection = targets;
@@ -135,7 +134,6 @@ export default class OpenDebuggerKeyboardHandler {
         targetIndex < this.#targetsShownForSelection.length
       ) {
         const target = this.#targetsShownForSelection[targetIndex];
-        // eslint-disable-next-line no-void
         void this.#tryOpenDebuggerForTarget(target);
         return true;
       }

packages/community-cli-plugin/src/commands/start/attachKeyHandlers.js

@@ -95,7 +95,6 @@ export default function attachKeyHandlers({
         messageSocket.broadcast('devMenu', null);
         break;
       case 'j':
-        // eslint-disable-next-line no-void
         void openDebuggerKeyboardHandler.handleOpenDebugger();
         break;
       case CTRL_C:

packages/dev-middleware/src/__tests__/InspectorDeviceUtils.js

@@ -148,7 +148,6 @@ export class DeviceMock extends DeviceAgent {
       return;
     }
     if (maybePayload instanceof Promise) {
-      // eslint-disable-next-line no-void
       void maybePayload.then(payload => {
         if (!payload) {
           return;

packages/dev-middleware/src/utils/DefaultBrowserLauncher.js

@@ -8,8 +8,6 @@
  * @format
  */
 
-import type {BrowserLauncher} from '../types/BrowserLauncher';
-
 const {spawn} = require('child_process');
 const ChromeLauncher = require('chrome-launcher');
 const {Launcher: EdgeLauncher} = require('chromium-edge-launcher');

packages/polyfills/console.js

@@ -11,7 +11,7 @@
 
 'use client';
 
-/* eslint-disable no-shadow, eqeqeq, no-unused-vars, no-void, no-control-regex  */
+/* eslint-disable no-shadow, eqeqeq, no-unused-vars, no-control-regex  */
 
 /**
  * This pipes all of our console logging functions to native logging so that

packages/react-native/scripts/ios-prebuild.js

@@ -177,6 +177,5 @@ async function main() {
 }
 
 if (require.main === module) {
-  // eslint-disable-next-line no-void
   void main();
 }

packages/rn-tester/IntegrationTests/LoggingTestModule.js

@@ -4,38 +4,34 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @flow strict-local
  * @format
  */
 
-'use strict';
-
-const invariant = require('invariant');
-const BatchedBridge =
-  require('react-native/Libraries/BatchedBridge/BatchedBridge').default;
+import invariant from 'invariant';
+import BatchedBridge from 'react-native/Libraries/BatchedBridge/BatchedBridge';
 
 const LoggingTestModule = {
-  logToConsole: function (str) {
-    console.log(str);
+  logToConsole(message: string): void {
+    console.log(message);
   },
-  logToConsoleAfterWait: function (str, timeout_ms) {
+  logToConsoleAfterWait(message: string, delay: number): void {
     setTimeout(function () {
-      console.log(str);
-    }, timeout_ms);
+      console.log(message);
+    }, delay);
   },
-  warning: function (str) {
-    console.warn(str);
+  warning(message: string): void {
+    console.warn(message);
   },
-  invariant: function (str) {
-    invariant(false, str);
+  invariant(message: string): void {
+    invariant(false, message);
   },
-  logErrorToConsole: function (str) {
-    console.error(str);
+  logErrorToConsole(message: string): void {
+    console.error(message);
   },
-  throwError: function (str) {
-    throw new Error(str);
+  throwError(message: string): void {
+    throw new Error(message);
   },
 };
 
 BatchedBridge.registerCallableModule('LoggingTestModule', LoggingTestModule);
-
-module.exports = LoggingTestModule;

packages/rn-tester/RNTesterUnitTests/RNTesterUnitTestsBundle.js

@@ -4,14 +4,6 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @flow strict
  * @format
  */
-
-'use strict';
-
-// eslint-disable-next-line no-unused-vars
-const __fbBatchedBridge = {
-  flushedQueue: function () {
-    return null;
-  },
-};

packages/rn-tester/js/examples/BoxShadow/BoxShadowExample.js

@@ -4,13 +4,12 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @flow strict-local
  * @format
  */
 
-'use strict';
-
-const React = require('react');
-const {Image, StyleSheet, View} = require('react-native');
+import * as React from 'react';
+import {Image, StyleSheet, View} from 'react-native';
 
 const styles = StyleSheet.create({
   box: {
@@ -79,28 +78,28 @@ exports.examples = [
   {
     title: 'Basic shadow',
     description: 'shadowOpacity: 0.5, shadowOffset: {2, 2}',
-    render() {
+    render(): React.Node {
       return <View style={[styles.box, styles.shadow1]} />;
     },
   },
   {
     title: 'Colored shadow',
     description: "shadowColor: 'red', shadowRadius: 0",
-    render() {
+    render(): React.Node {
       return <View style={[styles.box, styles.shadow2]} />;
     },
   },
   {
     title: 'Shaped shadow',
     description: 'borderRadius: 50',
-    render() {
+    render(): React.Node {
       return <View style={[styles.box, styles.shadow1, styles.shadowShaped]} />;
     },
   },
   {
     title: 'Image shadow',
     description: 'Image shadows are derived exactly from the pixels.',
-    render() {
+    render(): React.Node {
       return (
         <Image
           source={require('../../assets/hawk.png')}
@@ -113,7 +112,7 @@ exports.examples = [
     title: 'Child shadow',
     description:
       'For views without an opaque background color, shadow will be derived from the subviews.',
-    render() {
+    render(): React.Node {
       return (
         <View style={[styles.box, styles.shadow1, styles.shadowChild]}>
           <View style={[styles.box, styles.shadowChildBox]} />
@@ -125,10 +124,10 @@ exports.examples = [
   {
     title: 'Basic elevation',
     description: 'elevation: 1, 3, 6',
-    platform: 'android',
-    render() {
+    platform: 'android' as const,
+    render(): React.Node {
       return (
-        <View style={styles.wrapper}>
+        <View>
           <View style={[styles.box, styles.elevation1]} />
           <View style={[styles.box, styles.elevation2]} />
           <View style={[styles.box, styles.elevation3]} />
@@ -139,10 +138,10 @@ exports.examples = [
   {
     title: 'Fractional elevation',
     description: 'elevation: 0.1, 0.5, 1.5',
-    platform: 'android',
-    render() {
+    platform: 'android' as const,
+    render(): React.Node {
       return (
-        <View style={styles.wrapper}>
+        <View>
           <View style={[styles.box, {elevation: 0.1}]} />
           <View style={[styles.box, {elevation: 0.5}]} />
           <View style={[styles.box, {elevation: 1.5}]} />
@@ -153,10 +152,10 @@ exports.examples = [
   {
     title: 'Colored shadow',
     description: "shadowColor: 'red', 'blue', '#00FF0080'",
-    platform: 'android',
-    render() {
+    platform: 'android' as const,
+    render(): React.Node {
       return (
-        <View style={styles.wrapper}>
+        <View>
           <View style={[styles.box, styles.elevation1, styles.shadowColor1]} />
           <View style={[styles.box, styles.elevation2, styles.shadowColor2]} />
           <View style={[styles.box, styles.elevation3, styles.shadowColor3]} />
@@ -167,10 +166,10 @@ exports.examples = [
   {
     title: 'Shaped shadow',
     description: 'borderRadius: 50',
-    platform: 'android',
-    render() {
+    platform: 'android' as const,
+    render(): React.Node {
       return (
-        <View style={styles.wrapper}>
+        <View>
           <View style={[styles.box, styles.elevation1, styles.shadowShaped]} />
           <View style={[styles.box, styles.elevation2, styles.shadowShaped]} />
           <View style={[styles.box, styles.elevation3, styles.shadowShaped]} />
@@ -181,10 +180,10 @@ exports.examples = [
   {
     title: 'Borders',
     description: 'borderWidth: 5',
-    platform: 'android',
-    render() {
+    platform: 'android' as const,
+    render(): React.Node {
       return (
-        <View style={styles.wrapper}>
+        <View>
           <View style={[styles.box, styles.elevation1, styles.border]} />
           <View style={[styles.box, styles.elevation2, styles.border]} />
           <View style={[styles.box, styles.elevation3, styles.border]} />

packages/rn-tester/js/examples/Cursor/CursorExample.js

@@ -4,13 +4,12 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @flow strict-local
  * @format
  */
 
-'use strict';
-
-const React = require('react');
-const {StyleSheet, Text, View} = require('react-native');
+import * as React from 'react';
+import {StyleSheet, Text, View} from 'react-native';
 
 const styles = StyleSheet.create({
   invisibleBox: {
@@ -52,7 +51,7 @@ const styles = StyleSheet.create({
   },
 });
 
-function CursorExampleAuto() {
+function CursorExampleAuto(): React.Node {
   return (
     <View style={styles.row}>
       <View style={styles.box} />
@@ -65,7 +64,7 @@ function CursorExampleAuto() {
   );
 }
 
-function CursorExamplePointer() {
+function CursorExamplePointer(): React.Node {
   return (
     <View style={styles.row}>
       <View style={[styles.box, styles.pointer]} />
@@ -78,20 +77,7 @@ function CursorExamplePointer() {
   );
 }
 
-function CursorExamplePointer() {
-  return (
-    <View style={styles.row}>
-      <View style={[styles.box, styles.pointer]} />
-      <View style={[styles.circle, styles.pointer]} />
-      <View style={[styles.halfcircle, styles.pointer]} />
-      <View style={[styles.box, styles.solid, styles.pointer]} />
-      <View style={[styles.circle, styles.solid, styles.pointer]} />
-      <View style={[styles.halfcircle, styles.solid, styles.pointer]} />
-    </View>
-  );
-}
-
-function CursorExampleViewFlattening() {
+function CursorExampleViewFlattening(): React.Node {
   return (
     <View style={styles.row}>
       <View style={[styles.invisibleBox, styles.centerContent, styles.pointer]}>

packages/rn-tester/js/examples/Linking/LinkingExample.js

@@ -4,11 +4,10 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @flow strict-local
  * @format
  */
 
-'use strict';
-
 import RNTesterBlock from '../../components/RNTesterBlock';
 import RNTesterText from '../../components/RNTesterText';
 import React from 'react';
@@ -23,28 +22,27 @@ import {
   View,
 } from 'react-native';
 
-type Props = $ReadOnly<{
-  url?: ?string,
-}>;
-
-class OpenURLButton extends React.Component<Props> {
-  handleClick = () => {
-    Linking.canOpenURL(this.props.url).then(supported => {
-      if (supported) {
-        Linking.openURL(this.props.url);
-      } else {
-        console.log(
-          `Don't know how to open URI: ${
-            this.props.url
-          }, ensure you have an app installed that handles the "${
-            this.props.url.split(':')?.[0]
-          }" scheme`,
-        );
-      }
-    });
+class OpenURLButton extends React.Component<
+  $ReadOnly<{
+    url: string,
+  }>,
+> {
+  handleClick = async () => {
+    const supported = await Linking.canOpenURL(this.props.url);
+    if (supported) {
+      void Linking.openURL(this.props.url);
+    } else {
+      console.log(
+        `Don't know how to open URI: ${
+          this.props.url
+        }, ensure you have an app installed that handles the "${
+          this.props.url.split(':')?.[0]
+        }" scheme`,
+      );
+    }
   };
 
-  render() {
+  render(): React.Node {
     return (
       <TouchableOpacity onPress={this.handleClick}>
         <View style={styles.button}>
@@ -55,17 +53,27 @@ class OpenURLButton extends React.Component<Props> {
   }
 }
 
-class OpenSettingsExample extends React.Component<Props, any> {
-  openSettings() {
-    Linking.openSettings();
-  }
+class OpenSettingsExample extends React.Component<$ReadOnly<{}>> {
+  openSettings = () => {
+    void Linking.openSettings();
+  };
 
-  render() {
+  render(): React.Node {
     return <Button onPress={this.openSettings} title={'Open Settings'} />;
   }
 }
 
-const SendIntentButton = ({action, extras}: Props) => {
+const SendIntentButton = ({
+  action,
+  extras,
+}: $ReadOnly<{
+  action: string,
+  extras?: Array<{
+    key: string,
+    value: string | number | boolean,
+    ...
+  }>,
+}>) => {
   const [isOpeningIntent, setIsOpeningIntent] = useState(false);
 
   const handleIntent = async () => {
@@ -90,8 +98,8 @@ const SendIntentButton = ({action, extras}: Props) => {
   );
 };
 
-class IntentAndroidExample extends React.Component {
-  render() {
+class IntentAndroidExample extends React.Component<$ReadOnly<{}>> {
+  render(): React.Node {
     return (
       <View>
         <View>
@@ -102,7 +110,7 @@ class IntentAndroidExample extends React.Component {
           <OpenURLButton url={'geo:37.484847,-122.148386'} />
           <OpenURLButton url={'tel:9876543210'} />
         </View>
-        {Platform.OS === 'android' && (
+        {Platform.OS === 'android' ? (
           <RNTesterBlock title="Send intents">
             <SendIntentButton action="android.intent.action.POWER_USAGE_SUMMARY" />
             <RNTesterText style={styles.textSeparator}>
@@ -118,7 +126,7 @@ class IntentAndroidExample extends React.Component {
               ]}
             />
           </RNTesterBlock>
-        )}
+        ) : null}
       </View>
     );
   }

packages/rn-tester/js/examples/RefreshControl/RefreshControlExample.js

@@ -4,11 +4,10 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @flow strict-local
  * @format
  */
 
-'use strict';
-
 import RNTesterText from '../../components/RNTesterText';
 import React from 'react';
 import {
@@ -19,6 +18,11 @@ import {
   View,
 } from 'react-native';
 
+type Data = $ReadOnly<{
+  clicks: number,
+  text: string,
+}>;
+
 const styles = StyleSheet.create({
   row: {
     borderColor: 'grey',
@@ -36,12 +40,17 @@ const styles = StyleSheet.create({
   },
 });
 
-class Row extends React.Component {
+class Row extends React.Component<
+  $ReadOnly<{
+    data: Data,
+    onClick: Data => void,
+  }>,
+> {
   _onClick = () => {
     this.props.onClick(this.props.data);
   };
 
-  render() {
+  render(): React.Node {
     return (
       <TouchableWithoutFeedback onPress={this._onClick}>
         <View style={styles.row}>
@@ -54,11 +63,20 @@ class Row extends React.Component {
   }
 }
 
-class RefreshControlExample extends React.Component {
-  state = {
+type RefreshControlExampleState = $ReadOnly<{
+  isRefreshing: boolean,
+  loaded: number,
+  rowData: $ReadOnlyArray<Data>,
+}>;
+
+class RefreshControlExample extends React.Component<
+  $ReadOnly<{}>,
+  RefreshControlExampleState,
+> {
+  state: RefreshControlExampleState = {
     isRefreshing: false,
     loaded: 0,
-    rowData: Array.from(new Array(20)).map((val, i) => ({
+    rowData: Array.from(new Array<void>(20)).map((val, i) => ({
       text: 'Initial row ' + i,
       clicks: 0,
     })),
@@ -68,14 +86,21 @@ class RefreshControlExample extends React.Component {
     this._onRefresh();
   }
 
-  _onClick = row => {
-    row.clicks++;
-    this.setState({
-      rowData: this.state.rowData,
+  _onClick = (row: Data) => {
+    this.setState(prevState => {
+      const index = prevState.rowData.indexOf(row);
+      return index < 0
+        ? null
+        : {
+            rowData: [...prevState.rowData].splice(index, 1, {
+              ...row,
+              clicks: row.clicks + 1,
+            }),
+          };
     });
   };
 
-  render() {
+  render(): React.Node {
     const rows = this.state.rowData.map((row, ii) => {
       return <Row key={ii} data={row} onClick={this._onClick} />;
     });
@@ -102,7 +127,7 @@ class RefreshControlExample extends React.Component {
     this.setState({isRefreshing: true});
     setTimeout(() => {
       // prepend 10 items
-      const rowData = Array.from(new Array(10))
+      const rowData = Array.from(new Array<void>(10))
         .map((val, i) => ({
           text: 'Loaded row ' + (+this.state.loaded + i),
           clicks: 0,

packages/rn-tester/js/examples/ScrollView/ScrollViewIndicatorInsetsIOSExample.js

@@ -4,11 +4,10 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @flow strict-local
  * @format
  */
 
-'use strict';
-
 import * as React from 'react';
 import {useState} from 'react';
 import {
@@ -22,7 +21,7 @@ import {
   useWindowDimensions,
 } from 'react-native';
 
-export function ScrollViewIndicatorInsetsExample() {
+function ScrollViewIndicatorInsetsExample(): React.Node {
   const [
     automaticallyAdjustsScrollIndicatorInsets,
     setAutomaticallyAdjustsScrollIndicatorInsets,
@@ -73,7 +72,7 @@ export function ScrollViewIndicatorInsetsExample() {
                 <Text style={styles.code}>
                   automaticallyAdjustsScrollIndicatorInsets
                 </Text>{' '}
-                is {automaticallyAdjustsScrollIndicatorInsets + ''}
+                is {String(automaticallyAdjustsScrollIndicatorInsets)}
               </Text>
               <Switch
                 onValueChange={v =>

packages/rn-tester/js/examples/ScrollView/ScrollViewKeyboardInsetsIOSExample.js

@@ -4,11 +4,10 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @flow strict-local
  * @format
  */
 
-'use strict';
-
 import * as React from 'react';
 import {useState} from 'react';
 import {
@@ -21,7 +20,7 @@ import {
   View,
 } from 'react-native';
 
-export function ScrollViewKeyboardInsetsExample() {
+function ScrollViewKeyboardInsetsExample(): React.Node {
   const [
     automaticallyAdjustKeyboardInsets,
     setAutomaticallyAdjustKeyboardInsets,
@@ -34,11 +33,14 @@ export function ScrollViewKeyboardInsetsExample() {
     style: heightRestricted && styles.scrollViewHeightRestricted,
     contentContainerStyle: styles.scrollViewContent,
     automaticallyAdjustKeyboardInsets: automaticallyAdjustKeyboardInsets,
-    keyboardDismissMode: 'interactive',
+    keyboardDismissMode: 'interactive' as const,
   };
 
   const data = [...Array(20).keys()];
-  const renderItem = ({item, index}) => {
+  const renderItem = ({
+    item,
+    index,
+  }: $ReadOnly<{item: number, index: number, ...}>) => {
     const largeInput = index % 5 === 4;
     return (
       <View key={item} style={styles.textInputRow}>
@@ -56,7 +58,7 @@ export function ScrollViewKeyboardInsetsExample() {
       <View style={styles.controlRow}>
         <Text>
           <Text style={styles.code}>automaticallyAdjustKeyboardInsets</Text> is{' '}
-          {automaticallyAdjustKeyboardInsets + ''}
+          {String(automaticallyAdjustKeyboardInsets)}
         </Text>
         <Switch
           onValueChange={v => setAutomaticallyAdjustKeyboardInsets(v)}
@@ -66,7 +68,7 @@ export function ScrollViewKeyboardInsetsExample() {
       </View>
       <View style={styles.controlRow}>
         <Text>
-          <Text style={styles.code}>FlatList</Text> is {flatList + ''}
+          <Text style={styles.code}>FlatList</Text> is {String(flatList)}
         </Text>
         <Switch
           onValueChange={v => setFlatList(v)}
@@ -77,7 +79,7 @@ export function ScrollViewKeyboardInsetsExample() {
       {flatList && (
         <View style={styles.controlRow}>
           <Text>
-            <Text style={styles.code}>inverted</Text> is {inverted + ''}
+            <Text style={styles.code}>inverted</Text> is {String(inverted)}
           </Text>
           <Switch
             onValueChange={v => setInverted(v)}
@@ -89,7 +91,7 @@ export function ScrollViewKeyboardInsetsExample() {
       <View style={styles.controlRow}>
         <Text>
           <Text style={styles.code}>HeightRestricted</Text> is{' '}
-          {heightRestricted + ''}
+          {String(heightRestricted)}
         </Text>
         <Switch
           onValueChange={v => setHeightRestricted(v)}

packages/rn-tester/js/examples/Snapshot/SnapshotViewIOS.android.js

@@ -4,10 +4,8 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @flow strict-local
  * @format
  */
 
-'use strict';
-
-module.exports =
-  require('react-native/Libraries/Components/UnimplementedViews/UnimplementedView').default;
+export {default} from 'react-native/Libraries/Components/UnimplementedViews/UnimplementedView';

packages/rn-tester/js/examples/WebSocket/WebSocketExample.js

@@ -4,13 +4,10 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @flow strict-local
  * @format
  */
 
-'use strict';
-
-/* eslint-env browser */
-
 import RNTesterText from '../../components/RNTesterText';
 import React from 'react';
 import {
@@ -33,8 +30,14 @@ const WS_STATES = [
   /* 3 */ 'CLOSED',
 ];
 
-class Button extends React.Component {
-  render(): React.MixedElement {
+class Button extends React.Component<
+  $ReadOnly<{
+    disabled: boolean,
+    label: string,
+    onPress: () => void,
+  }>,
+> {
+  render(): React.Node {
     const label = (
       <RNTesterText style={styles.buttonLabel}>{this.props.label}</RNTesterText>
     );
@@ -51,23 +54,37 @@ class Button extends React.Component {
   }
 }
 
-class Row extends React.Component {
-  render(): React.MixedElement {
+class Row extends React.Component<
+  $ReadOnly<{
+    children?: React.Node,
+    label: string,
+    value?: ?string,
+  }>,
+> {
+  render(): React.Node {
     return (
       <View style={styles.row}>
         <RNTesterText>{this.props.label}</RNTesterText>
-        {this.props.value ? (
+        {this.props.value == null ? null : (
           <RNTesterText>{this.props.value}</RNTesterText>
-        ) : null}
+        )}
         {this.props.children}
       </View>
     );
   }
 }
 
-class WebSocketImage extends React.Component {
+type WebSocketImageState = $ReadOnly<{
+  blob: ?Blob,
+}>;
+
+class WebSocketImage extends React.Component<
+  $ReadOnly<{url: string}>,
+  WebSocketImageState,
+> {
   ws: ?WebSocket = null;
-  state: {blob: ?Blob} = {blob: null};
+  state: WebSocketImageState = {blob: null};
+
   componentDidMount() {
     let ws = (this.ws = new WebSocket(this.props.url));
     ws.binaryType = 'blob';
@@ -84,13 +101,15 @@ class WebSocketImage extends React.Component {
       ws.send('getImage');
     };
   }
+
   componentUnmount() {
     if (this.state.blob) {
       this.state.blob.close();
     }
     this.ws && this.ws.close();
   }
-  render() {
+
+  render(): React.Node {
     if (!this.state.blob) {
       return <View />;
     }
@@ -103,7 +122,7 @@ class WebSocketImage extends React.Component {
   }
 }
 
-function showValue(value) {
+function showValue(value: $FlowFixMe): string {
   if (value === undefined || value === null) {
     return '(no value)';
   }
@@ -117,7 +136,7 @@ function showValue(value) {
   return value;
 }
 
-type State = {
+type WebSocketExampleState = {
   url: string,
   httpUrl: string,
   fetchStatus: ?string,
@@ -128,8 +147,11 @@ type State = {
   outgoingMessage: string,
 };
 
-class WebSocketExample extends React.Component<any, any, State> {
-  state: State = {
+class WebSocketExample extends React.Component<
+  $ReadOnly<{}>,
+  WebSocketExampleState,
+> {
+  state: WebSocketExampleState = {
     url: DEFAULT_WS_URL,
     httpUrl: DEFAULT_HTTP_URL,
     fetchStatus: null,
@@ -157,11 +179,13 @@ class WebSocketExample extends React.Component<any, any, State> {
   };
 
   _onSocketEvent = (event: MessageEvent) => {
-    const state: any = {
+    const state: Partial<WebSocketExampleState> = {
+      // $FlowFixMe[prop-missing]
       socketState: event.target.readyState,
       lastSocketEvent: event.type,
     };
     if (event.type === 'message') {
+      // $FlowFixMe[incompatible-type]
       state.lastMessage = event.data;
     }
     this.setState(state);
@@ -179,7 +203,7 @@ class WebSocketExample extends React.Component<any, any, State> {
     this.setState({
       fetchStatus: 'fetching',
     });
-    fetch(this.state.httpUrl).then(response => {
+    void fetch(this.state.httpUrl).then(response => {
       if (response.status >= 200 && response.status < 400) {
         this.setState({
           fetchStatus: 'OK',
@@ -196,17 +220,17 @@ class WebSocketExample extends React.Component<any, any, State> {
     ) {
       return;
     }
-    const {outgoingMessage} = this.state;
+    const {outgoingMessage, socket} = this.state;
     const buffer = new Uint8Array(outgoingMessage.length);
     for (let i = 0; i < outgoingMessage.length; i++) {
       buffer[i] = outgoingMessage.charCodeAt(i);
     }
-    this.state.socket.send(buffer);
+    socket.send(buffer);
     this.setState({outgoingMessage: ''});
   };
 
-  render(): React.MixedElement {
-    const socketState = WS_STATES[this.state.socketState || -1];
+  render(): React.Node {
+    const socketState = WS_STATES[this.state.socketState ?? -1];
     const canConnect =
       !this.state.socket || this.state.socket.readyState >= WebSocket.CLOSING;
     const canSend = socketState === 'OPEN';
@@ -352,7 +376,7 @@ exports.description = 'WebSocket API';
 exports.examples = [
   {
     title: 'Basic websocket',
-    render(): React.MixedElement {
+    render(): React.Node {
       return <WebSocketExample />;
     },
   },

packages/rn-tester/js/utils/RNTesterList.ios.js

@@ -8,8 +8,6 @@
  * @format
  */
 
-'use strict';
-
 import type {RNTesterModule, RNTesterModuleInfo} from '../types/RNTesterTypes';
 
 import * as RNTesterListFbInternal from './RNTesterListFbInternal';

scripts/build-types/index.js

@@ -65,6 +65,5 @@ async function main() {
 }
 
 if (require.main === module) {
-  // eslint-disable-next-line no-void
   void main();
 }

scripts/debugger-frontend/sync-and-build.js

@@ -642,6 +642,5 @@ async function createSyncDiff(
 }
 
 if (require.main === module) {
-  // eslint-disable-next-line no-void
   void main();
 }

scripts/e2e/init-project-e2e.js

@@ -293,6 +293,5 @@ module.exports = {
 };
 
 if (require.main === module) {
-  // eslint-disable-next-line no-void
   void main();
 }

scripts/monorepo/print/index.js

@@ -82,6 +82,5 @@ async function main() {
 }
 
 if (require.main === module) {
-  // eslint-disable-next-line no-void
   void main();
 }

scripts/release-testing/test-e2e-local.js

@@ -405,6 +405,5 @@ Force Quit via Activity Monitor.
 }
 
 if (require.main === module) {
-  // eslint-disable-next-line no-void
   void main();
 }

scripts/releases-ci/publish-npm.js

@@ -136,6 +136,5 @@ module.exports = {
 };
 
 if (require.main === module) {
-  // eslint-disable-next-line no-void
   void main();
 }

scripts/releases-ci/publish-updated-packages.js

@@ -152,7 +152,6 @@ function runPublish(
 }
 
 if (require.main === module) {
-  // eslint-disable-next-line no-void
   void main();
 }
 

scripts/releases/create-release-commit.js

@@ -66,6 +66,5 @@ async function main() {
 }
 
 if (require.main === module) {
-  // eslint-disable-next-line no-void
   void main();
 }

scripts/releases/prepare-ios-prebuilds.js

@@ -73,6 +73,5 @@ async function main() {
 }
 
 if (require.main === module) {
-  // eslint-disable-next-line no-void
   void main();
 }

scripts/releases/set-rn-artifacts-version.js

@@ -168,6 +168,5 @@ module.exports = {
 };
 
 if (require.main === module) {
-  // eslint-disable-next-line no-void
   void main();
 }

scripts/releases/set-version.js

@@ -105,6 +105,5 @@ module.exports = {
 };
 
 if (require.main === module) {
-  // eslint-disable-next-line no-void
   void main();
 }