Backfill remote asset listing when needed (#1531)

## Motivation for the change, related issues

In order to reintroduce the request routing improvements in #1490, we
need to be sure that existing browser storage can backfill the
wordpress-remote-asset-paths file when needed. That is the purpose of
this PR.

## Implementation details

During boot, we check whether the
`/wordpress/wordpress-remote-asset-paths` exists. If it does not exist,
we check a static file path that should be common across WP versions,
`wp-admin/css/common.css`. If the common static file also does not
exist, we guess we are dealing with a minified WP build cached in
browser storage without a remote asset listing file, and we download it
based on detected WordPress version (as long as the detected version is
a supported WP version).

## Testing Instructions (or ideally a Blueprint)

So far, I have tested this manually with steps like the following:
1. Install the Chrome extension [OPFS
Explorer](https://chromewebstore.google.com/detail/opfs-explorer/acndjpgkpaclldomagafnognkcgjignd?hl=en)
2. Switch Playground to browser storage and note the current WP release
_X_ in the query string
3. Open dev tools
4. Use OPFS explorer to confirm
`/wordpress/wordpress-remote-asset-paths` exists and then delete the
file
5. Switch to the dev tools Network tab
6. Reload the page
7. Filter the requests and confirm there was a request for the current
WP release _X_ like `/wp-<X>/wordpress-remote-asset-paths`
8. Clear the Network request log
9. Use OPFS explorer to confirm
`/wordpress/wordpress-remote-asset-paths` exists again. Then delete the
file.
10. Manually adjust the query string to point to request a different WP
release.
11. Reload the page
12. Return to the dev tools Network tab, filter the requests, and
confirm there was a request for the current WP release _X_ like
`/wp-<X>/wordpress-remote-asset-paths`. Regardless of the WP version in
the query string, we should continue requesting the paths listing for
version _X_ because that is what is in browser storage.
13. Review the console log and confirm there is a warning like "Loaded
WordPress version (X) differs from requested version (Y)" and confirm
that _Y_ matches the version requested via the query string.
14. Use OPFS explorer to confirm
`/wordpress/wordpress-remote-asset-paths` exists again.

packages/playground/remote/src/lib/worker-thread.ts

@@ -1,6 +1,7 @@
 import { SyncProgressCallback, exposeAPI } from '@php-wasm/web';
 import { EmscriptenDownloadMonitor } from '@php-wasm/progress';
 import { setURLScope } from '@php-wasm/scopes';
+import { joinPaths } from '@php-wasm/util';
 import { wordPressSiteUrl } from './config';
 import {
 	getWordPressModuleDetails,
@@ -38,8 +39,8 @@ import { PHPWorker } from '@php-wasm/universal';
 import {
 	bootWordPress,
 	getLoadedWordPressVersion,
-	isSupportedWordPressVersion,
 } from '@wp-playground/wordpress';
+import { wpVersionToStaticAssetsDirectory } from '@wp-playground/wordpress-builds';
 import { logger } from '@php-wasm/logger';
 
 const scope = Math.random().toFixed(16);
@@ -133,11 +134,9 @@ export class PlaygroundWorkerEndpoint extends PHPWorker {
 		return {
 			majorVersion:
 				this.loadedWordPressVersion || this.requestedWordPressVersion,
-			staticAssetsDirectory:
-				this.loadedWordPressVersion &&
-				isSupportedWordPressVersion(this.loadedWordPressVersion)
-					? `wp-${this.loadedWordPressVersion}`
-					: undefined,
+			staticAssetsDirectory: this.loadedWordPressVersion
+				? wpVersionToStaticAssetsDirectory(this.loadedWordPressVersion)
+				: undefined,
 		};
 	}
 
@@ -275,6 +274,33 @@ try {
 		);
 	}
 
+	const wpStaticAssetsDir = wpVersionToStaticAssetsDirectory(
+		apiEndpoint.loadedWordPressVersion
+	);
+	const remoteAssetListPath = joinPaths(
+		requestHandler.documentRoot,
+		'wordpress-remote-asset-paths'
+	);
+	if (
+		wpStaticAssetsDir !== undefined &&
+		!primaryPhp.fileExists(remoteAssetListPath)
+	) {
+		// The loaded WP release has a remote static assets dir
+		// but no remote asset listing, so we need to backfill the listing.
+		const listUrl = new URL(
+			joinPaths(wpStaticAssetsDir, 'wordpress-remote-asset-paths'),
+			wordPressSiteUrl
+		);
+		try {
+			const remoteAssetPaths = await fetch(listUrl).then((res) =>
+				res.text()
+			);
+			primaryPhp.writeFile(remoteAssetListPath, remoteAssetPaths);
+		} catch (e) {
+			logger.warn(`Failed to fetch remote asset paths from ${listUrl}`);
+		}
+	}
+
 	setApiReady();
 } catch (e) {
 	setAPIError(e as Error);

packages/playground/wordpress-builds/src/index.ts

@@ -10,3 +10,11 @@ export const SupportedWordPressVersionsList = Object.keys(
 ) as any as string[];
 export const LatestSupportedWordPressVersion =
 	SupportedWordPressVersionsList.filter((v) => v.match(/^\d/))[0] as string;
+
+export function wpVersionToStaticAssetsDirectory(
+	wpVersion: string
+): string | undefined {
+	return wpVersion in SupportedWordPressVersions
+		? `wp-${wpVersion}`
+		: undefined;
+}