playwright-mcp/test-backup-automation.cjs
Ryan Malloy 6120506e91
Some checks failed
CI / test (ubuntu-latest) (push) Has been cancelled
CI / test (windows-latest) (push) Has been cancelled
CI / test_docker (push) Has been cancelled
CI / lint (push) Has been cancelled
CI / test (macos-latest) (push) Has been cancelled
feat: comprehensive MCP client debug enhancements and voice collaboration
Adds revolutionary features for MCP client identification and browser automation:

MCP Client Debug System:
- Floating pill toolbar with client identification and session info
- Theme system with 5 built-in themes (minimal, corporate, hacker, glass, high-contrast)
- Custom theme creation API with CSS variable overrides
- Cross-site validation ensuring toolbar persists across navigation
- Session-based injection with persistence across page loads

Voice Collaboration (Prototype):
- Web Speech API integration for conversational browser automation
- Bidirectional voice communication between AI and user
- Real-time voice guidance during automation tasks
- Documented architecture and future development roadmap

Code Injection Enhancements:
- Model collaboration API for notify, prompt, and inspector functions
- Auto-injection and persistence options
- Toolbar integration with code injection system

Documentation:
- Comprehensive technical achievement documentation
- Voice collaboration architecture and implementation guide
- Theme system integration documentation
- Tool annotation templates for consistency

This represents a major advancement in browser automation UX, enabling
unprecedented visibility and interaction patterns for MCP clients.
2025-11-14 21:36:08 -07:00

143 lines
6.1 KiB
JavaScript

// WordPress Backup Testing Script
// This script will test the backup functionality using playwright
const { chromium } = require('playwright');
async function testBackupFunctionality() {
console.log('🚀 Starting WordPress backup functionality test...');
const browser = await chromium.launch({
headless: false, // Show browser for debugging
slowMo: 1000 // Slow down actions for visibility
});
const context = await browser.newContext({
viewport: { width: 1280, height: 720 }
});
const page = await context.newPage();
try {
// Navigate to WordPress admin
console.log('📍 Navigating to WordPress admin...');
await page.goto('https://9lives.l.supported.systems/wp-admin');
// Wait for login page to load
await page.waitForSelector('#loginform', { timeout: 10000 });
console.log('✅ Login page loaded');
// You'll need to add credentials here or handle authentication
console.log('⚠️ Authentication required - please login manually');
console.log(' Username: [admin credentials needed]');
console.log(' Password: [admin credentials needed]');
// Wait for manual login (you could automate this with credentials)
console.log('⏳ Waiting 30 seconds for manual login...');
await page.waitForTimeout(30000);
// Navigate to backup page
console.log('📍 Navigating to backup page...');
await page.goto('https://9lives.l.supported.systems/wp-admin/admin.php?page=tigerstyle-life9-complete-backup');
// Wait for backup page to load
await page.waitForSelector('form', { timeout: 10000 });
console.log('✅ Backup page loaded');
// Take screenshot of the backup page
const screenshotPath = `/home/rpm/wp-robbie/src/tigerstyle-life9/@artifacts/screenshots/${new Date().toISOString().split('T')[0]}/backup-page-${Date.now()}.png`;
await page.screenshot({
path: screenshotPath,
fullPage: true
});
console.log(`📸 Screenshot saved: ${screenshotPath}`);
// Fill out the backup form
console.log('📝 Filling out backup form...');
// Look for backup name field
const nameField = await page.locator('input[name="backup_name"], input[type="text"]').first();
if (await nameField.isVisible()) {
await nameField.fill('test-pclzip-backup');
console.log('✅ Backup name set: test-pclzip-backup');
}
// Check "Include Files" if available
const includeFilesCheckbox = await page.locator('input[name*="files"], input[value*="files"]').first();
if (await includeFilesCheckbox.isVisible()) {
await includeFilesCheckbox.check();
console.log('✅ Include Files checked');
}
// Check "Include Database" if available
const includeDatabaseCheckbox = await page.locator('input[name*="database"], input[value*="database"]').first();
if (await includeDatabaseCheckbox.isVisible()) {
await includeDatabaseCheckbox.check();
console.log('✅ Include Database checked');
}
// Take screenshot before submission
const preSubmitScreenshot = `/home/rpm/wp-robbie/src/tigerstyle-life9/@artifacts/screenshots/${new Date().toISOString().split('T')[0]}/backup-form-filled-${Date.now()}.png`;
await page.screenshot({
path: preSubmitScreenshot,
fullPage: true
});
console.log(`📸 Pre-submission screenshot: ${preSubmitScreenshot}`);
// Submit the form
console.log('🚀 Submitting backup form...');
const submitButton = await page.locator('input[type="submit"], button[type="submit"]').first();
if (await submitButton.isVisible()) {
await submitButton.click();
console.log('✅ Form submitted');
// Wait for response
await page.waitForTimeout(5000);
// Take screenshot of result
const resultScreenshot = `/home/rpm/wp-robbie/src/tigerstyle-life9/@artifacts/screenshots/${new Date().toISOString().split('T')[0]}/backup-result-${Date.now()}.png`;
await page.screenshot({
path: resultScreenshot,
fullPage: true
});
console.log(`📸 Result screenshot: ${resultScreenshot}`);
// Check for success or error messages
const successMessages = await page.locator('.notice-success, .updated, .success').count();
const errorMessages = await page.locator('.notice-error, .error').count();
console.log(`✅ Success messages found: ${successMessages}`);
console.log(`❌ Error messages found: ${errorMessages}`);
// Log any visible error text
const errors = await page.locator('.notice-error, .error').allTextContents();
if (errors.length > 0) {
console.log('❌ Error details:', errors);
}
// Log any visible success text
const successes = await page.locator('.notice-success, .updated, .success').allTextContents();
if (successes.length > 0) {
console.log('✅ Success details:', successes);
}
} else {
console.log('❌ Submit button not found');
}
} catch (error) {
console.error('❌ Test failed:', error);
// Take error screenshot
const errorScreenshot = `/home/rpm/wp-robbie/src/tigerstyle-life9/@artifacts/screenshots/${new Date().toISOString().split('T')[0]}/backup-error-${Date.now()}.png`;
await page.screenshot({
path: errorScreenshot,
fullPage: true
});
console.log(`📸 Error screenshot: ${errorScreenshot}`);
} finally {
await browser.close();
console.log('🏁 Test completed');
}
}
// Run the test
testBackupFunctionality().catch(console.error);