markitect-main/capabilities/testdrive-jsui/Makefile

# TestDrive-JSUI Capability Makefile
# JavaScript UI testing framework for MarkiTect

# Capability metadata
CAPABILITY_NAME := testdrive-jsui
CAPABILITY_DESCRIPTION := JavaScript UI testing framework with Python integration

# Python virtual environment detection
VENV_PYTHON := $(shell which python3 2>/dev/null || which python 2>/dev/null)
ifeq ($(VENV_PYTHON),)
	VENV_PYTHON := python
endif

# Node.js detection
NODE := $(shell command -v node 2> /dev/null)
NPM := $(shell command -v npm 2> /dev/null)

# Default target
.PHONY: help
help: ## Show testdrive-jsui capability help
	@echo "🧪 TestDrive-JSUI Capability"
	@echo "============================"
	@echo ""
	@echo "JavaScript UI Testing Framework for MarkiTect"
	@echo ""
	@echo "Environment Setup:"
	@echo "  testdrive-jsui-install          Install Python package"
	@echo "  testdrive-jsui-install-dev      Install with development dependencies"
	@echo "  testdrive-jsui-install-js       Install JavaScript dependencies"
	@echo "  testdrive-jsui-setup            Complete setup (Python + JavaScript)"
	@echo ""
	@echo "Testing:"
	@echo "  testdrive-jsui-test-js          Run JavaScript tests only"
	@echo "  testdrive-jsui-test-python      Run Python tests only"
	@echo "  testdrive-jsui-test-js-fixes    Run JavaScript fixes test"
	@echo "  testdrive-jsui-test-html        Run HTML integration tests (opens in browser)"
	@echo "  testdrive-jsui-test-integration Run Python-JS integration tests"
	@echo "  testdrive-jsui-test-all         Run all tests (JS + Python + Integration + HTML)"
	@echo ""
	@echo "Development:"
	@echo "  testdrive-jsui-lint-js          Lint JavaScript code"
	@echo "  testdrive-jsui-lint-python      Lint Python code"
	@echo "  testdrive-jsui-format-python    Format Python code with black"
	@echo "  testdrive-jsui-watch            Watch mode for JavaScript tests"
	@echo ""
	@echo "Utilities:"
	@echo "  testdrive-jsui-status           Show capability status"
	@echo "  testdrive-jsui-clean            Clean build artifacts"
	@echo "  testdrive-jsui-info             Show environment information"
	@echo "  testdrive-jsui-list-components  List all UI components with descriptions"
	@echo "  testdrive-jsui-list-components-detailed   List components with detailed info"
	@echo "  testdrive-jsui-list-components-json       List components in JSON format"

# Environment status check
.PHONY: testdrive-jsui-status
testdrive-jsui-status: ## Show capability status
	@echo "🧪 TestDrive-JSUI Status"
	@echo "========================"
	@echo ""
ifdef NODE
	@echo "✅ Node.js: $(shell node --version)"
else
	@echo "❌ Node.js: Not found"
endif
ifdef NPM
	@echo "✅ npm: $(shell npm --version)"
else
	@echo "❌ npm: Not found"
endif
	@echo "✅ Python: $(shell $(VENV_PYTHON) --version)"
	@if [ -f "package.json" ]; then \
		echo "✅ package.json: Available"; \
	else \
		echo "❌ package.json: Missing"; \
	fi
	@if [ -f "pyproject.toml" ]; then \
		echo "✅ pyproject.toml: Available"; \
	else \
		echo "❌ pyproject.toml: Missing"; \
	fi
	@if [ -d "node_modules" ]; then \
		echo "✅ JavaScript dependencies: Installed"; \
	else \
		echo "❌ JavaScript dependencies: Not installed"; \
	fi
	@echo ""

# Installation targets
.PHONY: testdrive-jsui-install
testdrive-jsui-install: ## Install Python package
	$(VENV_PYTHON) -m pip install -e .

.PHONY: testdrive-jsui-install-dev
testdrive-jsui-install-dev: ## Install with development dependencies
	$(VENV_PYTHON) -m pip install -e ".[dev,testing]"

.PHONY: testdrive-jsui-install-js
testdrive-jsui-install-js: ## Install JavaScript dependencies
ifndef NPM
	@echo "❌ npm not found. Please install Node.js and npm first."
	@exit 1
endif
	npm install

.PHONY: testdrive-jsui-setup
testdrive-jsui-setup: testdrive-jsui-install-dev testdrive-jsui-install-js ## Complete setup (Python + JavaScript)
	@echo "✅ TestDrive-JSUI setup complete!"

# Testing targets
.PHONY: testdrive-jsui-test-js
testdrive-jsui-test-js: ## Run JavaScript tests only
ifndef NPM
	@echo "❌ npm not found. Run 'make testdrive-jsui-install-js' first."
	@exit 1
endif
	npm test

.PHONY: testdrive-jsui-test-python
testdrive-jsui-test-python: ## Run Python tests only
	$(VENV_PYTHON) -m pytest tests/ -v

