feat: parse projectRoot paths

Author: jbroma

apps/tester-federation-v2/ios/Podfile.lock

@@ -1,6 +1,6 @@
 PODS:
   - boost (1.84.0)
-  - callstack-repack (5.0.6):
+  - callstack-repack (5.1.1):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -2109,12 +2109,12 @@ EXTERNAL SOURCES:
 
 SPEC CHECKSUMS:
   boost: 7e761d76ca2ce687f7cc98e698152abd03a18f90
-  callstack-repack: 0f50dfdbd14d23303ce2d7a1740219910e97e1de
+  callstack-repack: dea0d9a2ed51c0d32c0008893224c224a82de370
   DoubleConversion: cb417026b2400c8f53ae97020b2be961b59470cb
   fast_float: 06eeec4fe712a76acc9376682e4808b05ce978b6
   FBLazyVector: abbac80c6f89e71a8c55c7e92ec015c8a9496753
   fmt: a40bb5bd0294ea969aaaba240a927bd33d878cdd
-  glog: eb93e2f488219332457c3c4eafd2738ddc7e80b8
+  glog: 5683914934d5b6e4240e497e0f4a3b42d1854183
   hermes-engine: c32f2e405098bc1ebe30630a051ddce6f21d3c2e
   JWTDecode: 2eed97c2fa46ccaf3049a787004eedf0be474a87
   RCT-Folly: 36fe2295e44b10d831836cc0d1daec5f8abcf809

packages/dev-server/src/createServer.ts

@@ -126,7 +126,7 @@ export async function createServer(config: Server.Config) {
     delegate,
   });
   await instance.register(devtoolsPlugin, {
-    rootDir: options.rootDir,
+    delegate,
   });
   await instance.register(symbolicatePlugin, {
     delegate,

packages/dev-server/src/plugins/compiler/compilerPlugin.ts

@@ -21,10 +21,10 @@ async function compilerPlugin(
       },
     },
     handler: async (request, reply) => {
-      const filename = (request.params as { '*'?: string })['*'];
+      const filepath = (request.params as { '*'?: string })['*'];
       let { platform } = request.query as { platform?: string };
 
-      if (!filename) {
+      if (!filepath) {
         // This technically should never happen - this route should not be called if file is missing.
         request.log.debug('File was not provided');
         return reply.notFound('File was not provided');
@@ -49,12 +49,12 @@ async function compilerPlugin(
 
       try {
         const asset = await delegate.compiler.getAsset(
-          filename,
+          filepath,
           platform,
           sendProgress
         );
         const mimeType = delegate.compiler.getMimeType(
-          filename,
+          filepath,
           platform,
           asset
         );

packages/dev-server/src/plugins/devtools/devtoolsPlugin.ts

@@ -2,7 +2,7 @@ import type { FastifyInstance } from 'fastify';
 import fastifyPlugin from 'fastify-plugin';
 import launchEditor from 'launch-editor';
 import open from 'open';
-import { parseSourceFilename } from '../../utils/parseSourceFilename.js';
+import type { Server } from '../../types.js';
 
 interface OpenURLRequestBody {
   url: string;
@@ -21,7 +21,7 @@ function parseRequestBody<T>(body: unknown): T {
 
 async function devtoolsPlugin(
   instance: FastifyInstance,
-  { rootDir }: { rootDir: string }
+  { delegate }: { delegate: Server.Delegate }
 ) {
   // reference implementation in `@react-native-community/cli-server-api`:
   // https://github.com/react-native-community/cli/blob/46436a12478464752999d34ed86adf3212348007/packages/cli-server-api/src/openURLMiddleware.ts
@@ -42,7 +42,8 @@ async function devtoolsPlugin(
     url: '/open-stack-frame',
     handler: async (request, reply) => {
       const body = parseRequestBody<OpenStackFrameRequestBody>(request.body);
-      const filepath = parseSourceFilename(body.file, rootDir);
+      const filepath =
+        delegate.devTools?.resolveProjectPath(body.file) ?? body.file;
       launchEditor(`${filepath}:${body.lineNumber}`, process.env.REACT_EDITOR);
       reply.send('OK');
     },

packages/dev-server/src/types.ts

@@ -77,6 +77,9 @@ export namespace Server {
     /** A compiler delegate. */
     compiler: CompilerDelegate;
 
+    /** A DevTools delegate. */
+    devTools?: DevToolsDelegate;
+
     /** A symbolicator delegate. */
     symbolicator: SymbolicatorDelegate;
 
@@ -139,6 +142,19 @@ export namespace Server {
     onMessage: (log: any) => void;
   }
 
+  /**
+   * Delegate with implementation for dev tools functions.
+   */
+  export interface DevToolsDelegate {
+    /**
+     * Resolve the project filepath with [projectRoot] prefix.
+     *
+     * @param filepath The filepath to resolve.
+     * @returns The resolved project path.
+     */
+    resolveProjectPath: (filepath: string) => string;
+  }
+
   /**
    * Delegate with implementation for messages used in route handlers.
    */

packages/dev-server/src/utils/parseSourceFilename.ts

@@ -1,7 +1,8 @@
 export * from './adaptFilenameToPlatform.js';
 export * from './getMimeType.js';
+export * from './resolveProjectPath.js';
 export * from './runAdbReverse.js';
-export * from './parseFileUrl.js';
+export * from './parseUrl.js';
 export * from './resetPersistentCache.js';
 export * from './setupInteractions.js';
 export * from './setupStatsWriter.js';

packages/repack/src/commands/common/index.ts

@@ -0,0 +1,28 @@
+export function parseUrl(url: string, platforms: string[], base = 'file:///') {
+  const { pathname, searchParams } = new URL(url, base);
+
+  let path = pathname;
+  let platform = searchParams.get('platform');
+
+  if (!platform) {
+    const pathArray = pathname.split('/');
+    const platformFromPath = pathArray[1];
+
+    if (platforms.includes(platformFromPath)) {
+      platform = platformFromPath;
+      path = pathArray.slice(2).join('/');
+    }
+  }
+
+  if (!platform) {
+    const [, platformOrName, name] = path.split('.').reverse();
+    if (name !== undefined) {
+      platform = platformOrName;
+    }
+  }
+
+  return {
+    resourcePath: path.replace(/^\//, ''),
+    platform: platform || undefined,
+  };
+}

packages/repack/src/commands/common/parseFileUrl.ts

@@ -0,0 +1,19 @@
+import path from 'node:path';
+
+const projectRootPattern = /^\[projectRoot(?:\^(\d+))?\]$/;
+
+function isProjectPath(filepath: string) {
+  const root = filepath.split('/')[0];
+  return root.match(projectRootPattern);
+}
+
+// Resolve [projectRoot] and [projectRoot^N] prefixes
+export function resolveProjectPath(filepath: string, rootDir: string) {
+  const match = isProjectPath(filepath);
+  if (!match) return filepath;
+
+  const [prefix, upLevels] = match;
+  const upPath = '../'.repeat(Number(upLevels ?? 0));
+  const rootPath = path.join(rootDir, upPath);
+  return path.resolve(filepath.replace(prefix, rootPath));
+}