Support multiple PHP versions

docs/embedding-wordpress-playground-on-other-websites.md

@@ -22,6 +22,7 @@ Here's the full list of supported configuration options:
 * `page=/wp-admin/` – Load the specified initial page displaying WordPress
 * `plugin=coblocks` – Installs the specified plugin. Use the plugin name from the plugins directory URL, e.g. for a URL like `https://wordpress.org/plugins/wp-lazy-loading/`, the plugin name would be `wp-lazy-loading`. You can pre-install multiple plugins by saying `plugin=coblocks&plugin=wp-lazy-loading&…`. Installing a plugin automatically logs the user in as an admin.
 * `theme=disco` – Installs the specified theme. Use the theme name from the themes directory URL, e.g. for a URL like `https://wordpress.org/themes/disco/`, the theme name would be `disco`. Installing a theme automatically logs the user in as an admin.
+* `php=8.1` – Default: 8.0 Loads the specified PHP version. Supported values: `5.6`, `7.0`, `7.1`, `7.2`, `7.3`, `7.4`, `8.0`, `8.1`, `8.2`
 * `rpc=1` – Enables the experimental JavaScript API.
 
 For example, the following code embeds a Playground with a preinstalled Gutenberg plugin, and opens the post editor:

docs/using-php-in-javascript.md

@@ -36,7 +36,8 @@ To find out more about each step, refer directly to the [Dockerfile](https://git
 
 ### Building
 
-To build, run `npm run build:php:web` in the repository root. You'll find the output files in `src/php-wasm/build-wasm`.
+To build all PHP versions, run `npm run build:php:web` in the repository root. You'll find the output files in `src/php-wasm/build-wasm`. To build a specific
+version, run `npm run build:php:web:<VERSION>`, e.g. `npm run build:php:web:8.2`.
 
 ### PHP extensions
 

esbuild.js

@@ -72,7 +72,7 @@ async function main() {
 			WASM_WORKER_THREAD_SCRIPT_URL: JSON.stringify(workerThreadScript),
 			WASM_WORKER_BACKEND: JSON.stringify(wasmWorkerBackend),
 			WP_JS_HASH: JSON.stringify(hashFiles([`build/wp.js`])),
-			PHP_JS_HASH: JSON.stringify(hashFiles([`build/php.js`])),
+			PHP_JS_HASH: JSON.stringify(hashFiles(glob.sync('build/php-*.js'))),
 		},
 		entryPoints: {
 			'worker-thread': 'src/wordpress-playground/worker-thread.ts',

package.json

@@ -16,8 +16,26 @@
     "build:htaccess": "gulp buildHtaccess",
     "build:wp": "gulp buildWordPress",
     "build:php": "npm run build:php:web",
-    "build:php:web": "PLATFORM=web gulp buildPHP",
-    "build:php:node": "PLATFORM=node gulp buildPHP",
+    "build:php:web": "npm-run-all 'build:php:web:*'",
+    "build:php:web:8.2": "PHP_VERSION=8.2.0 gulp buildPHP",
+    "build:php:web:8.1": "PHP_VERSION=8.1.14 gulp buildPHP",
+    "build:php:web:8.0": "PHP_VERSION=8.0.11 gulp buildPHP",
+    "build:php:web:7.4": "PHP_VERSION=7.4.33 gulp buildPHP",
+    "build:php:web:7.3": "PHP_VERSION=7.3.33 gulp buildPHP",
+    "build:php:web:7.2": "PHP_VERSION=7.2.34 gulp buildPHP",
+    "build:php:web:7.1": "PHP_VERSION=7.1.30 gulp buildPHP",
+    "build:php:web:7.0": "PHP_VERSION=7.0.33 gulp buildPHP",
+    "build:php:web:5.6": "PHP_VERSION=5.6.40 gulp buildPHP",
+    "build:php:node": "npm-run-all 'build:php:node:*'",
+    "build:php:node:8.2": "PLATFORM=node PHP_VERSION=8.2.0 gulp buildPHP",
+    "build:php:node:8.1": "PLATFORM=node PHP_VERSION=8.1.14 gulp buildPHP",
+    "build:php:node:8.0": "PLATFORM=node PHP_VERSION=8.0.11 gulp buildPHP",
+    "build:php:node:7.4": "PLATFORM=node PHP_VERSION=7.4.33 gulp buildPHP",
+    "build:php:node:7.3": "PLATFORM=node PHP_VERSION=7.3.33 gulp buildPHP",
+    "build:php:node:7.2": "PLATFORM=node PHP_VERSION=7.2.34 gulp buildPHP",
+    "build:php:node:7.1": "PLATFORM=node PHP_VERSION=7.1.30 gulp buildPHP",
+    "build:php:node:7.0": "PLATFORM=node PHP_VERSION=7.0.33 gulp buildPHP",
+    "build:php:node:5.6": "PLATFORM=node PHP_VERSION=5.6.40 gulp buildPHP",
     "build:docs:api": "npm run build:types ; gulp buildApiReference",
     "build:docs:markdown": "node scripts/postprocess-md-docs.js",
     "build:types": "npm run clean:types; npm-run-all --parallel build:types:*",
@@ -61,7 +79,6 @@
     "@types/jest": "^29.2.3",
     "@types/node": "12.20.24",
     "@types/yargs": "^17.0.14",
-    "@wordpress/eslint-plugin": "^13.0.0",
     "babel-plugin-add-import-extension": "^1.6.0",
     "babel-plugin-import-global": "^0.0.6",
     "chokidar-cli": "^3.0.0",
@@ -94,5 +111,8 @@
     "vitepress": "^1.0.0-alpha.26",
     "vue": "^3.2.41",
     "yargs": "^17.6.2"
+  },
+  "devDependencies": {
+    "@wordpress/eslint-plugin": "^13.7.0"
   }
 }