.PHONY: testdrive-jsui-test-js-fixes
testdrive-jsui-test-js-fixes: ## Run JavaScript fixes test
	cd tests && $(VENV_PYTHON) test_js_fixes.py

.PHONY: testdrive-jsui-test-html
testdrive-jsui-test-html: ## Run HTML integration tests (opens in browser)
	@echo "📋 HTML Integration Tests:"
	@echo "============================="
	@if command -v xdg-open > /dev/null 2>&1; then \
		echo "🌐 Opening test_integration.html..."; \
		xdg-open tests/test_integration.html; \
		echo "🌐 Opening test_guardrail_js.html..."; \
		xdg-open tests/test_guardrail_js.html; \
		echo "🌐 Opening test_complete.html..."; \
		xdg-open tests/test_complete.html; \
	elif command -v open > /dev/null 2>&1; then \
		echo "🌐 Opening test_integration.html..."; \
		open tests/test_integration.html; \
		echo "🌐 Opening test_guardrail_js.html..."; \
		open tests/test_guardrail_js.html; \
		echo "🌐 Opening test_complete.html..."; \
		open tests/test_complete.html; \
	else \
		echo "❌ No browser opener found (need xdg-open or open command)"; \
		echo "📁 Manual test files:"; \
		echo "  - $(shell pwd)/tests/test_integration.html"; \
		echo "  - $(shell pwd)/tests/test_guardrail_js.html"; \
		echo "  - $(shell pwd)/tests/test_complete.html"; \
	fi

.PHONY: testdrive-jsui-test-integration
testdrive-jsui-test-integration: ## Run Python-JS integration tests
	$(VENV_PYTHON) -m pytest tests/ -v -m javascript

.PHONY: testdrive-jsui-test-all
testdrive-jsui-test-all: ## Run all tests (JS + Python + Integration + HTML)
	@echo "🧪 Running all TestDrive-JSUI tests..."
	@echo ""
ifndef NPM
	@echo "❌ npm not found. Run 'make testdrive-jsui-install-js' first."
	@exit 1
endif
	@echo "📋 JavaScript Tests (Jest):"
	@echo "=============================="
	@if npm test > /tmp/jest_results.log 2>&1; then \
		echo "✅ JavaScript tests completed successfully"; \
		grep -E "(Test Suites:|Tests:|Time:)" /tmp/jest_results.log || true; \
	else \
		echo "❌ JavaScript tests failed"; \
		cat /tmp/jest_results.log; \
		exit 1; \
	fi
	@echo ""
	@echo "📋 JavaScript Fixes Test:"
	@echo "=========================="
	@if cd tests && $(VENV_PYTHON) test_js_fixes.py > /tmp/js_fixes_results.log 2>&1; then \
		echo "✅ JavaScript fixes test completed successfully"; \
		grep -E "(✅|❌)" /tmp/js_fixes_results.log | tail -5 || true; \
	else \
		echo "❌ JavaScript fixes test failed"; \
		cat /tmp/js_fixes_results.log; \
		exit 1; \
	fi
	@echo ""
	@echo "📋 Python Integration Tests (pytest):"
	@echo "======================================"
	@if $(VENV_PYTHON) -m pytest tests/ -v > /tmp/pytest_results.log 2>&1; then \
		echo "✅ Python integration tests completed successfully"; \
		grep -E "===.*passed.*===" /tmp/pytest_results.log | tail -1 || true; \
	else \
		echo "❌ Python integration tests failed"; \
		cat /tmp/pytest_results.log; \
		exit 1; \
	fi
	@echo ""
	@echo "📋 HTML Integration Tests:"
	@echo "=========================="
	@echo "✅ HTML test files available for manual testing:"
	@echo "  - tests/test_integration.html (Integration test document)"
	@echo "  - tests/test_guardrail_js.html (Guardrail principle test)"
	@echo "  - tests/test_complete.html (Complete UI test)"
	@echo "  Run 'make testdrive-jsui-test-html' to open in browser"
	@echo ""
	@echo "🎯 Combined Test Results Summary:"
	@echo "=================================="
	@js_tests=$$(grep "Tests:" /tmp/jest_results.log | grep -o "[0-9]\+ passed" | grep -o "[0-9]\+" || echo "0"); \
	py_tests=$$(grep "passed" /tmp/pytest_results.log | tail -1 | grep -o "[0-9]\+ passed" | grep -o "[0-9]\+" || echo "0"); \
	js_suites=$$(grep "Test Suites:" /tmp/jest_results.log | grep -o "[0-9]\+ passed" | grep -o "[0-9]\+" || echo "0"); \
	total_tests=$$((js_tests + py_tests + 1)); \
	echo "  📊 JavaScript: $$js_tests tests in $$js_suites test suites - ALL PASSED ✅"; \
	echo "  📊 JavaScript Fixes: 1 test - ALL PASSED ✅"; \
	echo "  📊 Python: $$py_tests integration tests - ALL PASSED ✅"; \
	echo "  📊 HTML: 3 manual test files - AVAILABLE ✅"; \
	echo "  📊 Total: $$total_tests automated tests - ALL PASSED ✅"; \
	echo ""
	@echo "✅ All TestDrive-JSUI tests completed successfully!"
	@rm -f /tmp/jest_results.log /tmp/pytest_results.log /tmp/js_fixes_results.log

