[noop] Typecheck react-noop-renderer against host config and renderer API

packages/react-client/flight.js

@@ -7,4 +7,11 @@
  * @flow
  */
 
+import typeof * as FlightClientAPI from './src/ReactFlightClient';
+import typeof * as HostConfig from './src/ReactFlightClientConfig';
+
 export * from './src/ReactFlightClient';
+
+// At build time, this module is wrapped as a factory function ($$$reconciler).
+// Consumers pass a host config object and get back the Flight client API.
+declare export default (hostConfig: HostConfig) => FlightClientAPI;

packages/react-client/src/forks/ReactFlightClientConfig.noop.js

@@ -0,0 +1,57 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+// This is a host config that's used for the internal `react-noop-renderer` package.
+//
+// Its API lets you pass the host config as an argument.
+// However, inside the `react-server` we treat host config as a module.
+// This file is a shim between two worlds.
+//
+// It works because the `react-server` bundle is wrapped in something like:
+//
+// module.exports = function ($$$config) {
+//   /* renderer code */
+// }
+//
+// So `$$$config` looks like a global variable, but it's
+// really an argument to a top-level wrapping function.
+
+declare const $$$config: $FlowFixMe;
+
+export opaque type ModuleLoading = mixed;
+export opaque type ServerConsumerModuleMap = mixed;
+export opaque type ServerManifest = mixed;
+export opaque type ServerReferenceId = string;
+export opaque type ClientReferenceMetadata = mixed;
+export opaque type ClientReference<T> = mixed; // eslint-disable-line no-unused-vars
+export const resolveClientReference = $$$config.resolveClientReference;
+export const resolveServerReference = $$$config.resolveServerReference;
+export const preloadModule = $$$config.preloadModule;
+export const requireModule = $$$config.requireModule;
+export const getModuleDebugInfo = $$$config.getModuleDebugInfo;
+export const dispatchHint = $$$config.dispatchHint;
+export const prepareDestinationForModule =
+  $$$config.prepareDestinationForModule;
+export const usedWithSSR = true;
+
+export opaque type Source = mixed;
+
+export opaque type StringDecoder = mixed;
+
+export const createStringDecoder = $$$config.createStringDecoder;
+export const readPartialStringChunk = $$$config.readPartialStringChunk;
+export const readFinalStringChunk = $$$config.readFinalStringChunk;
+
+export const bindToConsole = $$$config.bindToConsole;
+
+export const rendererVersion = $$$config.rendererVersion;
+export const rendererPackageName = $$$config.rendererPackageName;
+
+export const checkEvalAvailabilityOnceDev =
+  $$$config.checkEvalAvailabilityOnceDev;

packages/react-noop-renderer/src/ReactFiberConfigNoop.js

@@ -0,0 +1,33 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+export type HostContext = Object;
+
+export type TextInstance = {
+  text: string,
+  id: number,
+  parent: number,
+  hidden: boolean,
+  context: HostContext,
+};
+
+export type Instance = {
+  type: string,
+  id: number,
+  parent: number,
+  children: Array<Instance | TextInstance>,
+  text: string | null,
+  prop: any,
+  hidden: boolean,
+  context: HostContext,
+};
+
+export type PublicInstance = Instance;
+
+export type TransitionStatus = mixed;

packages/react-noop-renderer/src/ReactNoop.js

