diff --git a/.github/workflows/playground-tests.yml b/.github/workflows/playground-tests.yml new file mode 100644 index 0000000..01e37f3 --- /dev/null +++ b/.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' diff --git a/.wiki/Playground-Testing.md b/.wiki/Playground-Testing.md new file mode 100644 index 0000000..684d378 --- /dev/null +++ b/.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. diff --git a/package.json b/package.json index a31c1f8..870f171 100644 --- a/package.json +++ b/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", diff --git a/playground/blueprint.json b/playground/blueprint.json new file mode 100644 index 0000000..1bc4d3e --- /dev/null +++ b/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" + } + ] +} diff --git a/playground/multisite-blueprint.json b/playground/multisite-blueprint.json new file mode 100644 index 0000000..a545bf6 --- /dev/null +++ b/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": "get_error_message();\n } else {\n echo 'Created subsite with ID: ' . $blog_id;\n }\n} else {\n echo 'Subsite already exists';\n}\n" + } + ] +}