@wp-playground/client 0.0.1

package/index.d.ts

@@ -0,0 +1,427 @@
+// Generated by dts-bundle-generator v7.2.0
+
+export type PHPRequestHeaders = Record<string, string>;
+export interface FileInfo {
+	key: string;
+	name: string;
+	type: string;
+	data: Uint8Array;
+}
+export interface PHPRequest {
+	/**
+	 * Request path following the domain:port part.
+	 */
+	relativeUri?: string;
+	/**
+	 * Path of the .php file to execute.
+	 */
+	scriptPath?: string;
+	/**
+	 * Request protocol.
+	 */
+	protocol?: string;
+	/**
+	 * Request method. Default: `GET`.
+	 */
+	method?: "GET" | "POST" | "HEAD" | "OPTIONS" | "PATCH" | "PUT" | "DELETE";
+	/**
+	 * Request headers.
+	 */
+	headers?: PHPRequestHeaders;
+	/**
+	 * Request body without the files.
+	 */
+	body?: string;
+	/**
+	 * Uploaded files.
+	 */
+	fileInfos?: FileInfo[];
+	/**
+	 * The code snippet to eval instead of a php file.
+	 */
+	code?: string;
+}
+export interface PHPResponse {
+	/**
+	 * The exit code of the script. `0` is a success, while
+	 * `1` and `2` indicate an error.
+	 */
+	exitCode: number;
+	/**
+	 * Response body. Contains the output from `echo`,
+	 * `print`, inline HTML etc.
+	 */
+	body: ArrayBuffer;
+	/**
+	 * PHP errors.
+	 */
+	errors: string;
+	/**
+	 * Response headers.
+	 */
+	headers: Record<string, string[]>;
+	/**
+	 * Response HTTP status code, e.g. 200.
+	 */
+	httpStatusCode: number;
+}
+export type PHPRuntimeId = number;
+export interface WithPHPIniBindings {
+	setPhpIniPath(path: string): void;
+	setPhpIniEntry(key: string, value: string): void;
+}
+export interface WithCLI {
+	/**
+	 * Starts a PHP CLI session with given arguments.
+	 *
+	 * Can only be used when PHP was compiled with the CLI SAPI.
+	 * Cannot be used in conjunction with `run()`.
+	 *
+	 * @param  argv - The arguments to pass to the CLI.
+	 * @returns The exit code of the CLI session.
+	 */
+	cli(argv: string[]): Promise<number>;
+}
+export interface WithNodeFilesystem {
+	/**
+	 * Mounts a Node.js filesystem to a given path in the PHP filesystem.
+	 *
+	 * @param  settings - The Node.js filesystem settings.
+	 * @param  path     - The path to mount the filesystem to.
+	 * @see {@link https://emscripten.org/docs/api_reference/Filesystem-API.html#FS.mount}
+	 */
+	mount(settings: any, path: string): void;
+}
+export interface WithFilesystem {
+	/**
+	 * Recursively creates a directory with the given path in the PHP filesystem.
+	 * For example, if the path is `/root/php/data`, and `/root` already exists,
+	 * it will create the directories `/root/php` and `/root/php/data`.
+	 *
+	 * @param  path - The directory path to create.
+	 */
+	mkdirTree(path: string): void;
+	/**
+	 * Reads a file from the PHP filesystem and returns it as a string.
+	 *
+	 * @throws {@link ErrnoError} – If the file doesn't exist.
+	 * @param  path - The file path to read.
+	 * @returns The file contents.
+	 */
+	readFileAsText(path: string): string;
+	/**
+	 * Reads a file from the PHP filesystem and returns it as an array buffer.
+	 *
+	 * @throws {@link ErrnoError} – If the file doesn't exist.
+	 * @param  path - The file path to read.
+	 * @returns The file contents.
+	 */
+	readFileAsBuffer(path: string): Uint8Array;
+	/**
+	 * Overwrites data in a file in the PHP filesystem.
+	 * Creates a new file if one doesn't exist yet.
+	 *
+	 * @param  path - The file path to write to.
+	 * @param  data - The data to write to the file.
+	 */
+	writeFile(path: string, data: string | Uint8Array): void;
+	/**
+	 * Removes a file from the PHP filesystem.
+	 *
+	 * @throws {@link ErrnoError} – If the file doesn't exist.
+	 * @param  path - The file path to remove.
+	 */
+	unlink(path: string): void;
+	/**
+	 * Lists the files and directories in the given directory.
+	 *
+	 * @param  path - The directory path to list.
+	 * @returns The list of files and directories in the given directory.
+	 */
+	listFiles(path: string): string[];
+	/**
+	 * Checks if a directory exists in the PHP filesystem.
+	 *
+	 * @param  path – The path to check.
+	 * @returns True if the path is a directory, false otherwise.
+	 */
+	isDir(path: string): boolean;
+	/**
+	 * Checks if a file (or a directory) exists in the PHP filesystem.
+	 *
+	 * @param  path - The file path to check.
+	 * @returns True if the file exists, false otherwise.
+	 */
+	fileExists(path: string): boolean;
+}
+export interface WithRun {
+	/**
+	 * Dispatches a PHP request.
+	 * Cannot be used in conjunction with `cli()`.
+	 *
+	 * @example
+	 * ```js
+	 * const output = php.run('<?php echo "Hello world!";');
+	 * console.log(output.stdout); // "Hello world!"
+	 * ```
+	 *
+	 * @example
+	 * ```js
+	 * console.log(php.run(`<?php
+	 *  $fp = fopen('php://stderr', 'w');
+	 *  fwrite($fp, "Hello, world!");
+	 * `));
+	 * // {"exitCode":0,"stdout":"","stderr":["Hello, world!"]}
+	 * ```
+	 *
+	 * @param  request - PHP Request data.
+	 */
+	run(request?: PHPRequest): PHPResponse;
+}
+export type MountSettings = {
+	root: string;
+	mountpoint: string;
+};
+declare class PHP implements WithPHPIniBindings, WithFilesystem, WithNodeFilesystem, WithCLI, WithRun {
+	#private;
+	/**
+	 * Initializes a PHP runtime.
+	 *
+	 * @internal
+	 * @param  PHPRuntime - Optional. PHP Runtime ID as initialized by loadPHPRuntime.
+	 */
+	constructor(PHPRuntimeId?: PHPRuntimeId);
+	initializeRuntime(runtimeId: PHPRuntimeId): void;
+	setPhpIniPath(path: string): void;
+	setPhpIniEntry(key: string, value: string): void;
+	run(request?: PHPRequest): PHPResponse;
+	cli(argv: string[]): Promise<number>;
+	setSkipShebang(shouldSkip: boolean): void;
+	addServerGlobalEntry(key: string, value: string): void;
+	mkdirTree(path: string): void;
+	readFileAsText(path: string): string;
+	readFileAsBuffer(path: string): Uint8Array;
+	writeFile(path: string, data: string | Uint8Array): void;
+	unlink(path: string): void;
+	listFiles(path: string): string[];
+	isDir(path: string): boolean;
+	fileExists(path: string): boolean;
+	mount(settings: MountSettings, path: string): void;
+}
+export type PHPServerRequest = Pick<PHPRequest, "method" | "headers"> & {
+	files?: Record<string, File>;
+} & ({
+	absoluteUrl: string;
+	relativeUrl?: never;
+} | {
+	absoluteUrl?: never;
+	relativeUrl: string;
+}) & ((Pick<PHPRequest, "body"> & {
+	formData?: never;
+}) | {
+	body?: never;
+	formData: Record<string, unknown>;
+});
+declare class PHPServer {
+	#private;
+	/**
+	 * The PHP instance
+	 */
+	php: PHP;
+	/**
+	 * @param  php    - The PHP instance.
+	 * @param  config - Server configuration.
+	 */
+	constructor(php: PHP, config?: PHPServerConfigation);
+	/**
+	 * Converts a path to an absolute URL based at the PHPServer
+	 * root.
+	 *
+	 * @param  path The server path to convert to an absolute URL.
+	 * @returns The absolute URL.
+	 */
+	pathToInternalUrl(path: string): string;
+	/**
+	 * Converts an absolute URL based at the PHPServer to a relative path
+	 * without the server pathname and scope.
+	 *
+	 * @param  internalUrl An absolute URL based at the PHPServer root.
+	 * @returns The relative path.
+	 */
+	internalUrlToPath(internalUrl: string): string;
+	/**
+	 * The absolute URL of this PHPServer instance.
+	 */
+	get absoluteUrl(): string;
+	/**
+	 * The absolute URL of this PHPServer instance.
+	 */
+	get documentRoot(): string;
+	/**
+	 * Serves the request – either by serving a static file, or by
+	 * dispatching it to the PHP runtime.
+	 *
+	 * @param  request - The request.
+	 * @returns The response.
+	 */
+	request(request: PHPServerRequest): Promise<PHPResponse>;
+}
+export interface PHPServerConfigation {
+	/**
+	 * The directory in the PHP filesystem where the server will look
+	 * for the files to serve. Default: `/var/www`.
+	 */
+	documentRoot?: string;
+	/**
+	 * Server URL. Used to populate $_SERVER details like HTTP_HOST.
+	 */
+	absoluteUrl?: string;
+	/**
+	 * Callback used by the PHPServer to decide whether
+	 * the requested path refers to a PHP file or a static file.
+	 */
+	isStaticFilePath?: (path: string) => boolean;
+}
+export interface WithRequest {
+	/**
+	 * Sends the request to the server.
+	 *
+	 * When cookies are present in the response, this method stores
+	 * them and sends them with any subsequent requests.
+	 *
+	 * When a redirection is present in the response, this method
+	 * follows it by discarding a response and sending a subsequent
+	 * request.
+	 *
+	 * @param  request   - The request.
+	 * @param  redirects - Internal. The number of redirects handled so far.
+	 * @returns PHPServer response.
+	 */
+	request(request: PHPServerRequest, redirects?: number): Promise<PHPResponse>;
+}
+declare class PHPBrowser implements WithRequest {
+	#private;
+	server: PHPServer;
+	/**
+	 * @param  server - The PHP server to browse.
+	 * @param  config - The browser configuration.
+	 */
+	constructor(server: PHPServer, config?: PHPBrowserConfiguration);
+	request(request: PHPServerRequest, redirects?: number): Promise<PHPResponse>;
+}
+export interface PHPBrowserConfiguration {
+	/**
+	 * Should handle redirects internally?
+	 */
+	handleRedirects?: boolean;
+	/**
+	 * The maximum number of redirects to follow internally. Once
+	 * exceeded, request() will return the redirecting response.
+	 */
+	maxRedirects?: number;
+}
+export interface MonitoredModule {
+	dependencyFilename: string;
+	dependenciesTotalSize: number;
+}
+declare class EmscriptenDownloadMonitor extends EventTarget {
+	#private;
+	constructor(modules?: MonitoredModule[]);
+	getEmscriptenArgs(): {
+		dataFileDownloads: Record<string, any>;
+	};
+	setModules(modules: MonitoredModule[]): void;
+}
+export interface DownloadProgress {
+	/**
+	 * The number of bytes loaded so far.
+	 */
+	loaded: number;
+	/**
+	 * The total number of bytes to load.
+	 */
+	total: number;
+}
+export type ProgressMode = 
+/**
+ * Real-time progress is used when we get real-time reports
+ * about the progress.
+ */
+"REAL_TIME"
+/**
+ * Slowly increment progress is used when we don't know how long
+ * an operation will take and just want to keep slowly incrementing
+ * the progress bar.
+ */
+ | "SLOWLY_INCREMENT";
+declare class ProgressObserver extends EventTarget {
+	#private;
+	progress: number;
+	mode: ProgressMode;
+	caption: string;
+	partialObserver(progressBudget: number, caption?: string): (progress: CustomEvent<DownloadProgress>) => void;
+	slowlyIncrementBy(progress: number): void;
+	get totalProgress(): number;
+}
+export type Promisify<T> = {
+	[P in keyof T]: T[P] extends (...args: infer A) => infer R ? R extends void | Promise<any> ? T[P] : (...args: A) => Promise<ReturnType<T[P]>> : Promise<T[P]>;
+};
+export interface WithPathConversion {
+	pathToInternalUrl(path: string): Promise<string>;
+	internalUrlToPath(internalUrl: string): Promise<string>;
+}
+export interface WithProgress {
+	onDownloadProgress(callback: (progress: CustomEvent<ProgressEvent>) => void): Promise<void>;
+}
+declare class PHPClient implements Promisify<WithRequest & WithPHPIniBindings & WithFilesystem & WithRun & WithProgress & WithPathConversion> {
+	absoluteUrl: Promise<string>;
+	documentRoot: Promise<string>;
+	constructor(browser: PHPBrowser, monitor?: EmscriptenDownloadMonitor);
+	pathToInternalUrl(path: string): Promise<string>;
+	internalUrlToPath(internalUrl: string): Promise<string>;
+	onDownloadProgress(callback: (progress: CustomEvent<ProgressEvent>) => void): Promise<void>;
+	request(request: PHPServerRequest, redirects?: number): Promise<PHPResponse>;
+	run(request?: PHPRequest | undefined): Promise<PHPResponse>;
+	setPhpIniPath(path: string): void;
+	setPhpIniEntry(key: string, value: string): void;
+	mkdirTree(path: string): void;
+	readFileAsText(path: string): Promise<string>;
+	readFileAsBuffer(path: string): Promise<Uint8Array>;
+	writeFile(path: string, data: string | Uint8Array): void;
+	unlink(path: string): void;
+	listFiles(path: string): Promise<string[]>;
+	isDir(path: string): Promise<boolean>;
+	fileExists(path: string): Promise<boolean>;
+}
+declare class PlaygroundWorkerClientClass extends PHPClient {
+	scope: Promise<string>;
+	wordPressVersion: Promise<string>;
+	phpVersion: Promise<string>;
+	constructor(browser: PHPBrowser, monitor: EmscriptenDownloadMonitor, scope: string, wordPressVersion: string, phpVersion: string);
+	getWordPressModuleDetails(): Promise<{
+		staticAssetsDirectory: string;
+		defaultTheme: any;
+	}>;
+}
+declare const publicApi: PlaygroundWorkerClientClass & {
+	isReady: () => Promise<void>;
+};
+export type PlaygroundWorkerClient = typeof publicApi;
+export interface WebClientMixin {
+	onNavigation(fn: (url: string) => void): Promise<void>;
+	goTo(requestedPath: string): Promise<void>;
+	getCurrentURL(): Promise<string>;
+	setIframeSandboxFlags(flags: string[]): Promise<void>;
+	onDownloadProgress: PlaygroundWorkerClient["onDownloadProgress"];
+}
+export type PlaygroundClient = WebClientMixin & PlaygroundWorkerClient;
+export declare function exportFile(playground: PlaygroundClient): Promise<void>;
+export declare function importFile(playground: PlaygroundClient, file: File): Promise<boolean>;
+export declare function login(playground: PlaygroundClient, user?: string, password?: string): Promise<void>;
+export declare function installTheme(playground: PlaygroundClient, themeZipFile: File, options?: any): Promise<void>;
+export declare function installPlugin(playground: PlaygroundClient, pluginZipFile: File, options?: any): Promise<void>;
+export declare function installThemeFromDirectory(playground: PlaygroundClient, themeZipName: string, progressBudget?: number, progress?: ProgressObserver): Promise<void>;
+export declare function installPluginsFromDirectory(playground: PlaygroundClient, pluginsZipNames: string[], progressBudget?: number, progress?: ProgressObserver): Promise<void>;
+export declare function connectPlayground(iframe: HTMLIFrameElement, playgroundUrl: string): Promise<PlaygroundClient>;
+
+export {};

