wpallstars/wp-plugin-starter-template-for-ai-coding
Template
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix code quality issues: add ESLint config to Cypress files, update documentation, improve HTML accessibility

Browse Source
This commit is contained in:
Marcus Quinn
2025-04-22 15:11:56 +01:00
parent 3ca2fe58fa
commit f48276cc58
7 changed files with 32 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
.wiki/Playground-Testing.md
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: 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=11) 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/main/playground/blueprint.json&_t=1)
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=23) 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/main/playground/multisite-blueprint.json&_t=1)
These links will automatically set up WordPress with multisite enabled, WP_DEBUG enabled, and both the Plugin Toggle and Kadence Blocks plugins activated. These links will automatically set up WordPress with multisite enabled, WP_DEBUG enabled, and both the Plugin Toggle and Kadence Blocks plugins activated.
@@ -111,8 +111,8 @@ We have two blueprints for testing:
To run tests with WordPress Playground: To run tests with WordPress Playground:
1. Open the appropriate WordPress Playground link: 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=11) * [Single site](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/main/playground/blueprint.json&_t=1)
* [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=23) * [Multisite](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/main/playground/multisite-blueprint.json&_t=1)
2. Test the plugin manually in the browser 2. Test the plugin manually in the browser
@@ -122,6 +122,7 @@ We've also included HTML files that embed WordPress Playground:
1. Open `playground/index.html` in your browser for single site testing 1. Open `playground/index.html` in your browser for single site testing
2. Open `playground/multisite.html` in your browser for multisite testing 2. Open `playground/multisite.html` in your browser for multisite testing
3. Open `playground/test.html` in your browser for a unified interface with buttons to switch between single site and multisite
You can serve these files locally with a simple HTTP server: You can serve these files locally with a simple HTTP server:

7
.wiki/Testing.md
View File

@@ -106,11 +106,11 @@ 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: 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=9) 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/main/playground/blueprint.json&_t=1)
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=23) 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/main/playground/multisite-blueprint.json&_t=1)
These links will automatically set up WordPress with multisite enabled, WP_DEBUG enabled, and both the Plugin Toggle and Hello Dolly plugins activated. These links will automatically set up WordPress with multisite enabled, WP_DEBUG enabled, and both the Plugin Toggle and Kadence Blocks plugins activated.
#### Local Testing with HTML Files #### Local Testing with HTML Files
@@ -118,6 +118,7 @@ We've also included HTML files that embed WordPress Playground:
1. Open `playground/index.html` in your browser for single site testing 1. Open `playground/index.html` in your browser for single site testing
2. Open `playground/multisite.html` in your browser for multisite testing 2. Open `playground/multisite.html` in your browser for multisite testing
3. Open `playground/test.html` in your browser for a unified interface with buttons to switch between single site and multisite
You can serve these files locally with a simple HTTP server: You can serve these files locally with a simple HTTP server:

13
cypress/e2e/playground-multisite.cy.js
View File

@@ -1,8 +1,9 @@
/* eslint-env mocha, jquery, cypress */
describe('WordPress Playground Multisite Tests', () => { describe('WordPress Playground Multisite Tests', () => {
beforeEach(() => { beforeEach(() => {
// Visit the WordPress Playground page // Visit the WordPress Playground page
cy.visit('/multisite.html'); cy.visit('/multisite.html');
// Wait for the iframe to load // Wait for the iframe to load
cy.get('iframe').should('be.visible'); cy.get('iframe').should('be.visible');
}); });
@@ -29,13 +30,13 @@ describe('WordPress Playground Multisite Tests', () => {
// Navigate to network plugins page // Navigate to network plugins page
const $document = $iframe.contents(); const $document = $iframe.contents();
const $body = $document.find('body'); const $body = $document.find('body');
// Click on Network Admin in the admin bar // Click on Network Admin in the admin bar
cy.wrap($body).find('#wpadminbar #wp-admin-bar-network-admin a').click(); cy.wrap($body).find('#wpadminbar #wp-admin-bar-network-admin a').click();
// Click on Plugins in the network admin menu // Click on Plugins in the network admin menu
cy.wrap($body).find('#menu-plugins a[href*="plugins.php"]').first().click(); cy.wrap($body).find('#menu-plugins a[href*="plugins.php"]').first().click();
// Check if the plugin is network active // Check if the plugin is network active
cy.wrap($body).find('tr[data-slug="wp-plugin-starter-template-for-ai-coding"]').should('exist'); cy.wrap($body).find('tr[data-slug="wp-plugin-starter-template-for-ai-coding"]').should('exist');
cy.wrap($body).find('tr[data-slug="wp-plugin-starter-template-for-ai-coding"] .network_active').should('exist'); cy.wrap($body).find('tr[data-slug="wp-plugin-starter-template-for-ai-coding"] .network_active').should('exist');
@@ -46,11 +47,11 @@ describe('WordPress Playground Multisite Tests', () => {
cy.get('iframe').then($iframe => { cy.get('iframe').then($iframe => {
const $document = $iframe.contents(); const $document = $iframe.contents();
const $body = $document.find('body'); const $body = $document.find('body');
// Navigate to the network settings page // Navigate to the network settings page
cy.wrap($body).find('#wpadminbar #wp-admin-bar-network-admin a').click(); cy.wrap($body).find('#wpadminbar #wp-admin-bar-network-admin a').click();
cy.wrap($body).find('#menu-settings a[href*="settings.php"]').first().click(); cy.wrap($body).find('#menu-settings a[href*="settings.php"]').first().click();
// Check if the network settings page loaded correctly // Check if the network settings page loaded correctly
cy.wrap($body).find('h1').should('contain', 'Network Settings'); cy.wrap($body).find('h1').should('contain', 'Network Settings');
}); });

11
cypress/e2e/playground-single-site.cy.js
View File

@@ -1,8 +1,9 @@
/* eslint-env mocha, jquery, cypress */
describe('WordPress Playground Single Site Tests', () => { describe('WordPress Playground Single Site Tests', () => {
beforeEach(() => { beforeEach(() => {
// Visit the WordPress Playground page // Visit the WordPress Playground page
cy.visit('/index.html'); cy.visit('/index.html');
// Wait for the iframe to load // Wait for the iframe to load
cy.get('iframe').should('be.visible'); cy.get('iframe').should('be.visible');
}); });
@@ -29,10 +30,10 @@ describe('WordPress Playground Single Site Tests', () => {
// Navigate to plugins page // Navigate to plugins page
const $document = $iframe.contents(); const $document = $iframe.contents();
const $body = $document.find('body'); const $body = $document.find('body');
// Click on Plugins in the admin menu // Click on Plugins in the admin menu
cy.wrap($body).find('#menu-plugins a[href*="plugins.php"]').first().click(); cy.wrap($body).find('#menu-plugins a[href*="plugins.php"]').first().click();
// Check if the plugin is active // Check if the plugin is active
cy.wrap($body).find('tr[data-slug="wp-plugin-starter-template-for-ai-coding"]').should('exist'); cy.wrap($body).find('tr[data-slug="wp-plugin-starter-template-for-ai-coding"]').should('exist');
}); });
@@ -42,11 +43,11 @@ describe('WordPress Playground Single Site Tests', () => {
cy.get('iframe').then($iframe => { cy.get('iframe').then($iframe => {
const $document = $iframe.contents(); const $document = $iframe.contents();
const $body = $document.find('body'); const $body = $document.find('body');
// Navigate to the plugin settings page // Navigate to the plugin settings page
cy.wrap($body).find('#menu-settings a[href*="options-general.php"]').first().click(); cy.wrap($body).find('#menu-settings a[href*="options-general.php"]').first().click();
cy.wrap($body).find('a[href*="options-general.php?page=wp-plugin-starter-template"]').click(); cy.wrap($body).find('a[href*="options-general.php?page=wp-plugin-starter-template"]').click();
// Check if the settings page loaded correctly // Check if the settings page loaded correctly
cy.wrap($body).find('h1').should('contain', 'WP Plugin Starter Template'); cy.wrap($body).find('h1').should('contain', 'WP Plugin Starter Template');
}); });

2
playground/index.html
View File

@@ -21,6 +21,6 @@
</style> </style>
</head> </head>
<body> <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=11" title="WordPress Playground Single Site Environment"></iframe> <iframe src="https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/main/playground/blueprint.json&_t=1" title="WordPress Playground Single Site Environment"></iframe>
</body> </body>
</html> </html>

2
playground/multisite.html
View File

@@ -21,6 +21,6 @@
</style> </style>
</head> </head>
<body> <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/multisite-blueprint.json&_t=24" title="WordPress Playground Multisite Environment"></iframe> <iframe src="https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wpallstars/wp-plugin-starter-template-for-ai-coding/main/playground/multisite-blueprint.json&_t=1" title="WordPress Playground Multisite Environment"></iframe>
</body> </body>
</html> </html>

10
playground/test.html
View File

@@ -39,12 +39,18 @@
</head> </head>
<body> <body>
<div class="buttons"> <div class="buttons">
<button onclick="loadSingleSite()">Single Site</button> <button type="button" id="singleSiteBtn">Single Site</button>
<button onclick="loadMultisite()">Multisite</button> <button type="button" id="multisiteBtn">Multisite</button>
</div> </div>
<iframe id="playground" src="about:blank" title="WordPress Playground Test Environment"></iframe> <iframe id="playground" src="about:blank" title="WordPress Playground Test Environment"></iframe>
<script> <script>
// Use unobtrusive event listeners instead of inline handlers
document.addEventListener('DOMContentLoaded', function() {
document.getElementById('singleSiteBtn').addEventListener('click', loadSingleSite);
document.getElementById('multisiteBtn').addEventListener('click', loadMultisite);
});
function loadSingleSite() { function loadSingleSite() {
document.getElementById('playground').src = "https://playground.wordpress.net/?blueprint=" + encodeURIComponent(JSON.stringify(singleSiteBlueprint)); document.getElementById('playground').src = "https://playground.wordpress.net/?blueprint=" + encodeURIComponent(JSON.stringify(singleSiteBlueprint));
} }