Add WordPress Playground and WP Performance Tests integration

.github/workflows/playground-tests.yml

@@ -0,0 +1,91 @@
+name: WordPress Playground Tests
+
+on:
+  push:
+    branches: [ main, feature/*, bugfix/* ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  code-quality:
+    name: Code Quality Check
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [18, 20]
+
+    steps:
+    - uses: actions/checkout@v4
+
+    - name: Setup Node.js
+      uses: actions/setup-node@v4
+      with:
+        node-version: ${{ matrix.node-version }}
+        cache: 'npm'
+
+    - name: Install dependencies
+      run: npm ci
+
+    - name: Verify package.json and package-lock.json
+      run: |
+        echo "Verifying package.json and package-lock.json are in sync"
+        npm ci --dry-run
+
+    - name: Lint JavaScript files
+      run: |
+        echo "Linting JavaScript files"
+        # Add your linting command here when you have one
+        # For example: npm run lint
+
+  playground-test:
+    name: WordPress Playground Tests
+    runs-on: ubuntu-latest
+    needs: code-quality
+
+    steps:
+    - uses: actions/checkout@v4
+
+    - name: Setup Node.js
+      uses: actions/setup-node@v4
+      with:
+        node-version: '20'
+        cache: 'npm'
+
+    - name: Install dependencies
+      run: npm ci
+
+    - name: Install WordPress Playground CLI
+      run: npm install -g @wordpress/playground-tools
+
+    - name: Create plugin zip
+      run: |
+        mkdir -p dist
+        zip -r dist/plugin.zip . -x "node_modules/*" "dist/*" ".git/*"
+
+    - name: Run tests with WordPress Playground
+      run: |
+        # Start WordPress Playground with our blueprint
+        wp-playground start --blueprint playground/blueprint.json --port 8888 &
+        
+        # Wait for WordPress Playground to be ready
+        echo "Waiting for WordPress Playground to be ready..."
+        timeout 60 bash -c 'until curl -s http://localhost:8888; do sleep 2; done'
+        
+        # Run Cypress tests against WordPress Playground
+        npm run test:single:headless
+
+  performance-test:
+    name: WordPress Performance Tests
+    runs-on: ubuntu-latest
+    needs: code-quality
+
+    steps:
+    - uses: actions/checkout@v4
+
+    - name: WordPress Performance Tests
+      uses: wptrt/wordpress-plugin-performance-tests@v1
+      with:
+        plugin-slug: wp-plugin-starter-template-for-ai-coding
+        php-version: '8.0'
+        wp-version: 'latest'
+        test-type: 'all'

.wiki/Playground-Testing.md

@@ -0,0 +1,69 @@
+# WordPress Playground Testing
+
+This document explains how to use WordPress Playground for testing our plugin.
+
+## What is WordPress Playground?
+
+[WordPress Playground](https://wordpress.org/playground/) is a project that runs WordPress entirely in the browser using WebAssembly. This means:
+
+* No server required - WordPress runs in the browser
+* Fast startup times
+* Isolated testing environment
+* Works well with CI/CD pipelines
+
+## Setting Up WordPress Playground Locally
+
+1. Install the WordPress Playground CLI:
+
+```bash
+npm install -g @wordpress/playground-tools
+```
+
+2. Start WordPress Playground with our blueprint:
+
+```bash
+wp-playground start --blueprint playground/blueprint.json --port 8888
+```
+
+3. Open your browser and navigate to http://localhost:8888
+
+## Running Tests with WordPress Playground
+
+We have two blueprints for testing:
+
+1. `playground/blueprint.json` - For single site testing
+2. `playground/multisite-blueprint.json` - For multisite testing
+
+To run tests with WordPress Playground:
+
+1. Start WordPress Playground with the appropriate blueprint:
+
+```bash
+# For single site testing
+wp-playground start --blueprint playground/blueprint.json --port 8888
+
+# For multisite testing
+wp-playground start --blueprint playground/multisite-blueprint.json --port 8888
+```
+
+2. Run Cypress tests against WordPress Playground:
+
+```bash
+# For single site testing
+npm run test:single:headless
+
+# For multisite testing
+npm run test:multisite:headless
+```
+
+## Customizing Blueprints
+
+You can customize the blueprints to suit your testing needs. See the [WordPress Playground Blueprints documentation](https://wordpress.github.io/wordpress-playground/blueprints/) for more information.
+
+## CI/CD Integration
+
+We have a GitHub Actions workflow that uses WordPress Playground for testing. See `.github/workflows/playground-tests.yml` for more information.
+
+## Performance Testing
+
+We also use the [WP Performance Tests GitHub Action](https://github.com/marketplace/actions/wp-performance-tests) for performance testing. This action tests our plugin against various WordPress versions and PHP versions to ensure it performs well in different environments.

package.json

@@ -13,6 +13,10 @@
     "test:single:headless": "cypress run --config specPattern=cypress/e2e/single-site.cy.js",
     "test:multisite": "cypress open --config specPattern=cypress/e2e/multisite.cy.js",
     "test:multisite:headless": "cypress run --config specPattern=cypress/e2e/multisite.cy.js",
+    "playground:single": "wp-playground start --blueprint playground/blueprint.json --port 8888",
+    "playground:multisite": "wp-playground start --blueprint playground/multisite-blueprint.json --port 8888",
+    "test:playground:single": "npm run playground:single & sleep 10 && npm run test:single:headless",
+    "test:playground:multisite": "npm run playground:multisite & sleep 10 && npm run test:multisite:headless",
     "build": "./build.sh",
     "lint:php": "composer run-script phpcs",
     "lint:php:simple": "composer run-script phpcs:simple",

playground/blueprint.json

@@ -0,0 +1,25 @@
+{
+  "landingPage": "/wp-admin/",
+  "preferredVersions": {
+    "php": "8.0",
+    "wp": "latest"
+  },
+  "steps": [
+    {
+      "step": "login",
+      "username": "admin",
+      "password": "password"
+    },
+    {
+      "step": "installPlugin",
+      "pluginZipFile": {
+        "resource": "wordpress.org/plugins",
+        "slug": "wp-plugin-starter-template-for-ai-coding"
+      }
+    },
+    {
+      "step": "activatePlugin",
+      "pluginSlug": "wp-plugin-starter-template-for-ai-coding"
+    }
+  ]
+}

playground/multisite-blueprint.json

@@ -0,0 +1,65 @@
+{
+  "landingPage": "/wp-admin/network/",
+  "preferredVersions": {
+    "php": "8.0",
+    "wp": "latest"
+  },
+  "steps": [
+    {
+      "step": "defineWpConfig",
+      "name": "WP_ALLOW_MULTISITE",
+      "value": true
+    },
+    {
+      "step": "defineWpConfig",
+      "name": "MULTISITE",
+      "value": true
+    },
+    {
+      "step": "defineWpConfig",
+      "name": "SUBDOMAIN_INSTALL",
+      "value": false
+    },
+    {
+      "step": "defineWpConfig",
+      "name": "DOMAIN_CURRENT_SITE",
+      "value": "localhost"
+    },
+    {
+      "step": "defineWpConfig",
+      "name": "PATH_CURRENT_SITE",
+      "value": "/"
+    },
+    {
+      "step": "defineWpConfig",
+      "name": "SITE_ID_CURRENT_SITE",
+      "value": 1
+    },
+    {
+      "step": "defineWpConfig",
+      "name": "BLOG_ID_CURRENT_SITE",
+      "value": 1
+    },
+    {
+      "step": "login",
+      "username": "admin",
+      "password": "password"
+    },
+    {
+      "step": "installPlugin",
+      "pluginZipFile": {
+        "resource": "wordpress.org/plugins",
+        "slug": "wp-plugin-starter-template-for-ai-coding"
+      }
+    },
+    {
+      "step": "activatePlugin",
+      "pluginSlug": "wp-plugin-starter-template-for-ai-coding",
+      "networkWide": true
+    },
+    {
+      "step": "runPHP",
+      "code": "<?php\n// Create a test subsite\n$domain = 'localhost';\n$path = '/testsite/';\n$title = 'Test Subsite';\n$user_id = 1;\n\nif (!get_site_by_path($domain, $path)) {\n    $blog_id = wpmu_create_blog($domain, $path, $title, $user_id);\n    if (is_wp_error($blog_id)) {\n        echo 'Error creating subsite: ' . $blog_id->get_error_message();\n    } else {\n        echo 'Created subsite with ID: ' . $blog_id;\n    }\n} else {\n    echo 'Subsite already exists';\n}\n"
+    }
+  ]
+}