Avoid undefined __dirname error when running unbuilt Playground CLI in Node.js (#2233)

## Motivation for the change, related issues

We currently use `__dirname` to resolve ICU data, but that does not work
for running unbuilt TS modules in Node.js (for example, via `npx nx
dev-node playground-cli`). In that case, we get an error that
`__dirname` not defined because the global does not exist for ES modules
in Node.

This PR fixes this so the path can be resolved by both.

cc @mho22 

## Implementation details

This PR updates the unbuilt module loader to replace uses of `__dirname`
and `__filename`. Some notes:
- `__dirname` is replaced by `import.meta.dirname` which is supported
for ES modules at least as early as Node.js 20.x.
- `__filename` is replaced by `import.meta.filename` which is supported
for ES modules at least as early as Node.js 20.x.
- This is a text-only replacement, which is fast but not as ideal as an
AST transform.
- The text-only replacement avoids replacing declarations of `__dirname`
and `__filename` because that would cause a syntax error.

This PR also removes [the conditional declarations of `__dirname` and
`__filename`](https://github.com/WordPress/wordpress-playground/blob/8ccf4e47f9d84401c8f237ae9b039060a45a0f8a/packages/php-wasm/compile/php/esm-node-boilerplate.js#L8-L21)
from `esm-node-boilerplate.js` because they are no longer needed.

## Testing Instructions (or ideally a Blueprint)

We can test this with CI.

There is a new `test-running-unbuilt-cli.sh` script for running an
unbuilt version of Playground CLI, and it is integrated in the CI
workflow as a standalone job.

Author: brandonpayton

.github/workflows/ci.yml

@@ -251,6 +251,16 @@ jobs:
                   fi
                   npm run test
 
+    test-running-unbuilt-playground-cli:
+        runs-on: ubuntu-latest
+        needs: [lint-and-typecheck]
+        steps:
+            - uses: actions/checkout@v4
+              with:
+                  submodules: true
+            - uses: ./.github/actions/prepare-playground
+            - run: packages/playground/cli/src/test/test-running-unbuilt-cli.sh
+
     build:
         runs-on: ubuntu-latest
         needs: [lint-and-typecheck]

packages/meta/src/node-es-module-loader/loader.mts

@@ -16,6 +16,13 @@ const tsconfig: TsConfig = JSON.parse(readFileSync(tsconfigPath, 'utf-8'));
 const pathAliases = tsconfig.compilerOptions.paths;
 const baseUrl = tsconfig.compilerOptions.baseUrl || '.';
 
+const playgroundPackageRoot = resolvePath(
+	import.meta.dirname,
+	'..',
+	'..',
+	'..'
+);
+
 const aliasMap = new Map<string, string>();
 for (const [alias, paths] of Object.entries(pathAliases)) {
 	// Our config is simple and doesn't use wildcards,
@@ -158,6 +165,29 @@ export async function load(
 		};
 	}
 
+	const supportedModuleFormats = ['module', 'module-typescript'];
+	if (
+		urlObj.pathname.startsWith(playgroundPackageRoot) &&
+		supportedModuleFormats.includes(context.format!)
+	) {
+		const loadResult = await nextLoad(url, context);
+		if (supportedModuleFormats.includes(loadResult.format)) {
+			const source = (loadResult.source as Buffer).toString('utf8');
+			// Some of our code uses __dirname and __filename which are not available in ES modules.
+			// https://nodejs.org/api/esm.html#no-__filename-or-__dirname
+			//
+			// Let's try simple text replacement for now. It is fast and will probably be fine.
+			// If we run into problems, we can consider an AST transform instead.
+			const updatedSource = source.replace(
+				// Replace __dirname and __filename but not if they are declarations.
+				/(?<!(?:const|var|let)\s*)\b__(dirname|filename)/g,
+				'import.meta.$1'
+			);
+			loadResult.source = Buffer.from(updatedSource, 'utf8');
+		}
+		return loadResult;
+	}
+
 	// Pass everything else to the next loader
 	return nextLoad(url, context);
 }

packages/php-wasm/compile/php/esm-node-boilerplate.js

@@ -3,20 +3,6 @@
 // this code in Node.js as an ES module.
 import { createRequire } from 'module';
 const require = createRequire(import.meta.url);
-import { fileURLToPath } from 'url';
-
-/**
- * __filename and __dirname are not available in ES modules, so we need to
- * polyfill them to ensure the debug command (npx nx debug playground-cli)
- * works.
- *
- * @see https://nodejs.org/api/esm.html#no-__filename-or-__dirname
- */
+// Note: The path module is currently needed by code injected by the php-wasm Dockerfile.
 import path from 'path';
-if (typeof __filename === 'undefined') {
-	var __filename = fileURLToPath(import.meta.url);
-}
-if (typeof __dirname === 'undefined') {
-	var __dirname = path.dirname(__filename);
-}