# Guide de Test - Edge Validation

## Tests de Validation des Edges

### Test 1: Self-Connection Bloquée ✅
**Objectif**: Vérifier qu'on ne peut pas connecter un node à lui-même

**Étapes**:
1. Ouvrir http://localhost:3000
2. Ajouter un node (cliquer sur "Click")
3. Essayer de connecter le port de sortie au port d'entrée du même node

**Résultat attendu**:
- ❌ La connexion est refusée
- 📢 Message d'erreur: "Impossible de connecter un node à lui-même"
- ⏱️ Message disparaît après 4 secondes

### Test 2: Connexion en Double Bloquée ✅
**Objectif**: Vérifier qu'on ne peut pas créer deux fois la même connexion

**Étapes**:
1. Ajouter 2 nodes
2. Connecter Node A → Node B
3. Essayer de reconnecter Node A → Node B

**Résultat attendu**:
- ❌ La deuxième connexion est refusée
- 📢 Message d'erreur: "Cette connexion existe déjà"

### Test 3: Port d'Entrée Unique ✅
**Objectif**: Vérifier qu'un port d'entrée ne peut avoir qu'une seule connexion

**Étapes**:
1. Ajouter 3 nodes (A, B, C)
2. Connecter Node A → Node C
3. Essayer de connecter Node B → Node C (même port d'entrée)

**Résultat attendu**:
- ❌ La deuxième connexion est refusée
- 📢 Message d'erreur: "Ce port d'entrée a déjà une connexion"

### Test 4: Connexion Valide ✅
**Objectif**: Vérifier qu'une connexion valide est créée

**Étapes**:
1. Ajouter 2 nodes
2. Connecter Node A → Node B

**Résultat attendu**:
- ✅ Edge créé avec animation
- 📊 Compteur d'edges incrémenté
- 🎨 Edge visible entre les nodes

### Test 5: Suppression d'Edge ✅
**Objectif**: Vérifier qu'on peut supprimer un edge

**Étapes**:
1. Créer une connexion entre 2 nodes
2. Cliquer sur l'edge pour le sélectionner
3. Appuyer sur "Delete"

**Résultat attendu**:
- ✅ Edge supprimé
- 📊 Compteur d'edges décrémenté

### Test 6: Suppression Automatique ✅
**Objectif**: Vérifier que les edges sont supprimés avec le node

**Étapes**:
1. Créer 3 nodes connectés: A → B → C
2. Sélectionner le node B
3. Appuyer sur "Delete"

**Résultat attendu**:
- ✅ Node B supprimé
- ✅ Edges A→B et B→C supprimés automatiquement
- 📊 Compteurs mis à jour

## Tests d'Edges Conditionnels

### Test 7: Edge Normal ✅
**Objectif**: Vérifier le rendu d'un edge normal

**Étapes**:
1. Créer une connexion simple entre 2 nodes

**Résultat attendu**:
- 🎨 Edge gris (#b1b1b7)
- 📏 Largeur 2px
- 🔄 Courbe Bezier

### Test 8: Edge Success (Futur) 🔜
**Objectif**: Vérifier le rendu d'un edge de succès

**Note**: Cette fonctionnalité sera testée quand les nodes conditionnels seront implémentés

**Résultat attendu**:
- 🎨 Edge vert (#4caf50)
- 🏷️ Label "Success"
- 💚 Chip vert avec bordure

### Test 9: Edge Failure (Futur) 🔜
**Objectif**: Vérifier le rendu d'un edge d'échec

**Note**: Cette fonctionnalité sera testée quand les nodes conditionnels seront implémentés

**Résultat attendu**:
- 🎨 Edge rouge (#f44336)
- 🏷️ Label "Failure"
- ❤️ Chip rouge avec bordure

### Test 10: Edge Expression (Futur) 🔜
**Objectif**: Vérifier le rendu d'un edge avec expression

**Note**: Cette fonctionnalité sera testée quand les nodes conditionnels seront implémentés

**Résultat attendu**:
- 🎨 Edge orange (#ff9800)
- 🏷️ Label avec expression
- 🧡 Chip orange avec bordure

## Tests de Performance

### Test P1: Validation Rapide ✅
**Objectif**: Vérifier que la validation est instantanée

**Étapes**:
1. Créer 10 nodes
2. Essayer de créer plusieurs connexions rapidement

**Résultat attendu**:
- ⚡ Validation instantanée (<1ms)
- 🎯 Pas de lag visible
- ✅ Messages d'erreur immédiats

### Test P2: Détection de Cycles (Futur) 🔜
**Objectif**: Vérifier la détection de cycles

**Note**: Cette fonctionnalité sera testée dans une tâche future

**Étapes**:
1. Créer un cycle: A → B → C → A
2. Valider le workflow

**Résultat attendu**:
- ❌ Cycle détecté
- 📢 Message d'erreur approprié

## Tests d'Accessibilité

### Test A1: Messages Lisibles ✅
**Objectif**: Vérifier que les messages d'erreur sont lisibles

**Étapes**:
1. Déclencher une erreur de validation
2. Observer le message

**Résultat attendu**:
- 📝 Texte clair et explicite
- 🎨 Bon contraste (rouge sur blanc)
- 📏 Taille de police lisible

### Test A2: Auto-Hide ✅
**Objectif**: Vérifier que les messages disparaissent automatiquement

**Étapes**:
1. Déclencher une erreur
2. Attendre 4 secondes

**Résultat attendu**:
- ⏱️ Message disparaît après 4 secondes
- ✅ Pas de pollution visuelle

## Tests de Régression

### Test R1: Fonctionnalités Tâche 5 ✅
**Objectif**: Vérifier qu'aucune régression n'a été introduite

**Étapes**:
1. Tester toutes les fonctionnalités de la Tâche 5
2. Vérifier qu'elles fonctionnent toujours

**Résultat attendu**:
- ✅ Création de nodes
- ✅ Déplacement de nodes
- ✅ Sélection de nodes
- ✅ Suppression de nodes
- ✅ Zoom et panoramique
- ✅ Minimap

## Scénarios Complets

### Scénario 1: Workflow Simple ✅
**Objectif**: Créer un workflow simple valide

**Étapes**:
1. Ajouter 3 nodes (A, B, C)
2. Connecter A → B
3. Connecter B → C
4. Vérifier le workflow

**Résultat attendu**:
- ✅ 3 nodes créés
- ✅ 2 edges créés
- ✅ Workflow valide
- ✅ Pas d'erreur

### Scénario 2: Tentatives Invalides ✅
**Objectif**: Tester plusieurs erreurs de validation

**Étapes**:
1. Ajouter 2 nodes
2. Essayer self-connection → Erreur
3. Créer connexion valide A → B
4. Essayer connexion en double → Erreur
5. Essayer connexion B → A (port occupé) → Erreur

**Résultat attendu**:
- ❌ 3 erreurs détectées
- 📢 3 messages d'erreur affichés
- ✅ 1 seule connexion créée

### Scénario 3: Nettoyage ✅
**Objectif**: Vérifier le nettoyage des edges

**Étapes**:
1. Créer un workflow complexe (5 nodes, 6 edges)
2. Supprimer un node central
3. Vérifier que les edges sont nettoyés

**Résultat attendu**:
- ✅ Node supprimé
- ✅ Edges connectés supprimés
- ✅ Autres edges conservés
- 📊 Compteurs corrects

## Checklist de Test

### Validation
- [ ] Self-connection bloquée
- [ ] Connexion en double bloquée
- [ ] Port d'entrée unique respecté
- [ ] Messages d'erreur affichés
- [ ] Messages disparaissent après 4s

### Edges
- [ ] Création d'edges valides
- [ ] Sélection d'edges
- [ ] Suppression d'edges
- [ ] Suppression automatique
- [ ] Rendu correct

### Performance
- [ ] Validation instantanée
- [ ] Pas de lag
- [ ] 60fps maintenu

### Accessibilité
- [ ] Messages lisibles
- [ ] Bon contraste
- [ ] Auto-hide fonctionne

### Régression
- [ ] Toutes les fonctionnalités Tâche 5 OK
- [ ] Pas de bugs introduits

## Problèmes Connus

### Limitations Actuelles
1. **Détection de cycles**: Implémentée mais pas encore exposée dans l'UI
2. **Validation des types**: Optionnelle, dépend des ports définis
3. **Undo/Redo**: Pas encore implémenté

### À Implémenter
- [ ] Validation complète du workflow dans l'UI
- [ ] Indicateurs visuels pour nodes déconnectés
- [ ] Suggestions de correction pour cycles
- [ ] Undo/Redo pour les edges

## Commandes Utiles

### Tester Rapidement
```bash
cd visual_workflow_builder
./test_canvas.sh
```

### Voir les Logs
```bash
# Frontend
cd visual_workflow_builder/frontend
tail -f frontend.log

# Backend
cd visual_workflow_builder/backend
tail -f server.log
```

### Rebuild
```bash
cd visual_workflow_builder/frontend
npm run build
```

## Résolution de Problèmes

### Les Messages d'Erreur ne S'Affichent Pas
1. Ouvrir la console (F12)
2. Vérifier les erreurs JavaScript
3. Vérifier que Material-UI est chargé

### La Validation ne Fonctionne Pas
1. Vérifier que `edgeValidation.ts` existe
2. Vérifier l'import dans Canvas
3. Voir les logs de la console

### Les Edges ne Sont Pas Stylés
1. Vérifier que `CustomEdge.tsx` existe
2. Vérifier l'enregistrement dans `edgeTypes`
3. Vérifier les imports Material-UI

## Feedback

Si vous rencontrez des problèmes:
1. Noter le problème exact
2. Capturer une capture d'écran
3. Noter les étapes pour reproduire
4. Vérifier les logs (console + fichiers)

---

**Version**: 1.0.0  
**Date**: 2 décembre 2024  
**Statut**: ✅ Validation des Edges Opérationnelle