v1.0 - Version stable: multi-PC, détection UI-DETR-1, 3 modes exécution
- Frontend v4 accessible sur réseau local (192.168.1.40) - Ports ouverts: 3002 (frontend), 5001 (backend), 5004 (dashboard) - Ollama GPU fonctionnel - Self-healing interactif - Dashboard confiance Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Dom
159
visual_workflow_builder/TEST_TARGET_SELECTOR.md
Normal file
159
visual_workflow_builder/TEST_TARGET_SELECTOR.md
Normal file
@@ -0,0 +1,159 @@
|
||||
# 🎯 Test du TargetSelector - Guide Pas à Pas
|
||||
|
||||
## Étapes pour Voir le TargetSelector
|
||||
|
||||
### 1. Ouvrir l'Application
|
||||
```bash
|
||||
# L'application devrait déjà être en cours d'exécution
|
||||
# Ouvrir dans le navigateur : http://localhost:3000
|
||||
```
|
||||
|
||||
### 2. Ajouter un Node "Click"
|
||||
1. Dans la **palette de gauche**, chercher la section "ACTION"
|
||||
2. Cliquer sur **"Click"** (ou glisser-déposer sur le canvas)
|
||||
3. Un node "Click" apparaît sur le canvas
|
||||
|
||||
### 3. Sélectionner le Node
|
||||
1. **Cliquer sur le node "Click"** dans le canvas
|
||||
2. Le **panneau de propriétés** s'ouvre à droite
|
||||
3. Vous devriez voir :
|
||||
- Type d'étape : "Click"
|
||||
- Section "Configuration" avec plusieurs champs
|
||||
|
||||
### 4. Voir le TargetSelector
|
||||
Dans le panneau de propriétés, vous devriez voir :
|
||||
|
||||
```
|
||||
┌─────────────────────────────────────┐
|
||||
│ Élément cible * │
|
||||
│ ┌─────────────┬─────────────────┐ │
|
||||
│ │ Type: CSS ▼ │ □ Mode interactif│ │
|
||||
│ └─────────────┴─────────────────┘ │
|
||||
│ │
|
||||
│ ┌─────────────────────────────────┐ │
|
||||
│ │ 🔍 button │ │
|
||||
│ │ ✓ │ │
|
||||
│ └─────────────────────────────────┘ │
|
||||
│ 5 élément(s) trouvé(s) │
|
||||
│ │
|
||||
│ Suggestions: │
|
||||
│ • button - Tous les boutons │
|
||||
│ • input[type="text"] - Champs... │
|
||||
│ • #submit - Élément avec ID... │
|
||||
└─────────────────────────────────────┘
|
||||
```
|
||||
|
||||
### 5. Tester les Fonctionnalités
|
||||
|
||||
#### A. Validation en Temps Réel
|
||||
1. Taper un sélecteur valide : `button`
|
||||
- ✅ Icône verte apparaît
|
||||
- Affiche "X élément(s) trouvé(s)"
|
||||
|
||||
2. Taper un sélecteur invalide : `button[[[`
|
||||
- ❌ Icône rouge apparaît
|
||||
- Affiche "Sélecteur CSS invalide"
|
||||
|
||||
#### B. Changer de Type
|
||||
1. Cliquer sur le menu déroulant "Type"
|
||||
2. Sélectionner "XPath"
|
||||
3. Taper : `//button`
|
||||
4. Voir la validation XPath
|
||||
|
||||
#### C. Suggestions
|
||||
1. Commencer à taper : `inp`
|
||||
2. Voir les suggestions apparaître
|
||||
3. Cliquer sur une suggestion pour l'appliquer
|
||||
|
||||
#### D. Mode Interactif
|
||||
1. Activer le switch "Mode interactif"
|
||||
2. Une alerte apparaît (simulation)
|
||||
3. Dans une version future, cela permettra de cliquer sur des éléments
|
||||
|
||||
#### E. Copier le Sélecteur
|
||||
1. Taper un sélecteur valide
|
||||
2. Cliquer sur l'icône 📋 (copier)
|
||||
3. Le sélecteur est copié dans le presse-papiers
|
||||
|
||||
### 6. Tester avec d'Autres Nodes
|
||||
|
||||
#### Node "Type"
|
||||
1. Ajouter un node "Type" depuis la palette
|
||||
2. Le sélectionner
|
||||
3. Voir le TargetSelector pour "Champ cible"
|
||||
|
||||
#### Node "Extract"
|
||||
1. Ajouter un node "Extract" depuis la palette
|
||||
2. Le sélectionner
|
||||
3. Voir le TargetSelector pour "Élément source"
|
||||
|
||||
## 🔍 Dépannage
|
||||
|
||||
### Le Panneau de Propriétés ne S'Ouvre Pas
|
||||
- **Vérifier** : Avez-vous cliqué sur le node dans le canvas ?
|
||||
- **Solution** : Cliquer directement sur le node (pas à côté)
|
||||
|
||||
### Le TargetSelector n'Apparaît Pas
|
||||
- **Vérifier** : Quel type de node avez-vous sélectionné ?
|
||||
- **Solution** : Seuls Click, Type et Extract ont un paramètre 'target'
|
||||
- **Essayer** : Node "Wait" ou "Navigate" n'ont PAS de TargetSelector
|
||||
|
||||
### Les Changements ne Sont Pas Visibles
|
||||
1. **Rafraîchir la page** : Ctrl+R ou Cmd+R
|
||||
2. **Vider le cache** : Ctrl+Shift+R ou Cmd+Shift+R
|
||||
3. **Vérifier la console** : F12 → Console (chercher des erreurs)
|
||||
|
||||
### Le Serveur ne Répond Pas
|
||||
```bash
|
||||
# Vérifier le statut
|
||||
cd visual_workflow_builder/frontend
|
||||
bash status.sh
|
||||
|
||||
# Si nécessaire, redémarrer
|
||||
bash stop.sh
|
||||
bash start.sh
|
||||
```
|
||||
|
||||
## 📸 Captures d'Écran Attendues
|
||||
|
||||
### Vue Complète
|
||||
```
|
||||
┌──────────────────────────────────────────────────────────────┐
|
||||
│ Visual Workflow Builder [Nouveau] [Ouvrir]│
|
||||
├──────────────────────────────────────────────────────────────┤
|
||||
│ │
|
||||
│ PALETTE │ CANVAS │ PROPRIÉTÉS │
|
||||
│ ┌────────┐ │ ┌──────────────────┐ │ ┌────────────────┐ │
|
||||
│ │ACTION │ │ │ │ │ │ Type: Click │ │
|
||||
│ │ Click │ │ │ [Click Node] │ │ │ │ │
|
||||
│ │ Type │ │ │ │ │ │ Configuration: │ │
|
||||
│ │ Wait │ │ │ │ │ │ │ │
|
||||
│ │ │ │ │ │ │ │ Élément cible: │ │
|
||||
│ │LOGIC │ │ │ │ │ │ [TargetSelect] │ │
|
||||
│ │ If │ │ │ │ │ │ │ │
|
||||
│ │ Loop │ │ │ │ │ │ Timeout: 5000 │ │
|
||||
│ └────────┘ │ └──────────────────┘ │ └────────────────┘ │
|
||||
└──────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
## ✅ Checklist de Test
|
||||
|
||||
- [ ] L'application s'ouvre sur http://localhost:3000
|
||||
- [ ] La palette de gauche affiche les types de nodes
|
||||
- [ ] Je peux ajouter un node "Click" au canvas
|
||||
- [ ] Je peux sélectionner le node "Click"
|
||||
- [ ] Le panneau de propriétés s'ouvre à droite
|
||||
- [ ] Je vois le TargetSelector avec le champ "Élément cible"
|
||||
- [ ] Je peux choisir entre CSS et XPath
|
||||
- [ ] La validation fonctionne en temps réel
|
||||
- [ ] Les suggestions apparaissent quand je tape
|
||||
- [ ] Je peux copier un sélecteur
|
||||
- [ ] Le mode interactif affiche une alerte
|
||||
|
||||
## 🎉 Succès !
|
||||
|
||||
Si vous voyez le TargetSelector avec toutes ces fonctionnalités, la tâche 10 est complète !
|
||||
|
||||
---
|
||||
|
||||
**Besoin d'aide ?** Vérifiez la console du navigateur (F12) pour voir les erreurs éventuelles.
|
||||
Reference in New Issue
Block a user