104 lines
3.8 KiB
Bash
Executable File
104 lines
3.8 KiB
Bash
Executable File
#!/bin/bash
|
|
# ╔═══════════════════════════════════════════════════════════════════╗
|
|
# ║ Example Web Test — Form Submission & Navigation ║
|
|
# ╠═══════════════════════════════════════════════════════════════════╣
|
|
# ║ CUSTOMIZE: Replace URLs, selectors, and assertions for your app. ║
|
|
# ║ ║
|
|
# ║ Usage: bash .pi/skills/qa-automation/qa-web/flows/example-web-test.sh
|
|
# ╚═══════════════════════════════════════════════════════════════════╝
|
|
|
|
set -euo pipefail
|
|
|
|
SCRIPT_DIR="$(cd "$(dirname "$0")" && pwd)"
|
|
source "$SCRIPT_DIR/../lib/web-helpers.sh"
|
|
|
|
TEST_NAME="web-form-test"
|
|
setup_test "$TEST_NAME"
|
|
|
|
# ── Step 1: Open the web app ────────────────────────────────────────
|
|
step "Open web app"
|
|
web_open "$WEB_BASE_URL"
|
|
web_screenshot "01-homepage"
|
|
|
|
url=$(web_get_url)
|
|
log_info "URL: $url"
|
|
log_pass "Web app loaded"
|
|
|
|
# ── Step 2: Take a snapshot of interactive elements ──────────────────
|
|
step "Snapshot interactive elements"
|
|
snapshot=$(web_snapshot)
|
|
log_info "Snapshot:"
|
|
echo "$snapshot" | head -20
|
|
|
|
web_screenshot "02-snapshot"
|
|
|
|
# ── Step 3: Navigate to a page ──────────────────────────────────────
|
|
# CUSTOMIZE: Change the selector to match your app's navigation
|
|
step "Navigate to a page"
|
|
# web_click @e3 # Click a nav link (use ref from snapshot)
|
|
# Or navigate directly:
|
|
# web_open "$WEB_BASE_URL/about"
|
|
sleep 1
|
|
|
|
url=$(web_get_url)
|
|
log_info "URL after navigation: $url"
|
|
web_screenshot "03-navigated"
|
|
log_pass "Navigation successful"
|
|
|
|
# ── Step 4: Fill and submit a form ──────────────────────────────────
|
|
# CUSTOMIZE: Replace with your app's form fields
|
|
step "Fill form (if present)"
|
|
# web_snapshot # Get fresh refs
|
|
# web_fill @e1 "Jane Doe"
|
|
# web_fill @e2 "jane@example.com"
|
|
# web_click @e5 # Submit button
|
|
# web_wait_network
|
|
# web_screenshot "04-form-submitted"
|
|
|
|
log_info "Form step skipped — customize for your app"
|
|
web_screenshot "04-current-state"
|
|
|
|
# ── Step 5: Check responsive layout ─────────────────────────────────
|
|
step "Check responsive layouts"
|
|
|
|
# Desktop
|
|
web_set_viewport 1440 900
|
|
sleep 1
|
|
web_screenshot "05a-desktop"
|
|
log_pass "Desktop viewport captured"
|
|
|
|
# Tablet
|
|
web_set_viewport 768 1024
|
|
sleep 1
|
|
web_screenshot "05b-tablet"
|
|
log_pass "Tablet viewport captured"
|
|
|
|
# Mobile
|
|
web_set_viewport 375 812
|
|
sleep 1
|
|
web_screenshot "05c-mobile"
|
|
log_pass "Mobile viewport captured"
|
|
|
|
# Reset
|
|
web_set_viewport "$WEB_VIEWPORT_WIDTH" "$WEB_VIEWPORT_HEIGHT"
|
|
|
|
# ── Step 6: Final state ─────────────────────────────────────────────
|
|
step "Final state check"
|
|
title=$(web_get_title)
|
|
url=$(web_get_url)
|
|
log_info "Title: $title"
|
|
log_info "URL: $url"
|
|
|
|
web_screenshot "06-final"
|
|
log_pass "Web test complete"
|
|
|
|
# ── Cleanup ──────────────────────────────────────────────────────────
|
|
web_close
|
|
|
|
teardown_test
|
|
|
|
echo ""
|
|
echo "Web test completed!"
|
|
echo " Screenshots: $SCREENSHOT_DIR/$TEST_NAME/"
|
|
echo ""
|