ui(test): enhance script output with visual formatting and colors

- Added color scheme (RED, GREEN, YELLOW, BLUE, PURPLE, CYAN, BOLD)
- Added emojis throughout for visual clarity
- Improved header formatting with decorative borders
- Enhanced test results display with colored output
- Added visual indicators for all status messages
- Made summary section more user-friendly and visually rich
- Script now outputs easy-to-understand visual summary
This commit is contained in:
Saravana Achu Mac 2026-05-09 14:01:57 -07:00
parent 62e9f00663
commit 2bd38e152c

View File

@ -4,6 +4,16 @@ set -e
# Test runner script for E2E tests
# Runs Playwright tests, builds reports, and checks health
# Colors for visual output
RED='\033[0;31m'
GREEN='\033[0;32m'
YELLOW='\033[1;33m'
BLUE='\033[0;34m'
PURPLE='\033[0;35m'
CYAN='\033[0;36m'
BOLD='\033[1m'
NC='\033[0m' # No Color
SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
PROJECT_ROOT="$(cd "$SCRIPT_DIR/../.." && pwd)"
WEB_DIR="$PROJECT_ROOT/web"
@ -13,15 +23,17 @@ PORT=3050
cd "$WEB_DIR"
echo "========================================="
echo "E2E Test Runner"
echo "========================================="
echo "Project root: $PROJECT_ROOT"
echo "Web directory: $WEB_DIR"
echo "Reports directory: $REPORTS_DIR"
echo "Timestamp: $TIMESTAMP"
echo "Port: $PORT"
echo "========================================="
echo ""
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
echo -e "${CYAN}${BOLD}🎭 E2E Test Runner${NC}"
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
echo -e "${BLUE}📁 Project root:${NC} ${BOLD}$PROJECT_ROOT${NC}"
echo -e "${BLUE}🌐 Web directory:${NC} ${BOLD}$WEB_DIR${NC}"
echo -e "${BLUE}📊 Reports directory:${NC} ${BOLD}$REPORTS_DIR${NC}"
echo -e "${BLUE}⏰ Timestamp:${NC} ${BOLD}$TIMESTAMP${NC}"
echo -e "${BLUE}🔌 Port:${NC} ${BOLD}$PORT${NC}"
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
echo ""
# Create reports directory
mkdir -p "$REPORTS_DIR"
@ -66,24 +78,25 @@ wait_for_server() {
# Kill any existing server on port 3050
echo ""
echo "Checking for existing server on port $PORT..."
echo -e "${YELLOW}🔍 Checking for existing server on port $PORT...${NC}"
kill_port $PORT
echo -e "${GREEN}✓ Port $PORT is clear${NC}"
# Check if node_modules exists
if [ ! -d "node_modules" ]; then
echo "Installing dependencies..."
echo -e "${YELLOW}📦 Installing dependencies...${NC}"
pnpm install
fi
# Check if Playwright is installed
if ! command -v npx playwright &> /dev/null; then
echo "Playwright not found, installing browsers..."
echo -e "${YELLOW}🎭 Playwright not found, installing browsers...${NC}"
pnpm exec playwright install chromium
fi
echo ""
echo "Starting dev server..."
echo "========================================="
echo -e "${CYAN}${BOLD}🚀 Starting dev server...${NC}"
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
# Start dev server in background
SERVER_PID=""
@ -93,19 +106,19 @@ SERVER_PID=$!
# Save PID for cleanup
echo $SERVER_PID > "$REPORTS_DIR/server-$TIMESTAMP.pid"
echo "Server PID: $SERVER_PID"
echo "Server log: $REPORTS_DIR/server-$TIMESTAMP.log"
echo -e "${BLUE}📌 Server PID:${NC} ${BOLD}$SERVER_PID${NC}"
echo -e "${BLUE}📋 Server log:${NC} ${BOLD}$REPORTS_DIR/server-$TIMESTAMP.log${NC}"
# Wait for server to be ready
if ! wait_for_server; then
echo "❌ Server failed to start. Check log: $REPORTS_DIR/server-$TIMESTAMP.log"
echo -e "${RED}❌ Server failed to start. Check log: $REPORTS_DIR/server-$TIMESTAMP.log${NC}"
kill_port $PORT
exit 1
fi
echo ""
echo "Running E2E tests..."
echo "========================================="
echo -e "${CYAN}${BOLD}🎭 Running E2E tests...${NC}"
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
# Run Playwright tests with JSON reporter for machine-readable output
START_TIME=$(date +%s)
@ -119,9 +132,9 @@ END_TIME=$(date +%s)
DURATION=$((END_TIME - START_TIME))
echo ""
echo "========================================="
echo "Test Results"
echo "========================================="
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
echo -e "${CYAN}${BOLD}📊 Test Results${NC}"
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
# Parse JSON results if available
if [ -f "$REPORTS_DIR/results-$TIMESTAMP.json" ]; then
@ -130,28 +143,30 @@ if [ -f "$REPORTS_DIR/results-$TIMESTAMP.json" ]; then
PASSED_TESTS=$(cat "$REPORTS_DIR/results-$TIMESTAMP.json" | grep -o '"status":"passed"' | wc -l || echo "0")
FAILED_TESTS=$(cat "$REPORTS_DIR/results-$TIMESTAMP.json" | grep -o '"status":"failed"' | wc -l || echo "0")
echo "Total tests: $TOTAL_TESTS"
echo "Passed: $PASSED_TESTS"
echo "Failed: $FAILED_TESTS"
echo "Duration: ${DURATION}s"
echo -e "${BLUE}📊 Total tests:${NC} ${BOLD}$TOTAL_TESTS${NC}"
echo -e "${GREEN}Passed:${NC} ${BOLD}$PASSED_TESTS${NC}"
echo -e "${RED}Failed:${NC} ${BOLD}$FAILED_TESTS${NC}"
echo -e "${BLUE}⏱️ Duration:${NC} ${BOLD}${DURATION}s${NC}"
else
TOTAL_TESTS=0
PASSED_TESTS=0
FAILED_TESTS=0
echo "Test count: 0 (tests did not run)"
echo -e "${YELLOW}⚠️ Test count: 0 (tests did not run)${NC}"
fi
if [ $TEST_EXIT_CODE -eq 0 ]; then
echo "✅ All tests passed"
echo ""
echo -e "${GREEN}${BOLD}✅ All tests passed${NC}"
STATUS="passed"
else
echo "❌ Some tests failed"
echo ""
echo -e "${RED}${BOLD}❌ Some tests failed${NC}"
STATUS="failed"
fi
echo ""
echo "Report location: $REPORTS_DIR"
echo "========================================="
echo -e "${BLUE}📁 Report location:${NC} ${BOLD}$REPORTS_DIR${NC}"
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
# Update JSON report with results
cat > "$REPORT_JSON" << EOF
@ -245,12 +260,12 @@ fi
# Cleanup: Kill the server
echo ""
echo "Cleaning up..."
echo "========================================="
echo "Stopping server (PID: $SERVER_PID)..."
echo -e "${CYAN}${BOLD}🧹 Cleaning up...${NC}"
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
echo -e "${YELLOW}🛑 Stopping server (PID: $SERVER_PID)...${NC}"
kill $SERVER_PID 2>/dev/null || true
kill_port $PORT
echo "✅ Server stopped"
echo -e "${GREEN}✓ Server stopped${NC}"
# Update health check in JSON
cat > "$SUMMARY_JSON" << EOF
@ -280,24 +295,24 @@ cat > "$SUMMARY_JSON" << EOF
EOF
echo ""
echo "========================================="
echo "Summary"
echo "========================================="
echo "Tests run: Complete"
echo "Status: $STATUS"
echo "JSON Report: $REPORT_JSON"
echo "Markdown Report: $REPORT_MD"
echo "AI Summary: $SUMMARY_JSON"
echo "HTML Report: $WEB_DIR/playwright-report/index.html"
echo "Health check: healthy"
echo "========================================="
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
echo -e "${CYAN}${BOLD}📋 Summary${NC}"
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
echo -e "${BLUE}✓ Tests run:${NC} ${BOLD}Complete${NC}"
echo -e "${BLUE}📊 Status:${NC} ${BOLD}$STATUS${NC}"
echo -e "${BLUE}📄 JSON Report:${NC} ${BOLD}$REPORT_JSON${NC}"
echo -e "${BLUE}📝 Markdown Report:${NC} ${BOLD}$REPORT_MD${NC}"
echo -e "${BLUE}🤖 AI Summary:${NC} ${BOLD}$SUMMARY_JSON${NC}"
echo -e "${BLUE}🌐 HTML Report:${NC} ${BOLD}$WEB_DIR/playwright-report/index.html${NC}"
echo -e "${BLUE}💚 Health check:${NC} ${BOLD}healthy${NC}"
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
echo -e "${GREEN}📁 Latest reports linked to:${NC} ${BOLD}$REPORTS_DIR/latest.{json,md,summary.json}${NC}"
echo -e "${PURPLE}${BOLD}═══════════════════════════════════════════════════════════════${NC}"
echo ""
# Create symlink to latest report
ln -sf "$REPORT_JSON" "$REPORTS_DIR/latest.json"
ln -sf "$REPORT_MD" "$REPORTS_DIR/latest.md"
ln -sf "$SUMMARY_JSON" "$REPORTS_DIR/latest-summary.json"
echo "Latest reports linked to: $REPORTS_DIR/latest.{json,md,summary.json}"
echo "========================================="
exit $TEST_EXIT_CODE