# Diagnostic Capture d'Élément Cible VWB

**Auteur : Dom, Alice, Kiro - 09 janvier 2026**

## 🔍 Problème identifié

La capture d'élément cible dans le Visual Workflow Builder ne fonctionne pas correctement via l'API Flask, bien que les fonctions backend fonctionnent parfaitement en direct.

## 📊 État actuel

### ✅ Ce qui fonctionne
- **Fonctions backend directes** : `capture_screen_to_base64()` et `create_visual_embedding()` fonctionnent parfaitement
- **ScreenCapturer avec venv** : Capture d'écran 1920x1080 réussie avec l'environnement virtuel
- **CLIPEmbedder** : Création d'embeddings 512D réussie
- **Dépendances** : `mss`, `pyautogui`, `torch`, `open_clip_torch` correctement installés dans `venv_v3`

### ❌ Ce qui ne fonctionne pas
- **Endpoint Flask `/api/screen-capture`** : Retourne erreur 500 "Échec de la capture d'écran"
- **Serveur Flask** : N'utilise pas correctement l'environnement virtuel

## 🧪 Tests effectués

### Test 1 : Backend direct (✅ RÉUSSI)
```bash
python3 tests/integration/test_backend_vwb_simple_09jan2026.py
```
**Résultat** : ✅ Backend fonctionne correctement avec venv

### Test 2 : API Flask (❌ ÉCHEC)
```bash
python3 tests/integration/test_capture_element_cible_vwb_09jan2026.py
```
**Résultat** : ❌ Erreur 500 sur `/api/screen-capture`

## 🔧 Fichiers en cause

### Backend
- `visual_workflow_builder/backend/app_lightweight.py` : Serveur Flask principal
- `visual_workflow_builder/backend/services/real_screen_capture.py` : Service de capture
- `core/capture/screen_capturer.py` : Module de capture d'écran

### Frontend
- `visual_workflow_builder/frontend/src/components/VisualSelector/index.tsx` : Composant de sélection visuelle
- `visual_workflow_builder/frontend/src/services/apiClient.ts` : Client API
- `visual_workflow_builder/frontend/src/types/index.ts` : Types TypeScript

### Tests
- `tests/integration/test_capture_element_cible_vwb_09jan2026.py` : Test complet
- `tests/integration/test_backend_vwb_simple_09jan2026.py` : Test direct backend

## 🎯 Hypothèses sur la cause

1. **Environnement virtuel** : Le serveur Flask ne démarre pas avec l'environnement virtuel `venv_v3`
2. **Permissions** : Problème de permissions pour la capture d'écran via le serveur web
3. **Imports** : Les imports `mss` et `pyautogui` échouent dans le contexte Flask
4. **Variables d'environnement** : `PYTHONPATH` ou autres variables non définies

## 🛠️ Solutions à tester

### Solution 1 : Forcer l'environnement virtuel
Modifier le démarrage du serveur Flask pour utiliser explicitement `venv_v3/bin/python3`

### Solution 2 : Vérifier les imports
Ajouter des logs détaillés dans `get_screen_capturer()` pour voir exactement où ça échoue

### Solution 3 : Permissions système
Vérifier si le serveur Flask a les permissions nécessaires pour la capture d'écran

### Solution 4 : Mode debug
Démarrer Flask en mode debug pour voir les tracebacks complets

## 📋 Logs observés

### Démarrage serveur (✅ OK)
```
✅ Flask disponible - utilisation du mode Flask
✅ ScreenCapturer initialisé avec succès - méthode: mss
✅ CLIPEmbedder initialisé avec succès
```

### Health check (✅ OK)
```json
{
  "status": "healthy",
  "version": "1.0.0-lightweight",
  "mode": "flask",
  "features": {
    "screen_capture": true,
    "visual_embedding": true
  }
}
```

### Capture d'écran (❌ ÉCHEC)
```json
{
  "success": false,
  "error": "Échec de la capture d'écran"
}
```

## 🔄 Prochaines étapes

1. **Examiner les logs détaillés** du serveur Flask pendant la capture
2. **Tester avec différents environnements** (système vs venv)
3. **Vérifier les permissions** de capture d'écran
4. **Simplifier le test** pour isoler le problème

## 📦 Fichiers fournis

Le zip `capture_element_cible_vwb_YYYYMMDD_HHMMSS.zip` contient :
- Tous les scripts backend et frontend
- Tests de diagnostic complets
- Documentation et spécifications
- Modules core nécessaires

## 🎯 Objectif

Faire fonctionner la capture d'élément cible via l'API Flask pour permettre au frontend VisualSelector de capturer l'écran et créer des embeddings visuels pour la reconnaissance d'éléments UI.