feat: make Harness WS port configurable (#44)

Added webSocketPort option to rn-harness.config (default 3001). This allows configuring the Bridge Server port, enabling usage of custom ports without rebuilding the application.

Author: V3RON

.nx/version-plans/version-plan-1766951346332.md

@@ -0,0 +1,5 @@
+---
+__default__: prerelease
+---
+
+Added `webSocketPort` option to `rn-harness.config` (default 3001). This allows configuring the Bridge Server port, enabling usage of custom ports without rebuilding the application.

apps/playground/rn-harness.config.mjs

@@ -51,6 +51,7 @@ const config = {
   ],
   defaultRunner: 'android',
   bridgeTimeout: 120000,
+  webSocketPort: 3002,
 
   resetEnvironmentBetweenTestFiles: true,
   unstable__skipAlreadyIncludedModules: false,

packages/config/src/types.ts

@@ -8,6 +8,7 @@ export const ConfigSchema = z
       .min(1, 'App registry component name is required'),
     runners: z.array(z.any()).min(1, 'At least one runner is required'),
     defaultRunner: z.string().optional(),
+    webSocketPort: z.number().optional().default(3001),
     bridgeTimeout: z
       .number()
       .min(1000, 'Bridge timeout must be at least 1 second')

packages/jest/src/harness.ts

@@ -22,9 +22,11 @@ const getHarnessInternal = async (
 ): Promise<Harness> => {
   const [metroInstance, platformInstance, serverBridge] = await Promise.all([
     getMetroInstance({ projectRoot, harnessConfig: config }, signal),
-    import(platform.runner).then((module) => module.default(platform.config)),
+    import(platform.runner).then((module) =>
+      module.default(platform.config, config)
+    ),
     getBridgeServer({
-      port: 3001,
+      port: config.webSocketPort,
       timeout: config.bridgeTimeout,
     }),
   ]);

packages/metro/src/manifest.ts

@@ -3,7 +3,10 @@ import fs from 'node:fs';
 import { Config as HarnessConfig } from '@react-native-harness/config';
 
 const getManifestContent = (harnessConfig: HarnessConfig): string => {
-  return `global.RN_HARNESS = { appRegistryComponentName: '${harnessConfig.appRegistryComponentName}' };`;
+  return `global.RN_HARNESS = { 
+    appRegistryComponentName: '${harnessConfig.appRegistryComponentName}',
+    webSocketPort: ${harnessConfig.webSocketPort}
+  };`;
 };
 
 export const getHarnessManifest = (harnessConfig: HarnessConfig): string => {

packages/platform-android/package.json

@@ -18,6 +18,7 @@
   "dependencies": {
     "@react-native-harness/platforms": "workspace:*",
     "@react-native-harness/tools": "workspace:*",
+    "@react-native-harness/config": "workspace:*",
     "zod": "^3.25.67",
     "tslib": "^2.3.0"
   },

packages/platform-android/src/adb.ts

@@ -18,9 +18,10 @@ export const isAppInstalled = async (
 
 export const reversePort = async (
   adbId: string,
-  port: number
+  port: number,
+  hostPort: number = port
 ): Promise<void> => {
-  await spawn('adb', ['-s', adbId, 'reverse', `tcp:${port}`, `tcp:${port}`]);
+  await spawn('adb', ['-s', adbId, 'reverse', `tcp:${port}`, `tcp:${hostPort}`]);
 };
 
 export const stopApp = async (

packages/platform-android/src/runner.ts

@@ -3,6 +3,7 @@ import {
   AppNotInstalledError,
   HarnessPlatformRunner,
 } from '@react-native-harness/platforms';
+import { Config } from '@react-native-harness/config';
 import {
   AndroidPlatformConfigSchema,
   type AndroidPlatformConfig,
@@ -12,7 +13,8 @@ import * as adb from './adb.js';
 import { getDeviceName } from './utils.js';
 
 const getAndroidRunner = async (
-  config: AndroidPlatformConfig
+  config: AndroidPlatformConfig,
+  harnessConfig: Config
 ): Promise<HarnessPlatformRunner> => {
   const parsedConfig = AndroidPlatformConfigSchema.parse(config);
   const adbId = await getAdbId(parsedConfig.device);
@@ -33,7 +35,7 @@ const getAndroidRunner = async (
   await Promise.all([
     adb.reversePort(adbId, 8081),
     adb.reversePort(adbId, 8080),
-    adb.reversePort(adbId, 3001),
+    adb.reversePort(adbId, harnessConfig.webSocketPort),
   ]);
 
   return {

packages/runtime/src/client/getWSServer.ts

@@ -4,6 +4,7 @@ import { WS_SERVER_PORT } from '../constants.js';
 export const getWSServer = (): string => {
   const devServerUrl = getDevServerUrl();
   const hostname = devServerUrl.split('://')[1].split(':')[0];
+  const port = global.RN_HARNESS?.webSocketPort || WS_SERVER_PORT;
 
-  return `ws://${hostname}:${WS_SERVER_PORT}`;
+  return `ws://${hostname}:${port}`;
 };

packages/runtime/src/globals.ts

@@ -1,5 +1,6 @@
 export type HarnessGlobal = {
   appRegistryComponentName: string;
+  webSocketPort?: number;
 };
 
 declare global {