Blog Smoke Tests Skill
Run Playwright smoke tests against the Denser blog application.
Features
- 15 smoke tests organized by priority (P0-P4)
- Retry logic - max 3 attempts per failing test
- Headed/headless modes - choose visible or background execution
- Artifact collection - screenshots and trace.zip on failures
- HTML report - comprehensive test results report
- Tracing - Playwright traces for debugging failures
Workflow
Step 1: Ask User Preferences
Before running tests, ask user:
-
Target environment:
-
Browser mode:
- Headed (default) - visible browser, good for debugging
- Headless - faster, for CI/CD
-
Test scope:
- All - run all 15 tests
- P0 - critical tests only (SMOKE-01, 04, 08)
- P1 - important tests (SMOKE-05, 06, 07)
- P2 - tooltip tests (SMOKE-02, 03, 09)
- P3 - navigation tests (SMOKE-10, 11, 12)
- P4 - additional tests (SMOKE-13, 14, 15)
Step 2: Prepare Directories
# Create temp and report directories
mkdir -p /storage1/denser/apps/blog/playwright/temp_ai_script_tests
mkdir -p /storage1/denser/apps/blog/playwright/temp_ai_report_tests
# Copy test scripts
cp /storage1/denser/.claude/skills/blog-smoke-tests/scripts/smoke-*.mjs /storage1/denser/apps/blog/playwright/temp_ai_script_tests/
Step 3: Run Tests with Retry Logic
For each test:
- Run test script with
REPORT_DIR set
- If FAIL, retry up to 2 more times (max 3 attempts total)
- Wait 2 seconds between retries
- Collect JSON result from output (line starting with
__RESULT__)
- On failure: artifacts saved automatically (screenshot + trace.zip)
Command to run single test:
cd /storage1/denser/apps/blog
BASE_URL=https://blog.openhive.network HEADLESS=false REPORT_DIR=./playwright/temp_ai_report_tests pnpm exec node playwright/temp_ai_script_tests/smoke-XX-name.mjs
Replace:
BASE_URL=https://blog.openhive.network with chosen environment URLHEADLESS=false with HEADLESS=true for headless mode
Parsing JSON result:
Each test outputs a JSON line prefixed with __RESULT__:
__RESULT__{"id":"SMOKE-01","name":"Homepage Posts","priority":"P0","passed":true,"error":null,"artifacts":[]}
Step 4: Generate HTML Report
After running all tests, collect results and generate HTML report:
# Option 1: Using generate-report.mjs script
cd /storage1/denser/apps/blog
pnpm exec node /storage1/denser/.claude/skills/blog-smoke-tests/scripts/generate-report.mjs '[results-json-array]'
Alternatively, create report manually based on collected results.
Report location: ./playwright/temp_ai_report_tests/report.html
Step 5: Cleanup
After all tests complete:
rm -f /storage1/denser/apps/blog/playwright/temp_ai_script_tests/smoke-*.mjs
Keep report directory with:
report.html - HTML test reportSMOKE-XX-failure.png - screenshots of failuresSMOKE-XX-trace.zip - Playwright traces for failures
Step 6: Summary
Present results:
========================================
SMOKE TEST SUMMARY: X/Y PASSED
========================================
✓ [P0] SMOKE-01: Homepage Posts
✓ [P0] SMOKE-04: Post Navigation
✓ [P0] SMOKE-08: User Profile
✓ [P1] SMOKE-05: Votes API
...
✗ [P3] SMOKE-11: Categories (3 attempts)
...
========================================
HTML Report: ./playwright/temp_ai_report_tests/report.html
Artifacts: ./playwright/temp_ai_report_tests/
To view traces: npx playwright show-trace ./playwright/temp_ai_report_tests/SMOKE-XX-trace.zip
Artifacts on Failure
When a test fails, the following artifacts are saved:
| Artifact | Description | Location |
|---|
| Screenshot | Full page screenshot at failure | SMOKE-XX-failure.png |
| Trace | Playwright trace with snapshots | SMOKE-XX-trace.zip |
Viewing Traces:
cd /storage1/denser/apps/blog
npx playwright show-trace ./playwright/temp_ai_report_tests/SMOKE-04-trace.zip
Test Catalog
| Priority | ID | Name | Script |
|---|
| P0 | SMOKE-01 | Homepage Posts | smoke-01-homepage-posts.mjs |
| P0 | SMOKE-04 | Post Navigation | smoke-04-post-navigation.mjs |
| P0 | SMOKE-08 | User Profile | smoke-08-profile.mjs |
| P1 | SMOKE-05 | Votes API | smoke-05-votes-api.mjs |
| P1 | SMOKE-06 | Comments | smoke-06-comments.mjs |
| P1 | SMOKE-07 | Payout | smoke-07-payout.mjs |
| P2 | SMOKE-02 | Votes Tooltip | smoke-02-votes-tooltip.mjs |
| P2 | SMOKE-03 | Payout Tooltip |
Retry Logic Pattern
const MAX_RETRIES = 3;
const results = [];
for (const test of tests) {
let passed = false;
let attempts = 0;
let lastError = null;
let artifacts = [];
for (let attempt = 1; attempt <= MAX_RETRIES; attempt++) {
attempts = attempt;
const output = await runTest(test);
// Parse __RESULT__ from output
const resultLine = output.match(/__RESULT__(.+)/);
if (resultLine) {
const result = JSON.parse(resultLine[1]);
passed = result.passed;
lastError = result.error;
artifacts = result.artifacts;
}
if (passed) break;
if (attempt < MAX_RETRIES) {
console.log(`Retry ${attempt + 1}/${MAX_RETRIES} in 2 seconds...`);
await sleep(2000);
}
}
results.push({
id: test.id,
name: test.name,
priority: test.priority,
passed,
attempts,
error: lastError,
artifacts
});
}
Environment Variables
| Variable | Description | Default |
|---|
BASE_URL | Target environment URL | https://blog.openhive.network |
HEADLESS | Run browser in headless mode | false (headed) |
REPORT_DIR | Directory for artifacts and report | ./playwright/temp_ai_report_tests |
Available Environments
| Environment | URL |
|---|
| Production | https://blog.openhive.network |
| Dev | https://blog.dev.openhive.network |
| Localhost | http://localhost:3000 |
Reference Documentation
- Test patterns and selectors: See references/test-selectors.md
- Full documentation:
/storage1/denser/docs/playwright-testing-notes.md
- Blog architecture:
/storage1/denser/docs/denser-blog-architecture.md
Directories
