Fix Hello Dolly plugin installation in WordPress Playground blueprints

This commit is contained in:
2025-04-22 02:26:57 +01:00
parent 13d2f92ee5
commit 1cfc6f5a13
7 changed files with 205 additions and 11 deletions

View File

@@ -15,9 +15,9 @@ This document explains how to use WordPress Playground for testing our plugin.
The easiest way to test our plugin with WordPress Playground is to use the online version:
1. Single site testing: [Open in WordPress Playground](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/blueprint.json&_t=7)
1. Single site testing: [Open in WordPress Playground](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/blueprint.json&_t=8)
2. Multisite testing: [Open in WordPress Playground](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/multisite-blueprint.json&_t=20)
2. Multisite testing: [Open in WordPress Playground](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/multisite-blueprint.json&_t=21)
These links will automatically set up WordPress with multisite enabled, WP_DEBUG enabled, and both the Plugin Toggle and Hello Dolly plugins activated.
@@ -111,8 +111,8 @@ We have two blueprints for testing:
To run tests with WordPress Playground:
1. Open the appropriate WordPress Playground link:
- [Single site](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/blueprint.json&_t=7)
- [Multisite](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/multisite-blueprint.json&_t=20)
- [Single site](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/blueprint.json&_t=8)
- [Multisite](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/multisite-blueprint.json&_t=21)
2. Test the plugin manually in the browser
@@ -182,7 +182,8 @@ await playground.run({
{ step: 'enableMultisite' },
{ step: 'wp-cli', command: 'wp site create --slug=testsite' },
{ step: 'wp-cli', command: 'wp plugin install plugin-toggle --activate-network' },
{ step: 'wp-cli', command: 'wp plugin install hello-dolly --activate-network' }
{ step: 'installPlugin', pluginData: { resource: 'wordpress.org/plugins', slug: 'hello-dolly' } },
{ step: 'wp-cli', command: 'wp plugin activate hello-dolly --network' }
]
});
@@ -217,7 +218,8 @@ describe('Plugin Tests', () => {
{ step: 'enableMultisite' },
{ step: 'wp-cli', command: 'wp site create --slug=testsite' },
{ step: 'wp-cli', command: 'wp plugin install plugin-toggle --activate-network' },
{ step: 'wp-cli', command: 'wp plugin install hello-dolly --activate-network' }
{ step: 'installPlugin', pluginData: { resource: 'wordpress.org/plugins', slug: 'hello-dolly' } },
{ step: 'wp-cli', command: 'wp plugin activate hello-dolly --network' }
]
});
});

View File

@@ -104,9 +104,9 @@ WordPress Playground runs WordPress entirely in the browser using WebAssembly. T
The easiest way to test our plugin with WordPress Playground is to use the online version:
1. Single site testing: [Open in WordPress Playground](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/blueprint.json&_t=7)
1. Single site testing: [Open in WordPress Playground](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/blueprint.json&_t=8)
2. Multisite testing: [Open in WordPress Playground](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/multisite-blueprint.json&_t=20)
2. Multisite testing: [Open in WordPress Playground](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/multisite-blueprint.json&_t=21)
These links will automatically set up WordPress with multisite enabled, WP_DEBUG enabled, and both the Plugin Toggle and Hello Dolly plugins activated.

View File

@@ -16,9 +16,16 @@
"slug": "plugin-toggle"
}
},
{
"step": "installPlugin",
"pluginData": {
"resource": "wordpress.org/plugins",
"slug": "hello-dolly"
}
},
{
"step": "wp-cli",
"command": "wp plugin install hello-dolly --activate"
"command": "wp plugin activate hello-dolly"
}
]
}

View File

