From a3e6c7e8f7a04b08b230bcf485f4586c9b2bc73f Mon Sep 17 00:00:00 2001 From: eliot-akira Date: Fri, 28 Jul 2023 02:20:12 +0200 Subject: [PATCH 01/11] Website: Add query parameter "import" to install site from zip file URL --- .../playground/website/src/lib/make-blueprint.tsx | 15 ++++++++++----- packages/playground/website/src/main.tsx | 1 + 2 files changed, 11 insertions(+), 5 deletions(-) diff --git a/packages/playground/website/src/lib/make-blueprint.tsx b/packages/playground/website/src/lib/make-blueprint.tsx index 04900c25e7..83c3ba9a79 100644 --- a/packages/playground/website/src/lib/make-blueprint.tsx +++ b/packages/playground/website/src/lib/make-blueprint.tsx @@ -17,11 +17,16 @@ export function makeBlueprint(options: MakeBlueprintOptions): Blueprint { wp: options.wp as any, }, steps: [ - { - step: 'login', - username: 'admin', - password: 'password', - }, + options.import + ? { + step: 'importFile', + file: options.import, + } + : { + step: 'login', + username: 'admin', + password: 'password', + }, options.theme && { step: 'installTheme', themeZipFile: { diff --git a/packages/playground/website/src/main.tsx b/packages/playground/website/src/main.tsx index d7de726933..6363ba8ab4 100644 --- a/packages/playground/website/src/main.tsx +++ b/packages/playground/website/src/main.tsx @@ -42,6 +42,7 @@ try { blueprint = makeBlueprint({ php: query.get('php') || '8.0', wp: query.get('wp') || 'latest', + import: query.get('import') || undefined, theme: query.get('theme') || undefined, plugins: query.getAll('plugin'), landingPage: query.get('url') || undefined, From 20fb481e4b9154aec090d72e44360e7404c28ed6 Mon Sep 17 00:00:00 2001 From: eliot-akira Date: Sat, 5 Aug 2023 18:18:13 +0200 Subject: [PATCH 02/11] Correct types for MakeBlueprintOptions and importFile step --- packages/playground/website/src/lib/make-blueprint.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/playground/website/src/lib/make-blueprint.tsx b/packages/playground/website/src/lib/make-blueprint.tsx index 83c3ba9a79..62ac778841 100644 --- a/packages/playground/website/src/lib/make-blueprint.tsx +++ b/packages/playground/website/src/lib/make-blueprint.tsx @@ -5,6 +5,7 @@ interface MakeBlueprintOptions { wp?: string; landingPage?: string; theme?: string; + import?: string; plugins?: string[]; gutenbergPR?: number; } @@ -20,7 +21,10 @@ export function makeBlueprint(options: MakeBlueprintOptions): Blueprint { options.import ? { step: 'importFile', - file: options.import, + file: { + resource: 'url', + url: options.import, + } as UrlReference, } : { step: 'login', From a999e378276a9a3d565679f78f12d2e97f6c713e Mon Sep 17 00:00:00 2001 From: eliot-akira Date: Sat, 5 Aug 2023 18:19:53 +0200 Subject: [PATCH 03/11] Ensure protocol http or https for import file URL --- packages/playground/website/src/lib/make-blueprint.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/playground/website/src/lib/make-blueprint.tsx b/packages/playground/website/src/lib/make-blueprint.tsx index 62ac778841..6b317839af 100644 --- a/packages/playground/website/src/lib/make-blueprint.tsx +++ b/packages/playground/website/src/lib/make-blueprint.tsx @@ -1,4 +1,4 @@ -import { Blueprint, StepDefinition } from '@wp-playground/client'; +import { Blueprint, StepDefinition, UrlReference } from '@wp-playground/client'; interface MakeBlueprintOptions { php?: string; @@ -18,7 +18,7 @@ export function makeBlueprint(options: MakeBlueprintOptions): Blueprint { wp: options.wp as any, }, steps: [ - options.import + options.import && /^(http(s?)):\/\//i.test(options.import) ? { step: 'importFile', file: { From a28c20204e1e91f11544994d23c4b769fecf51b8 Mon Sep 17 00:00:00 2001 From: eliot-akira Date: Tue, 8 Aug 2023 15:21:26 +0200 Subject: [PATCH 04/11] Documentation: Add option "import" to Query API page --- packages/docs/site/docs/08-query-api/01-index.md | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/docs/site/docs/08-query-api/01-index.md b/packages/docs/site/docs/08-query-api/01-index.md index 0caf79fb85..fe333bc48d 100644 --- a/packages/docs/site/docs/08-query-api/01-index.md +++ b/packages/docs/site/docs/08-query-api/01-index.md @@ -27,6 +27,7 @@ You can go ahead and try it out. The Playground will automatically install the t | `wp` | `latest` | Loads the specified WordPress version. Supported values: `5.9`, `6.0`, `6.1`, `6.2`, `latest` | | `plugin` | | 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` | | 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 | +| `import` | | Imports a site from the specified zip file URL. The file must be served with CORS enabled. The step automatically logs the user in as an admin, unless the default user has been changed or option `login` is set to `0` (zero) | | `url` | `/wp-admin/` | Load the specified initial page displaying WordPress | | `mode` | `seamless` | Displays WordPress on a full-page or wraps it in a browser UI | | `lazy` | | Defer loading the Playground assets until someone clicks on the "Run" button | From 4ac98ccb19b94c09eb4b867a86bf130833477f7b Mon Sep 17 00:00:00 2001 From: eliot-akira Date: Tue, 8 Aug 2023 15:22:54 +0200 Subject: [PATCH 05/11] Format --- packages/docs/site/docs/08-query-api/01-index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/docs/site/docs/08-query-api/01-index.md b/packages/docs/site/docs/08-query-api/01-index.md index fe333bc48d..c0bcc44914 100644 --- a/packages/docs/site/docs/08-query-api/01-index.md +++ b/packages/docs/site/docs/08-query-api/01-index.md @@ -27,7 +27,7 @@ You can go ahead and try it out. The Playground will automatically install the t | `wp` | `latest` | Loads the specified WordPress version. Supported values: `5.9`, `6.0`, `6.1`, `6.2`, `latest` | | `plugin` | | 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` | | 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 | -| `import` | | Imports a site from the specified zip file URL. The file must be served with CORS enabled. The step automatically logs the user in as an admin, unless the default user has been changed or option `login` is set to `0` (zero) | +| `import` | | Imports a site from the specified zip file URL. The file must be served with CORS enabled. The step automatically logs the user in as an admin, unless the default user has been changed or option `login` is set to `0` (zero) | | `url` | `/wp-admin/` | Load the specified initial page displaying WordPress | | `mode` | `seamless` | Displays WordPress on a full-page or wraps it in a browser UI | | `lazy` | | Defer loading the Playground assets until someone clicks on the "Run" button | From 2f3e7d6ebcde68641127b462c76e2c418318a531 Mon Sep 17 00:00:00 2001 From: eliot-akira Date: Sat, 2 Dec 2023 01:32:11 +0100 Subject: [PATCH 06/11] Login with default admin user after importing site --- .../website/src/lib/make-blueprint.tsx | 29 ++++++++++--------- 1 file changed, 16 insertions(+), 13 deletions(-) diff --git a/packages/playground/website/src/lib/make-blueprint.tsx b/packages/playground/website/src/lib/make-blueprint.tsx index 6b317839af..c36d4ce010 100644 --- a/packages/playground/website/src/lib/make-blueprint.tsx +++ b/packages/playground/website/src/lib/make-blueprint.tsx @@ -18,19 +18,22 @@ export function makeBlueprint(options: MakeBlueprintOptions): Blueprint { wp: options.wp as any, }, steps: [ - options.import && /^(http(s?)):\/\//i.test(options.import) - ? { - step: 'importFile', - file: { - resource: 'url', - url: options.import, - } as UrlReference, - } - : { - step: 'login', - username: 'admin', - password: 'password', - }, + ...(options.import && /^(http(s?)):\/\//i.test(options.import) + ? [ + { + step: 'importFile', + file: { + resource: 'url', + url: options.import, + } as UrlReference, + }, + ] + : []), + { + step: 'login', + username: 'admin', + password: 'password', + }, options.theme && { step: 'installTheme', themeZipFile: { From f822a73b118248cb71e0efda1e2669919ef26614 Mon Sep 17 00:00:00 2001 From: eliot-akira Date: Sat, 2 Dec 2023 01:41:17 +0100 Subject: [PATCH 07/11] Rename query parameter `import` to `importFile` --- packages/docs/site/docs/08-query-api/01-index.md | 2 +- packages/playground/website/src/lib/make-blueprint.tsx | 7 ++++--- packages/playground/website/src/main.tsx | 2 +- 3 files changed, 6 insertions(+), 5 deletions(-) diff --git a/packages/docs/site/docs/08-query-api/01-index.md b/packages/docs/site/docs/08-query-api/01-index.md index c0bcc44914..666f46ea3f 100644 --- a/packages/docs/site/docs/08-query-api/01-index.md +++ b/packages/docs/site/docs/08-query-api/01-index.md @@ -27,7 +27,7 @@ You can go ahead and try it out. The Playground will automatically install the t | `wp` | `latest` | Loads the specified WordPress version. Supported values: `5.9`, `6.0`, `6.1`, `6.2`, `latest` | | `plugin` | | 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` | | 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 | -| `import` | | Imports a site from the specified zip file URL. The file must be served with CORS enabled. The step automatically logs the user in as an admin, unless the default user has been changed or option `login` is set to `0` (zero) | +| `importFile` | | Imports a site from the specified zip file URL. The file must be served with CORS enabled. The step automatically logs the user in as an admin, unless the default user has been changed or option `login` is set to `0` (zero) | | `url` | `/wp-admin/` | Load the specified initial page displaying WordPress | | `mode` | `seamless` | Displays WordPress on a full-page or wraps it in a browser UI | | `lazy` | | Defer loading the Playground assets until someone clicks on the "Run" button | diff --git a/packages/playground/website/src/lib/make-blueprint.tsx b/packages/playground/website/src/lib/make-blueprint.tsx index c36d4ce010..580efb1185 100644 --- a/packages/playground/website/src/lib/make-blueprint.tsx +++ b/packages/playground/website/src/lib/make-blueprint.tsx @@ -5,7 +5,7 @@ interface MakeBlueprintOptions { wp?: string; landingPage?: string; theme?: string; - import?: string; + importFile?: string; plugins?: string[]; gutenbergPR?: number; } @@ -18,13 +18,14 @@ export function makeBlueprint(options: MakeBlueprintOptions): Blueprint { wp: options.wp as any, }, steps: [ - ...(options.import && /^(http(s?)):\/\//i.test(options.import) + ...(options.importFile && + /^(http(s?)):\/\//i.test(options.importFile) ? [ { step: 'importFile', file: { resource: 'url', - url: options.import, + url: options.importFile, } as UrlReference, }, ] diff --git a/packages/playground/website/src/main.tsx b/packages/playground/website/src/main.tsx index 6363ba8ab4..752080e1ff 100644 --- a/packages/playground/website/src/main.tsx +++ b/packages/playground/website/src/main.tsx @@ -42,7 +42,7 @@ try { blueprint = makeBlueprint({ php: query.get('php') || '8.0', wp: query.get('wp') || 'latest', - import: query.get('import') || undefined, + importFile: query.get('importFile') || undefined, theme: query.get('theme') || undefined, plugins: query.getAll('plugin'), landingPage: query.get('url') || undefined, From 1253bb15f814be346d98ec6b20a1dfe4ff3d96ec Mon Sep 17 00:00:00 2001 From: eliot-akira Date: Sat, 2 Dec 2023 01:51:38 +0100 Subject: [PATCH 08/11] Implement query parameter `login` that was already documented but not implemented --- .../playground/website/src/lib/make-blueprint.tsx | 15 ++++++++++----- packages/playground/website/src/main.tsx | 1 + 2 files changed, 11 insertions(+), 5 deletions(-) diff --git a/packages/playground/website/src/lib/make-blueprint.tsx b/packages/playground/website/src/lib/make-blueprint.tsx index 580efb1185..1927eb3cc9 100644 --- a/packages/playground/website/src/lib/make-blueprint.tsx +++ b/packages/playground/website/src/lib/make-blueprint.tsx @@ -6,6 +6,7 @@ interface MakeBlueprintOptions { landingPage?: string; theme?: string; importFile?: string; + login?: boolean; plugins?: string[]; gutenbergPR?: number; } @@ -30,11 +31,15 @@ export function makeBlueprint(options: MakeBlueprintOptions): Blueprint { }, ] : []), - { - step: 'login', - username: 'admin', - password: 'password', - }, + ...(typeof options.login === 'undefined' || options.login === true + ? [ + { + step: 'login', + username: 'admin', + password: 'password', + }, + ] + : []), options.theme && { step: 'installTheme', themeZipFile: { diff --git a/packages/playground/website/src/main.tsx b/packages/playground/website/src/main.tsx index 752080e1ff..dc9ebf6fe1 100644 --- a/packages/playground/website/src/main.tsx +++ b/packages/playground/website/src/main.tsx @@ -43,6 +43,7 @@ try { php: query.get('php') || '8.0', wp: query.get('wp') || 'latest', importFile: query.get('importFile') || undefined, + login: query.get('login') !== '0', theme: query.get('theme') || undefined, plugins: query.getAll('plugin'), landingPage: query.get('url') || undefined, From 671869fe1322037bc31ed746dc009269bc31423b Mon Sep 17 00:00:00 2001 From: eliot-akira Date: Sat, 2 Dec 2023 01:55:37 +0100 Subject: [PATCH 09/11] Revert "Implement query parameter `login` that was already documented but not implemented" This reverts commit 1253bb15f814be346d98ec6b20a1dfe4ff3d96ec. --- .../playground/website/src/lib/make-blueprint.tsx | 15 +++++---------- packages/playground/website/src/main.tsx | 1 - 2 files changed, 5 insertions(+), 11 deletions(-) diff --git a/packages/playground/website/src/lib/make-blueprint.tsx b/packages/playground/website/src/lib/make-blueprint.tsx index 1927eb3cc9..580efb1185 100644 --- a/packages/playground/website/src/lib/make-blueprint.tsx +++ b/packages/playground/website/src/lib/make-blueprint.tsx @@ -6,7 +6,6 @@ interface MakeBlueprintOptions { landingPage?: string; theme?: string; importFile?: string; - login?: boolean; plugins?: string[]; gutenbergPR?: number; } @@ -31,15 +30,11 @@ export function makeBlueprint(options: MakeBlueprintOptions): Blueprint { }, ] : []), - ...(typeof options.login === 'undefined' || options.login === true - ? [ - { - step: 'login', - username: 'admin', - password: 'password', - }, - ] - : []), + { + step: 'login', + username: 'admin', + password: 'password', + }, options.theme && { step: 'installTheme', themeZipFile: { diff --git a/packages/playground/website/src/main.tsx b/packages/playground/website/src/main.tsx index dc9ebf6fe1..752080e1ff 100644 --- a/packages/playground/website/src/main.tsx +++ b/packages/playground/website/src/main.tsx @@ -43,7 +43,6 @@ try { php: query.get('php') || '8.0', wp: query.get('wp') || 'latest', importFile: query.get('importFile') || undefined, - login: query.get('login') !== '0', theme: query.get('theme') || undefined, plugins: query.getAll('plugin'), landingPage: query.get('url') || undefined, From 7ef8ceda0ed4aa5af6550de764af7c38e554aa3f Mon Sep 17 00:00:00 2001 From: eliot-akira Date: Mon, 11 Dec 2023 15:47:13 +0100 Subject: [PATCH 10/11] Website Query API: Add option `import-site` and `import-content` --- .../docs/site/docs/08-query-api/01-index.md | 2 ++ .../website/src/lib/make-blueprint.tsx | 34 +++++++++++-------- .../website/src/lib/resolve-blueprint.ts | 2 ++ 3 files changed, 24 insertions(+), 14 deletions(-) diff --git a/packages/docs/site/docs/08-query-api/01-index.md b/packages/docs/site/docs/08-query-api/01-index.md index c44b826f0a..8bd6c13f01 100644 --- a/packages/docs/site/docs/08-query-api/01-index.md +++ b/packages/docs/site/docs/08-query-api/01-index.md @@ -35,6 +35,8 @@ You can go ahead and try it out. The Playground will automatically install the t | `lazy` | | Defer loading the Playground assets until someone clicks on the "Run" button | | `login` | `1` | Logs the user in as an admin | | `storage` | | Selects the storage for Playground: `none` gets erased on page refresh, `browser` is stored in the browser, and `device` is stored in the selected directory on a device. The last two protect the user from accidentally losing their work upon page refresh. | +| `import-site` | | Imports site files and database from a zip file specified by URL. | +| `import-content` | | Imports site content from a WXR or WXZ file specified by URL. | For example, the following code embeds a Playground with a preinstalled Gutenberg plugin, and opens the post editor: diff --git a/packages/playground/website/src/lib/make-blueprint.tsx b/packages/playground/website/src/lib/make-blueprint.tsx index 613c2f34d6..89ee0132bc 100644 --- a/packages/playground/website/src/lib/make-blueprint.tsx +++ b/packages/playground/website/src/lib/make-blueprint.tsx @@ -1,4 +1,4 @@ -import { Blueprint, StepDefinition, UrlReference } from '@wp-playground/client'; +import { Blueprint, StepDefinition } from '@wp-playground/client'; interface MakeBlueprintOptions { php?: string; @@ -8,9 +8,11 @@ interface MakeBlueprintOptions { landingPage?: string; features?: Blueprint['features']; theme?: string; - importFile?: string; plugins?: string[]; + importSite?: string; + importContent?: string; } + export function makeBlueprint(options: MakeBlueprintOptions): Blueprint { const plugins = options.plugins || []; return { @@ -22,23 +24,27 @@ export function makeBlueprint(options: MakeBlueprintOptions): Blueprint { phpExtensionBundles: options.phpExtensionBundles as any, features: options.features, steps: [ - ...(options.importFile && - /^(http(s?)):\/\//i.test(options.importFile) - ? [ - { - step: 'importFile', - file: { - resource: 'url', - url: options.importFile, - } as UrlReference, - }, - ] - : []), + options.importSite && + /^(http(s?)):\/\//i.test(options.importSite) && { + step: 'importWordPressFiles', + wordPressFilesZip: { + resource: 'url', + url: options.importSite, + }, + }, options.login && { step: 'login', username: 'admin', password: 'password', }, + options.importContent && + /^(http(s?)):\/\//i.test(options.importContent) && { + step: 'importFile', + file: { + resource: 'url', + url: options.importContent, + }, + }, options.theme && { step: 'installTheme', themeZipFile: { diff --git a/packages/playground/website/src/lib/resolve-blueprint.ts b/packages/playground/website/src/lib/resolve-blueprint.ts index 50eba52052..0db86e256f 100644 --- a/packages/playground/website/src/lib/resolve-blueprint.ts +++ b/packages/playground/website/src/lib/resolve-blueprint.ts @@ -61,6 +61,8 @@ export async function resolveBlueprint() { plugins: query.getAll('plugin'), landingPage: query.get('url') || undefined, phpExtensionBundles: query.getAll('php-extension-bundle') || [], + importSite: query.get('import-site') || undefined, + importContent: query.get('import-content') || undefined, }); } From 0146f5fca077209f6309b4af4ba04368c43e7921 Mon Sep 17 00:00:00 2001 From: eliot-akira Date: Mon, 11 Dec 2023 16:31:54 +0100 Subject: [PATCH 11/11] Query API: Add note about CORS policy; Clarify that `login` accepts value `0` to stop automatic login; Clarify that `import-content` depends on `login` to succeed --- packages/docs/site/docs/08-query-api/01-index.md | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/packages/docs/site/docs/08-query-api/01-index.md b/packages/docs/site/docs/08-query-api/01-index.md index 8bd6c13f01..e4e0b0cab3 100644 --- a/packages/docs/site/docs/08-query-api/01-index.md +++ b/packages/docs/site/docs/08-query-api/01-index.md @@ -33,13 +33,19 @@ You can go ahead and try it out. The Playground will automatically install the t | `url` | `/wp-admin/` | Load the specified initial page displaying WordPress | | `mode` | `seamless`, `browser`, or `browser-full-screen` | Displays WordPress on a full-page or wraps it in a browser UI | | `lazy` | | Defer loading the Playground assets until someone clicks on the "Run" button | -| `login` | `1` | Logs the user in as an admin | +| `login` | `1` | Logs the user in as an admin. Set to `0` to not log in. | | `storage` | | Selects the storage for Playground: `none` gets erased on page refresh, `browser` is stored in the browser, and `device` is stored in the selected directory on a device. The last two protect the user from accidentally losing their work upon page refresh. | | `import-site` | | Imports site files and database from a zip file specified by URL. | -| `import-content` | | Imports site content from a WXR or WXZ file specified by URL. | +| `import-content` | | Imports site content from a WXR or WXZ file specified by URL. It uses the WordPress Importer, so the default admin user must be logged in. | For example, the following code embeds a Playground with a preinstalled Gutenberg plugin, and opens the post editor: ```html ``` + +:::info CORS policy + +To import files from a URL, such as a site zip package, they must be served with `Access-Control-Allow-Origin` header set. For reference, see: [Cross-Origin Resource Sharing (CORS)](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS#the_http_response_headers). + +:::