package/index.js

@@ -0,0 +1,465 @@
+import * as m from "comlink";
+import { cloneResponseMonitorProgress as U } from "@wp-playground/php-wasm-progress";
+(function() {
+  return typeof window < "u" ? "WEB" : typeof WorkerGlobalScope < "u" && self instanceof WorkerGlobalScope ? "WORKER" : "NODE";
+})();
+function C(e) {
+  S();
+  const o = e instanceof Worker ? e : m.windowEndpoint(e);
+  return m.wrap(o);
+}
+function S() {
+  m.transferHandlers.set("EVENT", {
+    canHandle: (e) => e instanceof CustomEvent,
+    serialize: (e) => [
+      {
+        detail: e.detail
+      },
+      []
+    ],
+    deserialize: (e) => e
+  }), m.transferHandlers.set("FUNCTION", {
+    canHandle: (e) => typeof e == "function",
+    serialize(e) {
+      console.debug("[Comlink][Performance] Proxying a function");
+      const { port1: o, port2: i } = new MessageChannel();
+      return m.expose(e, o), [i, [i]];
+    },
+    deserialize(e) {
+      return e.start(), m.wrap(e);
+    }
+  });
+}
+(function() {
+  return navigator.userAgent.toLowerCase().indexOf("firefox") > -1 ? "iframe" : "webworker";
+})();
+var y = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {}, F = {}, q = {
+  get exports() {
+    return F;
+  },
+  set exports(e) {
+    F = e;
+  }
+};
+(function(e, o) {
+  (function(i, s) {
+    s();
+  })(y, function() {
+    function i(t, n) {
+      return typeof n > "u" ? n = { autoBom: !1 } : typeof n != "object" && (console.warn("Deprecated: Expected third argument to be a object"), n = { autoBom: !n }), n.autoBom && /^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(t.type) ? new Blob(["\uFEFF", t], { type: t.type }) : t;
+    }
+    function s(t, n, c) {
+      var r = new XMLHttpRequest();
+      r.open("GET", t), r.responseType = "blob", r.onload = function() {
+        l(r.response, n, c);
+      }, r.onerror = function() {
+        console.error("could not download file");
+      }, r.send();
+    }
+    function d(t) {
+      var n = new XMLHttpRequest();
+      n.open("HEAD", t, !1);
+      try {
+        n.send();
+      } catch {
+      }
+      return 200 <= n.status && 299 >= n.status;
+    }
+    function u(t) {
+      try {
+        t.dispatchEvent(new MouseEvent("click"));
+      } catch {
+        var n = document.createEvent("MouseEvents");
+        n.initMouseEvent("click", !0, !0, window, 0, 0, 0, 80, 20, !1, !1, !1, !1, 0, null), t.dispatchEvent(n);
+      }
+    }
+    var a = typeof window == "object" && window.window === window ? window : typeof self == "object" && self.self === self ? self : typeof y == "object" && y.global === y ? y : void 0, f = a.navigator && /Macintosh/.test(navigator.userAgent) && /AppleWebKit/.test(navigator.userAgent) && !/Safari/.test(navigator.userAgent), l = a.saveAs || (typeof window != "object" || window !== a ? function() {
+    } : "download" in HTMLAnchorElement.prototype && !f ? function(t, n, c) {
+      var r = a.URL || a.webkitURL, p = document.createElement("a");
+      n = n || t.name || "download", p.download = n, p.rel = "noopener", typeof t == "string" ? (p.href = t, p.origin === location.origin ? u(p) : d(p.href) ? s(t, n, c) : u(p, p.target = "_blank")) : (p.href = r.createObjectURL(t), setTimeout(function() {
+        r.revokeObjectURL(p.href);
+      }, 4e4), setTimeout(function() {
+        u(p);
+      }, 0));
+    } : "msSaveOrOpenBlob" in navigator ? function(t, n, c) {
+      if (n = n || t.name || "download", typeof t != "string")
+        navigator.msSaveOrOpenBlob(i(t, c), n);
+      else if (d(t))
+        s(t, n, c);
+      else {
+        var r = document.createElement("a");
+        r.href = t, r.target = "_blank", setTimeout(function() {
+          u(r);
+        });
+      }
+    } : function(t, n, c, r) {
+      if (r = r || open("", "_blank"), r && (r.document.title = r.document.body.innerText = "downloading..."), typeof t == "string")
+        return s(t, n, c);
+      var p = t.type === "application/octet-stream", h = /constructor/i.test(a.HTMLElement) || a.safari, b = /CriOS\/[\d]+/.test(navigator.userAgent);
+      if ((b || p && h || f) && typeof FileReader < "u") {
+        var $ = new FileReader();
+        $.onloadend = function() {
+          var v = $.result;
+          v = b ? v : v.replace(/^data:[^;]*;/, "data:attachment/file;"), r ? r.location.href = v : location = v, r = null;
+        }, $.readAsDataURL(t);
+      } else {
+        var g = a.URL || a.webkitURL, w = g.createObjectURL(t);
+        r ? r.location = w : location.href = w, r = null, setTimeout(function() {
+          g.revokeObjectURL(w);
+        }, 4e4);
+      }
+    });
+    a.saveAs = l.saveAs = l, e.exports = l;
+  });
+})(q);
+const P = `<?php
+
+function generateZipFile($exportPath, $databasePath, $docRoot) {
+    $zip = new ZipArchive;
+    $res = $zip->open($exportPath, ZipArchive::CREATE);
+    if ($res === TRUE) {
+        $zip->addFile($databasePath);
+        $directories = array();
+        $directories[] = $docRoot . '/';
+
+        while(sizeof($directories)) {
+            $dir = array_pop($directories);
+
+            if ($handle = opendir($dir)) {
+                while (false !== ($entry = readdir($handle))) {
+                    if ($entry == '.' || $entry == '..') {
+                        continue;
+                    }
+
+                    $entry = $dir . $entry;
+
+                    if (
+                        is_dir($entry) &&
+                        strpos($entry, 'wp-content/database') == false &&
+                        strpos($entry, 'wp-includes') == false
+                    ) {
+                            $directory_path = $entry . '/';
+                            array_push($directories, $directory_path);
+                    } else if (is_file($entry)) {
+                        $zip->addFile($entry);
+                    }
+                }
+                closedir($handle);
+            }
+        }
+        $zip->close();
+        chmod($exportPath, 0777);
+    }
+}
+
+function readFileFromZipArchive($pathToZip, $pathToFile) {
+    chmod($pathToZip, 0777);
+    $zip = new ZipArchive;
+    $res = $zip->open($pathToZip);
+    if ($res === TRUE) {
+        $file = $zip->getFromName($pathToFile);
+        echo $file;
+    }
+}
+
+function importZipFile($pathToZip) {
+    $zip = new ZipArchive;
+    $res = $zip->open($pathToZip);
+    if ($res === TRUE) {
+        $counter = 0;
+        while ($zip->statIndex($counter)) {
+            $file = $zip->statIndex($counter);
+            $filePath = $file['name'];
+            if (!file_exists(dirname($filePath))) {
+                mkdir(dirname($filePath), 0777, true);
+            }
+            $overwrite = fopen($filePath, 'w');
+            fwrite($overwrite, $zip->getFromIndex($counter));
+            $counter++;
+        }
+        $zip->close();
+    }
+}
+`, R = "databaseExport.xml", T = "/" + R;
+async function I(e) {
+  const o = await e.request({
+    relativeUrl: "/wp-admin/export.php?download=true&&content=all"
+  }), i = new TextDecoder().decode(
+    o.body
+  );
+  await e.writeFile(T, i);
+  const s = await e.wordPressVersion, d = await e.phpVersion, u = await e.documentRoot, a = `wordpress-playground--wp${s}--php${d}.zip`, f = `/${a}`, l = await e.run({
+    code: P + ` generateZipFile('${f}', '${T}', '${u}');`
+  });
+  if (l.exitCode !== 0)
+    throw l.errors;
+  const t = await e.readFileAsBuffer(a), n = new File([t], a);
+  F.saveAs(n);
+}
+async function L(e, o) {
+  if (
+    // eslint-disable-next-line no-alert
+    !confirm(
+      "Are you sure you want to import this file? Previous data will be lost."
+    )
+  )
+    return !1;
+  const i = await o.arrayBuffer(), s = new Uint8Array(i), d = "/import.zip";
+  await e.writeFile(d, s);
+  const u = await e.run({
+    code: P + ` readFileFromZipArchive('${d}', '${T}');`
+  });
+  if (u.exitCode !== 0)
+    throw u.errors;
+  const a = new TextDecoder().decode(
+    u.body
+  ), f = new File(
+    [a],
+    R
+  ), l = await e.request({
+    relativeUrl: "/wp-admin/admin.php?import=wordpress"
+  }), n = new DOMParser().parseFromString(
+    new TextDecoder().decode(l.body),
+    "text/html"
+  ).getElementById("import-upload-form")?.getAttribute("action"), c = await e.request({
+    relativeUrl: `/wp-admin/${n}`,
+    method: "POST",
+    files: { import: f }
+  }), p = new DOMParser().parseFromString(
+    new TextDecoder().decode(c.body),
+    "text/html"
+  ).querySelector(
+    "#wpbody-content form"
+  ), h = p?.getAttribute(
+    "action"
+  ), b = (p?.querySelector(
+    "input[name='_wpnonce']"
+  )).value, $ = (p?.querySelector(
+    "input[name='_wp_http_referer']"
+  )).value, g = (p?.querySelector(
+    "input[name='import_id']"
+  )).value;
+  await e.request({
+    relativeUrl: h,
+    method: "POST",
+    formData: {
+      _wpnonce: b,
+      _wp_http_referer: $,
+      import_id: g
+    }
+  });
+  const w = await e.run({
+    code: P + ` importZipFile('${d}');`
+  });
+  if (w.exitCode !== 0)
+    throw w.errors;
+  return !0;
+}
+async function k(e, o = "admin", i = "password") {
+  await e.request({
+    relativeUrl: "/wp-login.php"
+  }), await e.request({
+    relativeUrl: "/wp-login.php",
+    method: "POST",
+    formData: {
+      log: o,
+      pwd: i,
+      rememberme: "forever"
+    }
+  });
+}
+function x(e) {
+  return new DOMParser().parseFromString(O(e), "text/html");
+}
+function O(e) {
+  return new TextDecoder().decode(e.body);
+}
+function A(e) {
+  const o = e.split(".").shift().replace("-", " ");
+  return o.charAt(0).toUpperCase() + o.slice(1).toLowerCase();
+}
+async function z(e, o, i = {}) {
+  const s = "activate" in i ? i.activate : !0, d = await e.request({
+    relativeUrl: "/wp-admin/theme-install.php"
+  }), u = x(d), a = new FormData(
+    u.querySelector(".wp-upload-form")
+  ), { themezip: f, ...l } = Object.fromEntries(
+    a.entries()
+  ), t = await e.request({
+    relativeUrl: "/wp-admin/update.php?action=upload-theme",
+    method: "POST",
+    formData: l,
+    files: { themezip: o }
+  });
+  if (s) {
+    const n = x(t), c = n.querySelector(
+      "#wpbody-content > .wrap"
+    );
+    if (c?.textContent?.includes(
+      "Theme installation failed."
+    )) {
+      console.error(c?.textContent);
+      return;
+    }
+    const r = n.querySelector(
+      "#wpbody-content .activatelink, .update-from-upload-actions .button.button-primary"
+    );
+    if (!r) {
+      console.error('The "activate" button was not found.');
+      return;
+    }
+    const p = r.attributes.getNamedItem("href").value, h = new URL(
+      p,
+      await e.pathToInternalUrl("/wp-admin/")
+    ).toString();
+    await e.request({
+      absoluteUrl: h
+    });
+  }
+}
+async function D(e, o, i = {}) {
+  const s = "activate" in i ? i.activate : !0, d = await e.request({
+    relativeUrl: "/wp-admin/plugin-install.php?tab=upload"
+  }), u = x(d), a = new FormData(
+    u.querySelector(".wp-upload-form")
+  ), { pluginzip: f, ...l } = Object.fromEntries(
+    a.entries()
+  ), t = await e.request({
+    relativeUrl: "/wp-admin/update.php?action=upload-plugin",
+    method: "POST",
+    formData: l,
+    files: { pluginzip: o }
+  });
+  if (s) {
+    const r = x(t).querySelector("#wpbody-content .button.button-primary").attributes.getNamedItem("href").value, p = new URL(
+      r,
+      await e.pathToInternalUrl("/wp-admin/")
+    ).toString();
+    await e.request({
+      absoluteUrl: p
+    });
+  }
+  async function n(c, r) {
+    return await e.writeFile(
+      c,
+      r(await e.readFileAsText(c))
+    );
+  }
+  await e.isDir("/wordpress/wp-content/plugins/gutenberg") && !await e.fileExists("/wordpress/.gutenberg-patched") && (await e.writeFile("/wordpress/.gutenberg-patched", "1"), await n(
+    "/wordpress/wp-content/plugins/gutenberg/build/block-editor/index.js",
+    (c) => c.replace(
+      /srcDoc:("[^"]+"|[^,]+)/g,
+      'src:"/wp-includes/empty.html"'
+    )
+  ), await n(
+    "/wordpress/wp-content/plugins/gutenberg/build/block-editor/index.min.js",
+    (c) => c.replace(
+      /srcDoc:("[^"]+"|[^,]+)/g,
+      'src:"/wp-includes/empty.html"'
+    )
+  ));
+}
+async function j(e, o, i = 0, s) {
+  let d = await fetch("/plugin-proxy?theme=" + o);
+  if (s && (d = U(
+    d,
+    s.partialObserver(
+      i / 2,
+      `Installing ${A(o)} theme...`
+    )
+  ), s.slowlyIncrementBy(i / 2)), d.status === 200) {
+    const u = new File([await d.blob()], o);
+    try {
+      await z(e, u);
+    } catch (a) {
+      console.error(
+        `Proceeding without the ${o} theme. Could not install it in wp-admin. The original error was: ${a}`
+      ), console.error(a);
+    }
+  } else
+    console.error(
+      `Proceeding without the ${o} theme. Could not download the zip bundle from https://downloads.wordpress.org/themes/${o} – Is the file name correct?`
+    );
+}
+async function B(e, o, i = 0, s) {
+  const d = new E(), u = new E(), a = i / o.length;
+  await new Promise((f) => {
+    for (const l of o)
+      d.enqueue(async () => {
+        let t = await fetch(
+          "/plugin-proxy?plugin=" + l
+        );
+        return s && (t = U(
+          t,
+          s.partialObserver(
+            a * 0.66,
+            `Installing ${A(
+              l
+            )} plugin...`
+          )
+        )), t.status !== 200 ? (console.error(
+          `Proceeding without the ${l} plugin. Could not download the zip bundle from https://downloads.wordpress.org/plugin/${l} – Is the file name correct?`
+        ), null) : new File([await t.blob()], l);
+      });
+    d.addEventListener("resolved", (l) => {
+      u.enqueue(async () => {
+        if (l.detail) {
+          s?.slowlyIncrementBy(a * 0.33);
+          try {
+            await D(e, l.detail);
+          } catch (t) {
+            console.error(
+              `Proceeding without the ${l.detail.name} plugin. Could not install it in wp-admin. The original error was: ${t}`
+            ), console.error(t);
+          }
+        }
+      });
+    }), u.addEventListener("empty", () => {
+      u.resolved === o.length && f(null);
+    });
+  });
+}
+class E extends EventTarget {
+  #e = [];
+  #t = !1;
+  #n = 0;
+  get resolved() {
+    return this.#n;
+  }
+  async enqueue(o) {
+    this.#e.push(o), this.#o();
+  }
+  async #o() {
+    if (!this.#t)
+      try {
+        for (this.#t = !0; this.#e.length; ) {
+          const o = this.#e.shift();
+          if (!o)
+            break;
+          const i = await o();
+          ++this.#n, this.dispatchEvent(
+            new CustomEvent("resolved", { detail: i })
+          );
+        }
+      } finally {
+        this.#t = !1, this.dispatchEvent(new CustomEvent("empty"));
+      }
+  }
+}
+async function M(e, o) {
+  e.src = o, await new Promise((s) => {
+    e.addEventListener("load", s, !1);
+  });
+  const i = C(e.contentWindow);
+  return await i.absoluteUrl, i;
+}
+export {
+  M as connectPlayground,
+  I as exportFile,
+  L as importFile,
+  D as installPlugin,
+  B as installPluginsFromDirectory,
+  z as installTheme,
+  j as installThemeFromDirectory,
+  k as login
+};

package/package.json

@@ -0,0 +1,26 @@
+{
+	"name": "@wp-playground/client",
+	"version": "0.0.1",
+	"description": "WordPress Playground client",
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/WordPress/wordpress-playground"
+	},
+	"homepage": "https://developer.wordpress.org/playground",
+	"author": "The WordPress contributors",
+	"contributors": [
+		{
+			"name": "Adam Zielinski",
+			"email": "adam@adamziel.com",
+			"url": "https://github.com/adamziel"
+		}
+	],
+	"license": "Apache-2.0",
+	"type": "module",
+	"main": "index.js",
+	"types": "index.d.ts",
+	"dependencies": {
+		"comlink": "4.4.1",
+		"@wp-playground/php-wasm-progress": "0.0.1"
+	}
+}