@@ -53,6 +53,7 @@ export const {
   getRoot,
   // TODO: Remove this after callers migrate to alternatives.
   unstable_runWithPriority,
+  // $FlowFixMe[signature-verification-failure]
 } = createReactNoop(
   ReactFiberReconciler, // reconciler
   true, // useMutation

packages/react-noop-renderer/src/ReactNoopFlightClient.js

@@ -14,6 +14,7 @@
  * environment.
  */
 
+import type {Thenable} from 'shared/ReactTypes';
 import type {FindSourceMapURLCallback} from 'react-client/flight';
 
 import {readModule} from 'react-noop-renderer/flight-modules';
@@ -25,6 +26,7 @@ type Source = Array<Uint8Array>;
 const decoderOptions = {stream: true};
 
 const {createResponse, createStreamState, processBinaryChunk, getRoot, close} =
+  // $FlowFixMe[prop-missing]
   ReactFlightClient({
     createStringDecoder() {
       return new TextDecoder();
@@ -44,6 +46,7 @@ const {createResponse, createStreamState, processBinaryChunk, getRoot, close} =
       return readModule(idx);
     },
     bindToConsole(methodName, args, badgeName) {
+      // $FlowFixMe[incompatible-call]
       return Function.prototype.bind.apply(
         // eslint-disable-next-line react-internal/no-production-logging
         console[methodName],
@@ -61,8 +64,10 @@ type ReadOptions = {|
 
 function read<T>(source: Source, options: ReadOptions): Thenable<T> {
   const response = createResponse(
+    // $FlowFixMe[incompatible-call]
     source,
     null,
+    // $FlowFixMe[incompatible-call]
     null,
     undefined,
     undefined,
@@ -73,12 +78,19 @@ function read<T>(source: Source, options: ReadOptions): Thenable<T> {
     true,
     undefined,
     __DEV__ && options !== undefined && options.debugChannel !== undefined
-      ? options.debugChannel.onMessage
+      ? // $FlowFixMe[incompatible-call]
+        options.debugChannel.onMessage
       : undefined,
   );
   const streamState = createStreamState(response, source);
   for (let i = 0; i < source.length; i++) {
-    processBinaryChunk(response, streamState, source[i], 0);
+    processBinaryChunk(
+      response,
+      streamState,
+      source[i],
+      // $FlowFixMe[extra-arg]
+      0,
+    );
   }
   if (options !== undefined && options.close) {
     close(response);

packages/react-noop-renderer/src/ReactNoopFlightServer.js

@@ -20,10 +20,11 @@ import {saveModule} from 'react-noop-renderer/flight-modules';
 
 import ReactFlightServer from 'react-server/flight';
 
-type Destination = Array<Uint8Array>;
+type Destination = Array<Uint8Array | string>;
 
 const textEncoder = new TextEncoder();
 
+// $FlowFixMe[prop-missing]
 const ReactNoopFlightServer = ReactFlightServer({
   scheduleMicrotask(callback: () => void) {
     callback();
@@ -81,13 +82,15 @@ function render(model: ReactClientValue, options?: Options): Destination {
   const bundlerConfig = undefined;
   const request = ReactNoopFlightServer.createRequest(
     model,
+    // $FlowFixMe[incompatible-call]
     bundlerConfig,
     options ? options.onError : undefined,
     options ? options.identifierPrefix : undefined,
     undefined,
     options ? options.startTime : undefined,
     __DEV__ && options ? options.environmentName : undefined,
     __DEV__ && options ? options.filterStackFrame : undefined,
+    // $FlowFixMe[incompatible-call]
     __DEV__ && options && options.debugChannel !== undefined,
   );
   const signal = options ? options.signal : undefined;
@@ -108,7 +111,11 @@ function render(model: ReactClientValue, options?: Options): Destination {
     };
   }
   ReactNoopFlightServer.startWork(request);
-  ReactNoopFlightServer.startFlowing(request, destination);
+  ReactNoopFlightServer.startFlowing(
+    request,
+    // $FlowFixMe[incompatible-call]
+    destination,
+  );
   return destination;
 }
 

packages/react-noop-renderer/src/ReactNoopPersistent.js

@@ -55,6 +55,7 @@ export const {
   // TODO: Remove this once callers migrate to alternatives.
   // This should only be used by React internals.
   unstable_runWithPriority,
+  // $FlowFixMe[signature-verification-failure]
 } = createReactNoop(
   ReactFiberReconciler, // reconciler
   false, // useMutation

packages/react-noop-renderer/src/ReactNoopServer.js

@@ -40,12 +40,12 @@ type SuspenseInstance = {
 };
 
 type Placeholder = {
-  parent: Instance | SuspenseInstance,
+  parent: Instance | Segment | SuspenseInstance,
   index: number,
 };
 
 type Segment = {
-  children: null | Instance | TextInstance | SuspenseInstance,
+  children: Array<Instance | TextInstance | SuspenseInstance>,
 };
 
 type Destination = {
@@ -79,6 +79,7 @@ function write(destination: Destination, buffer: Uint8Array): void {
   stack.push(instance);
 }
 
+// $FlowFixMe[prop-missing]
 const ReactNoopServer = ReactFizzServer({
   scheduleMicrotask(callback: () => void) {
     callback();
@@ -175,6 +176,7 @@ const ReactNoopServer = ReactFizzServer({
     destination: Destination,
     renderState: RenderState,
     id: number,
+    // $FlowFixMe[incompatible-return]
   ): boolean {
     const parent = destination.stack[destination.stack.length - 1];
     destination.placeholders.set(id, {
@@ -258,7 +260,7 @@ const ReactNoopServer = ReactFizzServer({
     formatContext: null,
     id: number,
   ): boolean {
-    const segment = {
+    const segment: Segment = {
       children: [],
     };
     destination.segments.set(id, segment);
@@ -314,6 +316,7 @@ const ReactNoopServer = ReactFizzServer({
     renderState: RenderState,
     boundary: SuspenseInstance,
   ): boolean {
+    // $FlowFixMe[prop-missing]
     boundary.status = 'client-render';
     return true;
   },
@@ -357,6 +360,7 @@ type Options = {
 };
 
 function render(children: React$Element<any>, options?: Options): Destination {
+  // $FlowFixMe[prop-missing]
   const destination: Destination = {
     root: null,
     placeholders: new Map(),
@@ -368,15 +372,19 @@ function render(children: React$Element<any>, options?: Options): Destination {
   };
   const request = ReactNoopServer.createRequest(
     children,
+    // $FlowFixMe[incompatible-call]
     null,
+    // $FlowFixMe[incompatible-call]
     null,
+    // $FlowFixMe[incompatible-call]
     null,
     options ? options.progressiveChunkSize : undefined,
     options ? options.onError : undefined,
     options ? options.onAllReady : undefined,
     options ? options.onShellReady : undefined,
   );
   ReactNoopServer.startWork(request);
+  // $FlowFixMe[incompatible-call]
   ReactNoopServer.startFlowing(request, destination);
   return destination;
 }