@@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hello Dolly Test</title>
<style>
body, html {
margin: 0;
padding: 0;
height: 100%;
overflow: hidden;
}
iframe {
width: 100%;
height: 100%;
border: none;
}
</style>
</head>
<body>
<iframe id="playground" src="about:blank"></iframe>
<script>
// Simple blueprint that only installs Hello Dolly
const blueprint = {
"$schema": "https://playground.wordpress.net/blueprint-schema.json",
"landingPage": "/wp-admin/plugins.php",
"login": true,
"steps": [
{
"step": "wp-cli",
"command": "wp plugin install hello-dolly"
},
{
"step": "wp-cli",
"command": "wp plugin activate hello-dolly"
}
]
};
// Load the blueprint
document.getElementById('playground').src = "https://playground.wordpress.net/?blueprint=" + encodeURIComponent(JSON.stringify(blueprint));
</script>
</body>
</html>

View File

@@ -20,6 +20,6 @@
</style>
</head>
<body>
<iframe src="https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/blueprint.json&_t=7"></iframe>
<iframe src="https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/feature/testing-framework/playground/blueprint.json&_t=8"></iframe>
</body>
</html>

View File

@@ -23,9 +23,16 @@
"step": "wp-cli",
"command": "wp plugin install plugin-toggle --activate-network"
},
{
"step": "installPlugin",
"pluginData": {
"resource": "wordpress.org/plugins",
"slug": "hello-dolly"
}
},
{
"step": "wp-cli",
"command": "wp plugin install hello-dolly --activate-network"
"command": "wp plugin activate hello-dolly --network"
}
]
}

132
playground/test.html Normal file
View File

@@ -0,0 +1,132 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WordPress Playground Test</title>
<style>
body, html {
margin: 0;
padding: 0;
height: 100%;
overflow: hidden;
}
iframe {
width: 100%;
height: 100%;
border: none;
}
.buttons {
position: fixed;
top: 10px;
left: 10px;
z-index: 1000;
}
button {
padding: 10px;
margin-right: 10px;
background-color: #0073aa;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}
button:hover {
background-color: #005177;
}
</style>
</head>
<body>
<div class="buttons">
<button onclick="loadSingleSite()">Single Site</button>
<button onclick="loadMultisite()">Multisite</button>
</div>
<iframe id="playground" src="about:blank"></iframe>
<script>
function loadSingleSite() {
document.getElementById('playground').src = "https://playground.wordpress.net/?blueprint=" + encodeURIComponent(JSON.stringify(singleSiteBlueprint));
}
function loadMultisite() {
document.getElementById('playground').src = "https://playground.wordpress.net/?blueprint=" + encodeURIComponent(JSON.stringify(multisiteBlueprint));
}
// Single site blueprint
const singleSiteBlueprint = {
"$schema": "https://playground.wordpress.net/blueprint-schema.json",
"landingPage": "/wp-admin/",
"login": true,
"steps": [
{
"step": "defineWpConfigConsts",
"consts": {
"WP_DEBUG": true
}
},
{
"step": "installPlugin",
"pluginData": {
"resource": "wordpress.org/plugins",
"slug": "plugin-toggle"
}
},
{
"step": "installPlugin",
"pluginData": {
"resource": "wordpress.org/plugins",
"slug": "hello-dolly"
}
},
{
"step": "wp-cli",
"command": "wp plugin activate hello-dolly"
}
]
};
// Multisite blueprint
const multisiteBlueprint = {
"$schema": "https://playground.wordpress.net/blueprint-schema.json",
"landingPage": "/wp-admin/network/",
"login": true,
"features": {
"networking": true
},
"steps": [
{
"step": "defineWpConfigConsts",
"consts": {
"WP_DEBUG": true
}
},
{
"step": "enableMultisite"
},
{
"step": "wp-cli",
"command": "wp site create --slug=testsite"
},
{
"step": "wp-cli",
"command": "wp plugin install plugin-toggle --activate-network"
},
{
"step": "installPlugin",
"pluginData": {
"resource": "wordpress.org/plugins",
"slug": "hello-dolly"
}
},
{
"step": "wp-cli",
"command": "wp plugin activate hello-dolly --network"
}
]
};
// Load single site by default
loadSingleSite();
</script>
</body>
</html>