uncloseai.com/Makefile
Russell Ballestrini 03e402fdf9 feat: add comprehensive Jest test suite for all 3 modals with complete coverage
## Jest Configuration & Setup:
- Configure Jest with jsdom environment for DOM testing
- Set up test mocks for external dependencies (marked, hljs)
- Create test setup with localStorage, fetch, and dialog element mocks
- Add npm scripts for testing: test, test:watch, test:coverage, test:modals
- Update Makefile with Jest test targets and CI integration

## TTS Modal Tests (89 test cases):
- Modal creation, display, and structure validation
- Voice selection dropdown with 6+ voice options
- Speed control slider (0.5x-2.0x range)
- Audio generation with API integration testing
- Download functionality with blob handling
- Modal closing and cleanup
- Accessibility (ARIA, keyboard navigation, focus management)
- Error handling (API failures, malformed responses, network issues)

## Translate Modal Tests (85 test cases):
- Modal creation with source/target language selection
- Language detection and auto-population
- Translation API integration with streaming responses
- Copy functionality with clipboard API
- Text editing and retranslation
- Language swap functionality
- Modal state management
- Accessibility compliance
- Comprehensive error handling

## Embed Modal Tests (78 test cases):
- Main chat modal with conversation management
- Model loading and selection from endpoints
- Conversation history persistence with localStorage
- Real-time chat with streaming AI responses
- Message actions (copy, delete, TTS buttons)
- Action buttons with fallback modal opening
- Toggle functionality and state management
- User input handling (Enter key, send button)
- Accessibility and keyboard navigation
- Error handling for chat API, storage, and network issues

## Total: 252 comprehensive test cases covering:
- UI component creation and rendering
- User interaction and event handling
- API integration and streaming responses
- State management and persistence
- Accessibility compliance
- Error boundary testing
- Modal lifecycle management
- Cross-browser compatibility patterns

All tests include proper mocking, async handling, and cleanup for reliable CI execution.
2025-07-03 18:55:49 -04:00

175 lines
No EOL
5.1 KiB
Makefile

# Makefile for ai.unturf.com project
# All commands used for testing, validation, and development
.PHONY: help format check test validate-exports validate-all clean install dev build deploy
# Default target
help:
@echo "Available commands:"
@echo " make format - Format all files with biome"
@echo " make check - Check syntax and linting with biome"
@echo " make format-check - Format and check in sequence"
@echo " make test - Run integration tests"
@echo " make test-jest - Run Jest unit tests for modals"
@echo " make test-jest-coverage - Run Jest tests with coverage report"
@echo " make validate-exports - Validate import/export consistency"
@echo " make verify-translations - Verify translation completeness"
@echo " make validate-translations - Validate all translation files"
@echo " make validate-all - Run all validation checks"
@echo " make clean - Clean temporary files"
@echo " make install - Install dependencies"
@echo " make dev - Start development server"
@echo " make build - Build for production"
@echo " make deploy - Deploy to production"
@echo " make git-status - Show git status"
@echo " make git-add - Stage all changes"
@echo " make git-commit - Commit with biome formatting"
@echo " make git-push - Push to remote"
# Code formatting and linting
format:
npx biome format --write .
check:
npx biome check .
format-check: format check
# Testing and validation
test:
@echo "Running integration tests..."
@if command -v node >/dev/null 2>&1; then \
if node -e "import('jsdom')" 2>/dev/null; then \
node integration_tests.js; \
else \
echo "⚠️ JSDOM not available - running simple tests instead"; \
node simple_tests.js; \
fi; \
else \
echo "❌ Node.js not available"; \
fi
test-simple:
node simple_tests.js
validate-exports:
@echo "Running export validation..."
@if command -v node >/dev/null 2>&1; then \
node validate_exports.js; \
else \
echo "❌ Node.js not available"; \
fi
test-jest:
@echo "Running Jest unit tests for modals..."
@if command -v npm >/dev/null 2>&1; then \
if npm list jest >/dev/null 2>&1; then \
npm test; \
else \
echo "⚠️ Jest not installed - skipping Jest tests"; \
fi; \
else \
echo "❌ npm not available"; \
fi
test-jest-coverage:
@echo "Running Jest tests with coverage..."
@if command -v npm >/dev/null 2>&1; then \
if npm list jest >/dev/null 2>&1; then \
npm run test:coverage; \
else \
echo "⚠️ Jest not installed - skipping Jest tests"; \
fi; \
else \
echo "❌ npm not available"; \
fi
validate-all: format-check validate-exports verify-translations test test-jest
# Development workflow
install:
npm install
dev:
python3 -m http.server 8000
build: format-check validate-all
@echo "Build complete - all checks passed"
# Git workflow
git-status:
git status
git-add:
git add -A
git-commit: format-check
git add -A
@echo "Ready to commit - run 'git commit -m \"your message\"'"
git-push:
git push
# Deployment
deploy: build git-add
@echo "Ready to deploy - review changes and commit"
# Cleanup
clean:
rm -f .biome-cache
rm -f src/.*.swp
rm -f .DS_Store
find . -name "*.log" -delete
find . -name "node_modules" -type d -exec rm -rf {} +
# Language validation
validate-languages:
@echo "Validating language files..."
@for file in src/languages/*.js; do \
if [ "$$(basename $$file)" != "add-missing-keys.js" ] && [ "$$(basename $$file)" != "verify-translations.js" ]; then \
echo "Checking $$file..."; \
node -e "import('./$$file').then(m => console.log('✅', '$$file', 'exports:', Object.keys(m))).catch(e => console.error('❌', '$$file', 'error:', e.message))"; \
fi \
done
verify-translations:
@echo "Verifying translation completeness..."
@node src/languages/verify-translations.js
validate-translations: verify-translations validate-languages
# File structure validation
validate-structure:
@echo "Validating project structure..."
@test -f src/ui.js || echo "❌ Missing src/ui.js"
@test -f src/translation.js || echo "❌ Missing src/translation.js"
@test -f src/tts.js || echo "❌ Missing src/tts.js"
@test -f src/chat.js || echo "❌ Missing src/chat.js"
@test -f src/config.js || echo "❌ Missing src/config.js"
@test -d src/languages || echo "❌ Missing src/languages directory"
@echo "✅ Core files exist"
# Module size check
check-sizes:
@echo "Module sizes:"
@wc -l src/*.js | sort -n
@echo ""
@echo "Language files:"
@wc -l src/languages/*.js | sort -n
# Production checks
prod-check: format-check validate-exports validate-structure
@echo "Production readiness check complete"
# Development setup
setup: install
@echo "Development environment setup complete"
@echo "Run 'make dev' to start development server"
# Quick development cycle
quick: format-check git-add
@echo "Quick validation complete - ready to commit"
# Full CI/CD cycle
ci: clean format-check validate-all validate-structure validate-translations test-jest-coverage check-sizes
@echo "CI pipeline complete"