Add multi-session support to Device.js (facebook#55237)

Summary:

Adds multi-session support to the Node side of the inspector-proxy protocol implementation. The protocol now has an explicit `sessionId` property in all relevant messages.

Multi-session support is fully backwards compatible:

* An app that does not report itself as multi-session capable will get the old proxy behaviour.
* If the `enableStandaloneFuseboxShell` experiment flag is disabled by the integrator/framework, we automatically disable multi-session support, too. This is to guarantee that we continue to have at most one active RNDT window/tab open per app. (The standalone shell guarantees this independently of the proxy, while the old browser-based flow requires the proxy to keep enforcing the single-session UX.)

Changelog: [General][Added] Support multiple CDP connections to one React Native Host (diff 2 of 2)

Reviewed By: robhogan

Differential Revision: D90174643

Author: motiz88

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

@@ -16,7 +16,7 @@ import type {
   JSONSerializable,
   MessageFromDevice,
   MessageToDevice,
-  WrappedEvent,
+  WrappedEventToDevice,
 } from '../inspector-proxy/types';
 
 import nullthrows from 'nullthrows';
@@ -106,9 +106,14 @@ export class DeviceMock extends DeviceAgent {
     | Promise<GetPagesResponse['payload'] | void>
     | void,
   > = jest.fn();
-  +wrappedEvent: JestMockFn<[message: WrappedEvent], void> = jest.fn();
+  +wrappedEvent: JestMockFn<[message: WrappedEventToDevice], void> = jest.fn();
   +wrappedEventParsed: JestMockFn<
-    [payload: {...WrappedEvent['payload'], wrappedEvent: JSONSerializable}],
+    [
+      payload: {
+        ...WrappedEventToDevice['payload'],
+        wrappedEvent: JSONSerializable,
+      },
+    ],
     void,
   > = jest.fn();
 

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

@@ -81,13 +81,15 @@ export async function sendFromDebuggerToTarget<Message: CdpMessageToTarget>(
   device: DeviceMock,
   pageId: string,
   message: Message,
+  {sessionId}: {sessionId?: string} = {},
 ): Promise<Message> {
   const originalEventCallsArray = device.wrappedEventParsed.mock.calls;
   const originalEventCallCount = originalEventCallsArray.length;
   debugger_.send(message);
   await until(() =>
     expect(device.wrappedEventParsed).toBeCalledWith({
       pageId,
+      sessionId: sessionId ?? expect.any(String),
       wrappedEvent: expect.objectContaining({id: message.id}),
     }),
   );
@@ -125,9 +127,10 @@ export async function createAndConnectTarget(
     deviceId?: ?string,
     deviceHostHeader?: ?string,
   }> = {},
-): Promise<{device: DeviceMock, debugger_: DebuggerMock}> {
+): Promise<{device: DeviceMock, debugger_: DebuggerMock, sessionId: string}> {
   let device;
   let debugger_;
+  let sessionId;
   try {
     device = await createDeviceMock(
       `${serverRef.serverBaseWsUrl}/inspector/device?device=${
@@ -149,16 +152,26 @@ export async function createAndConnectTarget(
     const [{webSocketDebuggerUrl}] = pageList;
     expect(webSocketDebuggerUrl).toBeDefined();
 
+    const originalConnectCallsArray = device.connect.mock.calls;
+    const originalConnectCallCount = originalConnectCallsArray.length;
     debugger_ = await createDebuggerMock(
       webSocketDebuggerUrl,
       signal,
       debuggerHeaders,
     );
     await until(() => expect(device.connect).toBeCalled());
+    // Find the first connect call that wasn't already in the mock calls array
+    // before we connected the debugger.
+    const newConnectCalls =
+      originalConnectCallsArray === device.connect.mock.calls
+        ? device.connect.mock.calls.slice(originalConnectCallCount)
+        : device.connect.mock.calls;
+    const [[{payload}]] = newConnectCalls;
+    sessionId = payload.sessionId;
   } catch (e) {
     device?.close();
     debugger_?.close();
     throw e;
   }
-  return {device, debugger_};
+  return {device, debugger_, sessionId};
 }

packages/dev-middleware/src/__tests__/InspectorProxyCdpRewritingHacks-test.js

@@ -566,7 +566,7 @@ describe.each(['HTTP', 'HTTPS'])(
 
       describe('Debugger.getScriptSource', () => {
         test('should forward request directly to device (does not read source from disk in proxy)', async () => {
-          const {device, debugger_} = await createAndConnectTarget(
+          const {device, debugger_, sessionId} = await createAndConnectTarget(
             serverRef,
             autoCleanup.signal,
             pageDescription,
@@ -579,10 +579,17 @@ describe.each(['HTTP', 'HTTPS'])(
                 scriptId: 'script1',
               },
             };
-            await sendFromDebuggerToTarget(debugger_, device, 'page1', message);
+            await sendFromDebuggerToTarget(
+              debugger_,
+              device,
+              'page1',
+              message,
+              {sessionId},
+            );
 
             expect(device.wrappedEventParsed).toBeCalledWith({
               pageId: 'page1',
+              sessionId,
               wrappedEvent: message,
             });
           } finally {
@@ -594,7 +601,7 @@ describe.each(['HTTP', 'HTTPS'])(
 
       describe('Network.loadNetworkResource', () => {
         test('should forward event directly to client (does not rewrite url host)', async () => {
-          const {device, debugger_} = await createAndConnectTarget(
+          const {device, debugger_, sessionId} = await createAndConnectTarget(
             serverRef,
             autoCleanup.signal,
             pageDescription,
@@ -607,11 +614,19 @@ describe.each(['HTTP', 'HTTPS'])(
                 url: `${protocol.toLowerCase()}://10.0.2.2:${serverRef.port}`,
               },
             };
-            await sendFromDebuggerToTarget(debugger_, device, 'page1', message);
-            expect(device.wrappedEventParsed).toBeCalledWith({
-              pageId: 'page1',
-              wrappedEvent: message,
-            });
+            await sendFromDebuggerToTarget(
+              debugger_,
+              device,
+              'page1',
+              message,
+              {sessionId},
+            );
+            expect(device.wrappedEventParsed).toBeCalledWith(
+              expect.objectContaining({
+                pageId: 'page1',
+                wrappedEvent: message,
+              }),
+            );
           } finally {
             device.close();
             debugger_.close();