src/php-wasm-browser/worker-thread/worker-library.ts

@@ -231,7 +231,8 @@ export async function loadPHPWithProgress(
 	const modules = [phpLoaderModule, ...dataDependenciesModules];
 
 	const assetsSizes = modules.reduce((acc, module) => {
-		acc[module.dependencyFilename] = module.dependenciesTotalSize;
+		acc[module.dependencyFilename.split('?')[0]] =
+			module.dependenciesTotalSize;
 		return acc;
 	}, {});
 	const downloadMonitor = new EmscriptenDownloadMonitor(assetsSizes);

src/php-wasm/__tests__/php-server.ts

@@ -0,0 +1,93 @@
+import * as phpLoaderModule from '../../../build/php.node.js';
+import { startPHP } from '../php';
+import { PHPServer } from '../php-server';
+
+const { TextEncoder, TextDecoder } = require('util');
+global.TextEncoder = TextEncoder;
+global.TextDecoder = TextDecoder;
+
+describe('PHP Server – boot', () => {
+	beforeAll(() => {
+		// Shim the user agent for the server
+		(global as any).navigator = { userAgent: '' };
+	});
+
+	it('should boot', async () => {
+		const php = await startPHP(phpLoaderModule, 'NODE');
+		php.mkdirTree('/tests');
+		const server = new PHPServer(php, {
+			documentRoot: '/tests',
+			absoluteUrl: 'http://localhost/',
+			isStaticFilePath: (path) => path.startsWith('/uploads'),
+		});
+
+		server.php.writeFile(
+			'/tests/upload.php',
+			`<?php echo json_encode([
+			'files' => $_FILES,
+			'is_uploaded' => is_uploaded_file($_FILES['file.txt']['tmp_name'])
+		]);`
+		);
+		const response = await server.request({
+			path: `/upload.php`,
+			method: 'POST',
+			_POST: {},
+			files: {
+				'file.txt': new File(['Hello world'], 'file.txt'),
+			},
+		});
+		const bodyText = new TextDecoder().decode(response.body);
+		expect(JSON.parse(bodyText)).toEqual({
+			files: {
+				'file.txt': {
+					name: 'file.txt',
+					type: 'text/plain',
+					tmp_name: expect.any(String),
+					error: 0,
+					size: 1,
+				},
+			},
+			is_uploaded: true,
+		});
+	});
+});
+
+// Shim the browser's file class
+class File {
+	data;
+	name;
+
+	constructor(data, name) {
+		this.data = data;
+		this.name = name;
+	}
+
+	get size() {
+		return this.data.length;
+	}
+
+	get type() {
+		return 'text/plain';
+	}
+
+	arrayBuffer() {
+		return dataToArrayBuffer(this.data);
+	}
+}
+
+function dataToArrayBuffer(data) {
+	if (typeof data === 'string') {
+		return new TextEncoder().encode(data).buffer;
+	} else if (data instanceof ArrayBuffer) {
+		data = new Uint8Array(data);
+	} else if (Array.isArray(data)) {
+		if (data[0] instanceof Number) {
+			return new Uint8Array(data);
+		}
+		return dataToArrayBuffer(data[0]);
+	} else if (data instanceof Uint8Array) {
+		return data.buffer;
+	} else {
+		throw new Error('Unsupported data type');
+	}
+}

src/php-wasm/php-server.ts

@@ -193,9 +193,8 @@ export class PHPServer {
 					_COOKIE: request._COOKIE || {},
 					_SESSION: {},
 				})}
-REQUEST,
-        JSON_OBJECT_AS_ARRAY
-      );
+REQUEST
+				, JSON_OBJECT_AS_ARRAY);
 
 			parse_str(substr($request->queryString, 1), $_GET);
 
@@ -241,7 +240,7 @@ REQUEST,
 			$_SERVER['SCRIPT_NAME']     = $docroot . '/' . $script;
 			$_SERVER['PHP_SELF']        = $docroot . '/' . $script;
 			chdir($docroot);
-			
+
 			require_once ${JSON.stringify(this.#resolvePHPFilePath(request.path))};
 		`);
 

src/php-wasm/php.ts

@@ -204,6 +204,7 @@ session.save_path=/home/web_user
     `
 		);
 		this.#Runtime.ccall('phpwasm_init_context', NUM, [STR], []);
+		this.writeFile('/wordpress/phpinfo.php', '<?php phpinfo(); ');
 	}
 
 	/**