# Development targets
.PHONY: testdrive-jsui-lint-js
testdrive-jsui-lint-js: ## Lint JavaScript code
ifndef NPM
	@echo "❌ npm not found. Run 'make testdrive-jsui-install-js' first."
	@exit 1
endif
	npm run lint

.PHONY: testdrive-jsui-lint-python
testdrive-jsui-lint-python: ## Lint Python code
	$(VENV_PYTHON) -m flake8 src/ tests/

.PHONY: testdrive-jsui-format-python
testdrive-jsui-format-python: ## Format Python code with black
	$(VENV_PYTHON) -m black src/ tests/

.PHONY: testdrive-jsui-watch
testdrive-jsui-watch: ## Watch mode for JavaScript tests
ifndef NPM
	@echo "❌ npm not found. Run 'make testdrive-jsui-install-js' first."
	@exit 1
endif
	npm run test:watch

# Utility targets
.PHONY: testdrive-jsui-clean
testdrive-jsui-clean: ## Clean build artifacts
	rm -rf build/
	rm -rf dist/
	rm -rf *.egg-info/
	rm -rf .pytest_cache/
	rm -rf coverage/
	rm -rf .coverage
	rm -rf node_modules/.cache/
	find . -type d -name __pycache__ -exec rm -rf {} +
	find . -type f -name "*.pyc" -delete

.PHONY: testdrive-jsui-list-components
testdrive-jsui-list-components: ## List all UI components with descriptions
	$(VENV_PYTHON) scripts/list_components.py

.PHONY: testdrive-jsui-list-components-detailed
testdrive-jsui-list-components-detailed: ## List all UI components with detailed information
	$(VENV_PYTHON) scripts/list_components.py detailed

.PHONY: testdrive-jsui-list-components-json
testdrive-jsui-list-components-json: ## List all UI components in JSON format
	$(VENV_PYTHON) scripts/list_components.py json

.PHONY: testdrive-jsui-info
testdrive-jsui-info: ## Show environment information
	@echo "🧪 TestDrive-JSUI Environment Information"
	@echo "========================================="
	@echo ""
	@echo "📁 Capability Root: $(shell pwd)"
	@echo "🐍 Python: $(VENV_PYTHON)"
	@echo "📦 Python Version: $(shell $(VENV_PYTHON) --version)"
ifdef NODE
	@echo "🟢 Node.js: $(shell node --version)"
	@echo "📦 npm: $(shell npm --version)"
else
	@echo "❌ Node.js: Not available"
endif
	@echo ""
	@echo "📋 Available JavaScript Tests:"
	@if [ -d "js/tests" ]; then \
		find js/tests -name "*.js" -type f | sed 's/^/  - /'; \
	else \
		echo "  No JavaScript tests found"; \
	fi
	@echo ""
	@echo "📋 Available Python Tests:"
	@if [ -d "tests" ]; then \
		find tests -name "test_*.py" -type f | sed 's/^/  - /'; \
	else \
		echo "  No Python tests found"; \
	fi
	@echo ""
	@echo "📋 Available HTML Test Files:"
	@if [ -d "tests" ]; then \
		find tests -name "test_*.html" -type f | sed 's/^/  - /'; \
	else \
		echo "  No HTML test files found"; \
	fi
	@echo ""
	@echo "📋 UI Components:"
	@$(VENV_PYTHON) scripts/list_components.py 2>/dev/null | head -10 || echo "  Component lister not available"

# Integration with main capability system
.PHONY: capability-info
capability-info: ## Show capability information
	@echo "Name: $(CAPABILITY_NAME)"
	@echo "Description: $(CAPABILITY_DESCRIPTION)"
	@echo "Type: JavaScript Testing Framework"
	@echo "Status: Development"
	@echo "Targets:"
	@$(MAKE) --no-print-directory help | grep "^  " | sed 's/^  /    /'

# Quick start target
.PHONY: testdrive-jsui-quickstart
testdrive-jsui-quickstart: ## Quick start: setup and run basic tests
	@echo "🚀 TestDrive-JSUI Quick Start"
	@echo "============================="
	@echo ""
	@echo "📋 Step 1: Installing dependencies..."
	@$(MAKE) --no-print-directory testdrive-jsui-setup
	@echo ""
	@echo "📋 Step 2: Running status check..."
	@$(MAKE) --no-print-directory testdrive-jsui-status
	@echo ""
	@echo "📋 Step 3: Running basic tests..."
	@$(MAKE) --no-print-directory testdrive-jsui-test-python
	@echo ""
	@echo "✅ Quick start complete! Use 'make testdrive-jsui-help' for more options."

# Standard test target for capability discovery system compatibility
.PHONY: test
test: ## Run all tests (required for capability integration)
	@$(MAKE) --no-print-directory testdrive-jsui-test-all