Run validation suite on target project (browser, terminal, visual analysis)
Runs comprehensive validation on a target project using browser automation, visual analysis, and terminal monitoring to detect UI and runtime errors. Use this before deployment or after major changes to catch issues early.
/plugin marketplace add MartyBonacci/specswarm/plugin install specswarm@specswarm$ARGUMENTS
You MUST consider the user input before proceeding (if not empty).
Run comprehensive validation on a target project using:
Usage: /speclabs:orchestrate-validate <project-path> [url]
Examples:
# Validate project at specific path
/speclabs:orchestrate-validate /home/marty/code-projects/tweeter-spectest
# Validate with custom URL
/speclabs:orchestrate-validate /home/marty/code-projects/tweeter-spectest http://localhost:5173
echo "šÆ Project Orchestrator - Validation Suite"
echo ""
echo "Phase 0: Research & De-Risk"
echo "Testing: Browser automation + Visual analysis"
echo ""
# Record start time
VALIDATION_START_TIME=$(date +%s)
# Get arguments
ARGS="$ARGUMENTS"
# Parse project path (required)
PROJECT_PATH=$(echo "$ARGS" | awk '{print $1}')
# Parse URL (optional, default to http://localhost:5173)
URL=$(echo "$ARGS" | awk '{print $2}')
if [ -z "$URL" ]; then
URL="http://localhost:5173"
fi
# Validate project path
if [ -z "$PROJECT_PATH" ]; then
echo "ā Error: Project path required"
echo ""
echo "Usage: /speclabs:orchestrate-validate <project-path> [url]"
echo ""
echo "Example:"
echo "/speclabs:orchestrate-validate /home/marty/code-projects/tweeter-spectest"
exit 1
fi
if [ ! -d "$PROJECT_PATH" ]; then
echo "ā Error: Project path does not exist: $PROJECT_PATH"
exit 1
fi
echo "š Project: $PROJECT_PATH"
echo "š URL: $URL"
echo ""
echo "š Checking if dev server is running..."
echo ""
# Try to connect to URL
HTTP_STATUS=$(curl -s -o /dev/null -w "%{http_code}" "$URL" 2>/dev/null || echo "000")
if [ "$HTTP_STATUS" = "000" ]; then
echo "ā ļø Dev server not running at $URL"
echo ""
echo "Please start dev server first:"
echo " cd $PROJECT_PATH"
echo " npm run dev"
echo ""
exit 1
fi
echo "ā
Dev server responding (HTTP $HTTP_STATUS)"
echo ""
NOTE: For Phase 0, we'll create a simple Node.js script to run Playwright validation.
First, check if Playwright is available in the project:
echo "š± Running Browser Validation..."
echo ""
# Check if Playwright is installed in project
cd "$PROJECT_PATH"
if [ ! -d "node_modules/playwright" ]; then
echo "ā ļø Playwright not installed in project"
echo ""
echo "Installing Playwright..."
npm install --save-dev playwright
if [ $? -ne 0 ]; then
echo "ā Failed to install Playwright"
exit 1
fi
echo "ā
Playwright installed"
echo ""
fi
Now create and run validation script:
// Create temporary validation script
const validationScript = `
const { chromium } = require('playwright');
(async () => {
console.log('š Launching browser...');
const browser = await chromium.launch({ headless: true });
const page = await browser.newPage();
// Track console errors
const consoleErrors = [];
page.on('console', msg => {
if (msg.type() === 'error') {
consoleErrors.push(msg.text());
}
});
// Track network errors
const networkErrors = [];
page.on('response', response => {
if (response.status() >= 400) {
networkErrors.push({
url: response.url(),
status: response.status()
});
}
});
try {
// Navigate to app
console.log('š Navigating to ${URL}...');
await page.goto('${URL}', { waitUntil: 'networkidle', timeout: 30000 });
// Wait for any dynamic content
await page.waitForTimeout(2000);
// Capture screenshot
console.log('šø Capturing screenshot...');
await page.screenshot({
path: '/tmp/orchestrator-validation-screenshot.png',
fullPage: true
});
// Get page title
const title = await page.title();
console.log('');
console.log('ā
Browser Validation Complete');
console.log('');
console.log('Page Title:', title);
console.log('Console Errors:', consoleErrors.length);
console.log('Network Errors:', networkErrors.length);
console.log('');
if (consoleErrors.length > 0) {
console.log('š“ Console Errors:');
consoleErrors.forEach((err, i) => {
console.log(\` \${i + 1}. \${err}\`);
});
console.log('');
}
if (networkErrors.length > 0) {
console.log('š“ Network Errors:');
networkErrors.forEach((err, i) => {
console.log(\` \${i + 1}. \${err.status} - \${err.url}\`);
});
console.log('');
}
if (consoleErrors.length === 0 && networkErrors.length === 0) {
console.log('ā
No errors detected!');
console.log('');
}
// Export results as JSON
const results = {
success: true,
url: '${URL}',
title: title,
consoleErrors: consoleErrors,
networkErrors: networkErrors,
screenshotPath: '/tmp/orchestrator-validation-screenshot.png',
timestamp: new Date().toISOString()
};
require('fs').writeFileSync(
'/tmp/orchestrator-validation-results.json',
JSON.stringify(results, null, 2)
);
} catch (error) {
console.error('ā Browser validation failed:', error.message);
const results = {
success: false,
error: error.message,
timestamp: new Date().toISOString()
};
require('fs').writeFileSync(
'/tmp/orchestrator-validation-results.json',
JSON.stringify(results, null, 2)
);
process.exit(1);
} finally {
await browser.close();
}
})();
`;
Write and execute the script:
# Write validation script
echo "$validationScript" > /tmp/orchestrator-validate.js
# Run validation
cd "$PROJECT_PATH"
node /tmp/orchestrator-validate.js
PLAYWRIGHT_EXIT_CODE=$?
# Check results
if [ $PLAYWRIGHT_EXIT_CODE -ne 0 ]; then
echo "ā Browser validation failed"
exit 1
fi
For Phase 0, we'll use the Read tool to view the screenshot, since we're already in Claude Code context:
echo "šļø Visual Analysis..."
echo ""
echo "Screenshot saved to: /tmp/orchestrator-validation-screenshot.png"
echo ""
echo "To analyze the screenshot, use:"
echo "Read tool with: /tmp/orchestrator-validation-screenshot.png"
echo ""
ACTION REQUIRED: Use the Read tool to view /tmp/orchestrator-validation-screenshot.png and provide visual analysis:
echo "š Validation Report"
echo "===================="
echo ""
echo "Project: $PROJECT_PATH"
echo "URL: $URL"
echo ""
# Read results
if [ -f "/tmp/orchestrator-validation-results.json" ]; then
# Parse JSON results (simplified for Phase 0)
TITLE=$(cat /tmp/orchestrator-validation-results.json | grep '"title"' | sed 's/.*: "\(.*\)",/\1/')
CONSOLE_ERRORS=$(cat /tmp/orchestrator-validation-results.json | grep -c '"consoleErrors"')
NETWORK_ERRORS=$(cat /tmp/orchestrator-validation-results.json | grep -c '"networkErrors"')
echo "ā
Browser Validation: PASSED"
echo " Page Title: $TITLE"
echo " Console Errors: (check results JSON)"
echo " Network Errors: (check results JSON)"
echo ""
echo "š Full results: /tmp/orchestrator-validation-results.json"
echo "šø Screenshot: /tmp/orchestrator-validation-screenshot.png"
echo ""
fi
echo ""
echo "š£ Post-Validation Hook"
echo ""
# Calculate duration
VALIDATION_END_TIME=$(date +%s)
VALIDATION_DURATION=$((VALIDATION_END_TIME - VALIDATION_START_TIME))
echo "ā±ļø Validation Duration: ${VALIDATION_DURATION}s"
echo ""
# Cleanup temporary files (optional)
# rm -f /tmp/orchestrator-validate.js
echo "ā
Validation Complete"
echo ""
echo "š Next Steps:"
echo "1. Review screenshot: /tmp/orchestrator-validation-screenshot.png"
echo "2. Review full results: /tmp/orchestrator-validation-results.json"
echo "3. If validation passed, ready for orchestrate"
echo ""
If project path is invalid:
If dev server not running:
If Playwright installation fails:
If browser navigation fails:
ā Playwright browser automation works ā Can navigate to target app ā Console errors captured ā Network errors captured ā Screenshot captured successfully ā Results exported as JSON ā Validation report generated
Current Limitations:
Phase 1 Enhancements: