feat: replay E2E fonctionnel — 25/25 actions, 0 retries, SomEngine via serveur

Validé sur PC Windows (DESKTOP-58D5CAC, 2560x1600) :
- 8 clics résolus visuellement (1 anchor_template, 1 som_text_match, 6 som_vlm)
- Score moyen 0.75, temps moyen 1.6s
- Texte tapé correctement (bonjour, test word, date, email)
- 0 retries, 2 actions non vérifiées (OK)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

.kiro/specs/tool-documentation-ui/design.md

@@ -0,0 +1,368 @@
+# Design Document - Documentation Interactive des Outils
+
+## Overview
+
+Ce document décrit l'architecture et l'implémentation d'un système de documentation interactive intégré dans le Visual Workflow Builder. Le système fournit une aide contextuelle complète en français pour tous les outils disponibles, accessible via deux interfaces complémentaires : des boutons d'aide dans la palette et un onglet documentation dans le panneau des propriétés.
+
+## Architecture
+
+### Architecture Générale
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│                    Frontend (React/TypeScript)              │
+├─────────────────────────────────────────────────────────────┤
+│  ┌─────────────────┐  ┌─────────────────┐  ┌──────────────┐ │
+│  │   Palette       │  │ Properties Panel│  │ Documentation│ │
+│  │   Component     │  │   Component     │  │   Service    │ │
+│  │                 │  │                 │  │              │ │
+│  │ ┌─────────────┐ │  │ ┌─────────────┐ │  │              │ │
+│  │ │ Help Button │ │  │ │ Doc Tab     │ │  │              │ │
+│  │ └─────────────┘ │  │ └─────────────┘ │  │              │ │
+│  └─────────────────┘  └─────────────────┘  └──────────────┘ │
+├─────────────────────────────────────────────────────────────┤
+│                    Documentation Store                      │
+│  ┌─────────────────┐  ┌─────────────────┐  ┌──────────────┐ │
+│  │ Tool Definitions│  │ Content Cache   │  │ Search Index │ │
+│  └─────────────────┘  └─────────────────┘  └──────────────┘ │
+└─────────────────────────────────────────────────────────────┘
+```
+
+### Composants Principaux
+
+1. **DocumentationService** : Service central de gestion de la documentation
+2. **HelpButton** : Composant bouton d'aide dans la palette
+3. **DocumentationPopup** : Popup modal pour afficher la documentation
+4. **DocumentationTab** : Onglet documentation dans le panneau des propriétés
+5. **SearchEngine** : Moteur de recherche interne à la documentation
+6. **ContentRenderer** : Rendu adaptatif du contenu selon le contexte
+
+## Components and Interfaces
+
+### DocumentationService
+
+```typescript
+interface DocumentationService {
+  // Récupération de documentation
+  getToolDocumentation(toolId: string): ToolDocumentation;
+  getGeneralHelp(): GeneralDocumentation;
+  
+  // Recherche
+  searchInDocumentation(query: string, toolId?: string): SearchResult[];
+  
+  // Contextualisation
+  getContextualHelp(toolId: string, currentConfig: any): ContextualHelp;
+  getRelatedTools(toolId: string): RelatedTool[];
+  
+  // Cache et performance
+  preloadDocumentation(): Promise<void>;
+  invalidateCache(toolId?: string): void;
+}
+```
+
+### ToolDocumentation
+
+```typescript
+interface ToolDocumentation {
+  id: string;
+  name: string;
+  category: ToolCategory;
+  
+  // Contenu principal
+  description: string;
+  purpose: string;
+  useCases: UseCase[];
+  
+  // Configuration
+  parameters: ParameterDocumentation[];
+  examples: Example[];
+  
+  // Guides
+  bestPractices: string[];
+  limitations: string[];
+  troubleshooting: TroubleshootingItem[];
+  
+  // Relations
+  relatedTools: string[];
+  prerequisites: string[];
+  
+  // Métadonnées
+  lastUpdated: Date;
+  version: string;
+}
+```
+
+### HelpButton Component
+
+```typescript
+interface HelpButtonProps {
+  toolId: string;
+  position: 'palette' | 'inline';
+  size: 'small' | 'medium';
+  onHelpClick: (toolId: string) => void;
+}
+
+interface HelpButtonState {
+  isVisible: boolean;
+  isHovered: boolean;
+}
+```
+
+### DocumentationPopup Component
+
+```typescript
+interface DocumentationPopupProps {
+  toolId: string;
+  isOpen: boolean;
+  onClose: () => void;
+  initialSearchQuery?: string;
+}
+
+interface DocumentationPopupState {
+  documentation: ToolDocumentation;
+  searchQuery: string;
+  searchResults: SearchResult[];
+  activeSection: string;
+  isLoading: boolean;
+}
+```
+
+### DocumentationTab Component
+
+```typescript
+interface DocumentationTabProps {
+  selectedNodeId?: string;
+  nodeType?: string;
+  currentConfiguration?: any;
+}
+
+interface DocumentationTabState {
+  documentation: ToolDocumentation | GeneralDocumentation;
+  contextualHighlights: string[];
+  relatedSuggestions: RelatedTool[];
+}
+```
+
+## Data Models
+
+### Documentation Content Structure
+
+```typescript
+// Structure principale de la documentation
+interface ToolDocumentation {
+  // Identification
+  id: string;
+  name: string;
+  category: 'actions-web' | 'donnees' | 'logique' | 'controle' | 'integrations';
+  
+  // Contenu de base
+  overview: {
+    description: string;
+    purpose: string;
+    icon: string;
+    color: string;
+  };
+  
+  // Cas d'usage
+  useCases: {
+    title: string;
+    description: string;
+    scenario: string;
+    example: string;
+  }[];
+  
+  // Paramètres
+  parameters: {
+    name: string;
+    type: ParameterType;
+    required: boolean;
+    description: string;
+    defaultValue?: any;
+    examples: string[];
+    validation?: ValidationRule[];
+  }[];
+  
+  // Guides pratiques
+  guides: {
+    quickStart: string;
+    bestPractices: string[];
+    commonMistakes: string[];
+    troubleshooting: TroubleshootingItem[];
+  };
+  
+  // Relations
+  relationships: {
+    relatedTools: string[];
+    prerequisites: string[];
+    followUpTools: string[];
+  };
+  
+  // Contenu spécialisé par catégorie
+  categorySpecific?: CategorySpecificContent;
+}
+
+// Contenu spécialisé selon la catégorie
+interface CategorySpecificContent {
+  // Pour Actions Web
+  webActions?: {
+    targetSelection: string;
+    browserCompatibility: string[];
+    securityConsiderations: string;
+  };
+  
+  // Pour Données
+  dataTools?: {
+    supportedFormats: string[];
+    transformationExamples: DataTransformation[];
+    performanceNotes: string;
+  };
+  
+  // Pour Logique
+  logicTools?: {
+    conditionExamples: ConditionExample[];
+    flowDiagrams: string[];
+    debuggingTips: string[];
+  };
+  
+  // Pour Intégrations
+  integrationTools?: {
+    protocols: string[];
+    authenticationMethods: string[];
+    connectionExamples: ConnectionExample[];
+  };
+}
+```
+
+### Search and Context Models
+
+```typescript
+interface SearchResult {
+  toolId: string;
+  section: string;
+  content: string;
+  relevanceScore: number;
+  highlightedText: string;
+}
+
+interface ContextualHelp {
+  highlights: string[];
+  warnings: Warning[];
+  suggestions: Suggestion[];
+  relatedActions: RelatedAction[];
+}
+
+interface Warning {
+  type: 'error' | 'warning' | 'info';
+  message: string;
+  affectedParameters: string[];
+  resolution: string;
+}
+```
+
+## Correctness Properties
+
+*Une propriété est une caractéristique ou un comportement qui doit être vrai dans toutes les exécutions valides d'un système - essentiellement, une déclaration formelle sur ce que le système devrait faire. Les propriétés servent de pont entre les spécifications lisibles par l'homme et les garanties de correction vérifiables par machine.*
+
+### Property Reflection
+
+Après analyse du prework, plusieurs propriétés peuvent être consolidées :
+- Les propriétés 1.1-1.5 (palette) et 2.1-2.5 (panneau) testent des interactions UI similaires
+- Les propriétés 3.1-3.6 et 4.1-4.6 testent la présence de contenu documentaire
+- Les propriétés 5.1-5.5 testent la fonctionnalité de recherche
+- Les propriétés 7.1-7.5 testent l'accessibilité et l'ergonomie
+- Les propriétés 8.1-8.5 testent les performances
+
+### Core Properties
+
+**Property 1: Documentation UI Integration**
+*For any* tool in the palette, hovering should show a help button, clicking it should open documentation, and the popup should contain all required content sections (title, description, parameters, examples)
+**Validates: Requirements 1.1, 1.2, 1.3**
+
+**Property 2: Properties Panel Documentation**
+*For any* selected node on the canvas, the properties panel should display a documentation tab with content matching the node type, and automatically update when selection changes
+**Validates: Requirements 2.1, 2.2, 2.4**
+
+**Property 3: Complete French Documentation**
+*For any* tool in the system, documentation should exist in French and include all required sections: description, parameters with explanations, practical examples, and use cases
+**Validates: Requirements 3.1, 3.2, 3.3, 3.4, 3.6**
+
+**Property 4: Category-Specific Content**
+*For any* tool category (Actions Web, Données, Logique, Intégrations), documentation should include category-appropriate specialized content and formatting
+**Validates: Requirements 4.1, 4.2, 4.3, 4.4, 4.5**
+
+**Property 5: Search Functionality**
+*For any* search query in documentation, the system should highlight matching terms, allow navigation between results, and search across all content sections (title, description, parameters, examples)
+**Validates: Requirements 5.1, 5.2, 5.3, 5.4**
+
+**Property 6: Contextual Enhancement**
+*For any* configured node, documentation should highlight relevant sections, suggest related tools, and display warnings for risky configurations
+**Validates: Requirements 6.1, 6.2, 6.4, 6.5**
+
+**Property 7: Accessibility Support**
+*For any* documentation interface, keyboard navigation should work (F1 shortcut, tab navigation), font size should be adjustable, and responsive design should adapt to different screen sizes
+**Validates: Requirements 7.1, 7.2, 7.4, 7.5**
+
+**Property 8: Performance Requirements**
+*For any* documentation request, content should display within 200ms, use caching to avoid reloads, and support offline access after initial load
+**Validates: Requirements 8.2, 8.3, 8.5**
+
+## Error Handling
+
+### Documentation Loading Errors
+
+```typescript
+interface DocumentationError {
+  type: 'LOAD_FAILED' | 'CONTENT_MISSING' | 'SEARCH_FAILED' | 'CACHE_ERROR';
+  toolId?: string;
+  message: string;
+  fallbackContent?: string;
+}
+
+class DocumentationErrorHandler {
+  handleLoadError(error: DocumentationError): void {
+    // Afficher contenu de fallback
+    // Logger l'erreur pour debugging
+    // Proposer rechargement manuel
+  }
+  
+  handleSearchError(query: string): void {
+    // Afficher message d'erreur utilisateur
+    // Suggérer termes alternatifs
+    // Permettre recherche manuelle
+  }
+}
+```
+
+### Graceful Degradation
+
+1. **Documentation manquante** : Afficher un message informatif avec lien vers documentation générale
+2. **Erreur de recherche** : Désactiver temporairement la recherche, maintenir navigation manuelle
+3. **Problème de cache** : Recharger depuis la source, informer l'utilisateur du délai
+4. **Erreur de rendu** : Afficher version texte simple en fallback
+
+## Testing Strategy
+
+### Dual Testing Approach
+
+**Unit Tests** :
+- Composants React individuels (HelpButton, DocumentationPopup, DocumentationTab)
+- Service de documentation (chargement, cache, recherche)
+- Rendu du contenu et formatage
+- Gestion d'erreurs et cas limites
+
+**Property-Based Tests** :
+- Validation que toute documentation contient les sections requises
+- Test de l'intégration UI sur tous les types d'outils
+- Vérification des performances sur différentes tailles de contenu
+- Test de la recherche sur du contenu généré aléatoirement
+
+### Test Configuration
+
+- **Minimum 100 iterations** par test de propriété
+- **Tags de référence** : `Feature: tool-documentation-ui, Property X: [description]`
+- **Couverture** : Tous les types d'outils, toutes les catégories, tous les cas d'usage
+- **Performance** : Tests de charge avec documentation volumineuse
+
+### Testing Framework
+
+Utilisation de **Jest** avec **React Testing Library** pour les tests unitaires et **fast-check** pour les tests basés sur les propriétés, conformément à l'architecture TypeScript existante du Visual Workflow Builder.

.kiro/specs/tool-documentation-ui/requirements.md

@@ -0,0 +1,114 @@
+# Requirements Document - Documentation Interactive des Outils
+
+## Introduction
+
+Système de documentation interactive intégré dans l'interface utilisateur du Visual Workflow Builder pour expliquer en français le fonctionnement, la configuration et l'utilisation de chaque outil disponible dans la palette.
+
+## Glossary
+
+- **Outil**: Un type de nœud disponible dans la palette (ex: Cliquer, Base de données, Condition)
+- **Palette**: Le panneau latéral contenant tous les outils disponibles
+- **Panneau_Propriétés**: Le panneau de configuration qui apparaît quand un nœud est sélectionné
+- **Documentation_Interactive**: Système d'aide contextuelle accessible directement dans l'interface
+- **Popup_Documentation**: Fenêtre modale affichant la documentation détaillée d'un outil
+- **Onglet_Documentation**: Section du panneau des propriétés dédiée à l'aide
+
+## Requirements
+
+### Requirement 1: Documentation dans la Palette
+
+**User Story:** En tant qu'utilisateur, je veux accéder rapidement à la documentation d'un outil depuis la palette, afin de comprendre son utilité avant de l'ajouter à mon workflow.
+
+#### Acceptance Criteria
+
+1. WHEN un utilisateur survole un outil dans la palette, THE System SHALL afficher un bouton d'aide "?" visible
+2. WHEN un utilisateur clique sur le bouton "?" d'un outil, THE System SHALL ouvrir un popup avec la documentation complète de cet outil
+3. THE Popup_Documentation SHALL contenir le titre, la description, les cas d'usage, les paramètres et des exemples pratiques
+4. WHEN un utilisateur clique en dehors du popup ou sur le bouton fermer, THE System SHALL fermer le popup de documentation
+5. THE System SHALL maintenir la fonctionnalité de drag-and-drop des outils même avec le bouton d'aide présent
+
+### Requirement 2: Documentation dans le Panneau des Propriétés
+
+**User Story:** En tant qu'utilisateur, je veux consulter la documentation d'un outil pendant que je le configure, afin de comprendre chaque paramètre et optimiser ma configuration.
+
+#### Acceptance Criteria
+
+1. WHEN un nœud est sélectionné sur le canvas, THE Panneau_Propriétés SHALL afficher un onglet "Documentation" en plus des onglets existants
+2. THE Onglet_Documentation SHALL contenir la documentation complète de l'outil correspondant au nœud sélectionné
+3. WHEN aucun nœud n'est sélectionné, THE Onglet_Documentation SHALL afficher une aide générale sur l'utilisation des workflows
+4. THE System SHALL synchroniser automatiquement le contenu de l'onglet avec le type de nœud sélectionné
+5. THE Onglet_Documentation SHALL rester accessible pendant la configuration des paramètres
+
+### Requirement 3: Contenu de Documentation Complet
+
+**User Story:** En tant qu'utilisateur français, je veux une documentation détaillée et claire en français pour chaque outil, afin de maîtriser parfaitement leur utilisation.
+
+#### Acceptance Criteria
+
+1. THE System SHALL fournir une documentation en français pour chaque outil de la palette
+2. THE Documentation SHALL inclure une description claire du rôle de l'outil
+3. THE Documentation SHALL lister tous les paramètres configurables avec leurs explications
+4. THE Documentation SHALL présenter des exemples concrets d'utilisation
+5. THE Documentation SHALL mentionner les bonnes pratiques et limitations éventuelles
+6. THE Documentation SHALL inclure des cas d'usage typiques pour chaque outil
+
+### Requirement 4: Documentation Spécialisée par Catégorie
+
+**User Story:** En tant qu'utilisateur, je veux une documentation adaptée à chaque catégorie d'outils, afin de comprendre les spécificités de chaque domaine (Actions Web, Données, Logique, etc.).
+
+#### Acceptance Criteria
+
+1. THE System SHALL adapter le format de documentation selon la catégorie d'outil
+2. FOR Actions Web tools, THE Documentation SHALL expliquer les interactions avec l'interface utilisateur
+3. FOR Données tools, THE Documentation SHALL détailler les types de données et transformations possibles
+4. FOR Logique tools, THE Documentation SHALL expliquer les conditions et structures de contrôle
+5. FOR Intégrations tools, THE Documentation SHALL préciser les protocoles et configurations de connexion
+6. THE Documentation SHALL inclure des schémas visuels quand approprié
+
+### Requirement 5: Recherche dans la Documentation
+
+**User Story:** En tant qu'utilisateur, je veux pouvoir rechercher dans la documentation des outils, afin de trouver rapidement l'information dont j'ai besoin.
+
+#### Acceptance Criteria
+
+1. THE Popup_Documentation SHALL inclure un champ de recherche interne
+2. WHEN un utilisateur tape dans le champ de recherche, THE System SHALL surligner les termes correspondants dans la documentation
+3. THE System SHALL permettre la navigation entre les résultats de recherche
+4. THE Recherche SHALL fonctionner sur le titre, la description, les paramètres et les exemples
+5. WHEN aucun résultat n'est trouvé, THE System SHALL afficher un message informatif
+
+### Requirement 6: Documentation Contextuelle Avancée
+
+**User Story:** En tant qu'utilisateur, je veux que la documentation s'adapte au contexte de mon workflow, afin de recevoir des conseils pertinents selon ma situation.
+
+#### Acceptance Criteria
+
+1. WHEN un nœud a des paramètres déjà configurés, THE Documentation SHALL mettre en évidence les sections correspondantes
+2. THE System SHALL suggérer des outils complémentaires basés sur l'outil actuellement consulté
+3. WHEN un outil est utilisé dans un contexte spécifique, THE Documentation SHALL adapter ses exemples
+4. THE System SHALL afficher des avertissements si la configuration actuelle présente des risques
+5. THE Documentation SHALL proposer des liens vers d'autres outils connexes
+
+### Requirement 7: Accessibilité et Ergonomie
+
+**User Story:** En tant qu'utilisateur, je veux une documentation accessible et ergonomique, afin de pouvoir l'utiliser efficacement quel que soit mon niveau d'expertise.
+
+#### Acceptance Criteria
+
+1. THE Documentation SHALL être accessible via raccourcis clavier (F1 sur un outil sélectionné)
+2. THE System SHALL supporter la navigation au clavier dans les popups de documentation
+3. THE Documentation SHALL utiliser une typographie claire et des contrastes suffisants
+4. THE System SHALL permettre d'ajuster la taille de police de la documentation
+5. THE Documentation SHALL être responsive et s'adapter à différentes tailles d'écran
+
+### Requirement 8: Performance et Chargement
+
+**User Story:** En tant qu'utilisateur, je veux que la documentation se charge rapidement, afin de ne pas interrompre mon flux de travail.
+
+#### Acceptance Criteria
+
+1. THE System SHALL charger la documentation de base au démarrage de l'application
+2. THE Documentation SHALL s'afficher en moins de 200ms après un clic sur le bouton d'aide
+3. THE System SHALL mettre en cache la documentation pour éviter les rechargements
+4. WHEN la documentation est volumineuse, THE System SHALL implémenter un chargement progressif
+5. THE System SHALL fonctionner hors ligne une fois la documentation chargée

.kiro/specs/tool-documentation-ui/tasks.md

@@ -0,0 +1,342 @@
+# Tasks - Documentation Interactive des Outils
+
+## Overview
+
+Ce document détaille les tâches d'implémentation pour le système de documentation interactive des outils dans le Visual Workflow Builder. L'implémentation se fait en TypeScript/React pour s'intégrer parfaitement avec l'architecture existante.
+
+## Programming Language
+
+**TypeScript** - Pour une intégration native avec l'écosystème React existant du Visual Workflow Builder et bénéficier du typage statique pour la robustesse du code.
+
+## Implementation Tasks
+
+### Phase 1: Documentation Content & Service
+
+#### Task 1.1: Create Documentation Content Structure
+**Estimate:** 4 hours  
+**Priority:** High  
+**Dependencies:** None
+
+Create comprehensive French documentation content for all existing tools in the palette.
+
+**Deliverables:**
+- `visual_workflow_builder/frontend/src/data/toolDocumentation.ts` - Complete documentation content
+- Documentation for all 14 existing tools: click, type, wait, navigate, validate, extract, variable, transform, condition, loop, start, end, api, database
+- Each tool documentation includes: description, purpose, use cases, parameters, examples, best practices, limitations
+
+**Acceptance Criteria:**
+- All tools from `NODE_TYPES` array have complete French documentation
+- Documentation follows the `ToolDocumentation` interface from design
+- Content is categorized by tool category (Actions Web, Données, Logique, Contrôle, Intégrations)
+- Examples are practical and realistic
+
+#### Task 1.2: Create Documentation Service
+**Estimate:** 3 hours  
+**Priority:** High  
+**Dependencies:** Task 1.1
+
+Implement the central documentation service for content management and retrieval.
+
+**Deliverables:**
+- `visual_workflow_builder/frontend/src/services/DocumentationService.ts`
+- `visual_workflow_builder/frontend/src/types/documentation.ts` - TypeScript interfaces
+- Caching mechanism for performance
+- Search functionality within documentation
+
+**Acceptance Criteria:**
+- Implements all methods from `DocumentationService` interface
+- Provides fast content retrieval (<200ms)
+- Supports search across all content sections
+- Handles missing documentation gracefully
+
+### Phase 2: Palette Integration
+
+#### Task 2.1: Create Help Button Component
+**Estimate:** 2 hours  
+**Priority:** High  
+**Dependencies:** Task 1.2
+
+Create the help button component that appears on palette tools.
+
+**Deliverables:**
+- `visual_workflow_builder/frontend/src/components/HelpButton/index.tsx`
+- `visual_workflow_builder/frontend/src/components/HelpButton/HelpButton.css`
+- Hover states and accessibility support
+
+**Acceptance Criteria:**
+- Button appears on hover over palette tools
+- Accessible via keyboard navigation
+- Prevents interference with drag-and-drop functionality
+- Follows Material-UI design system
+
+#### Task 2.2: Create Documentation Popup Component
+**Estimate:** 4 hours  
+**Priority:** High  
+**Dependencies:** Task 2.1
+
+Implement the modal popup that displays tool documentation.
+
+**Deliverables:**
+- `visual_workflow_builder/frontend/src/components/DocumentationPopup/index.tsx`
+- `visual_workflow_builder/frontend/src/components/DocumentationPopup/DocumentationPopup.css`
+- Search functionality within popup
+- Responsive design
+
+**Acceptance Criteria:**
+- Modal opens when help button is clicked
+- Displays complete tool documentation
+- Includes internal search with highlighting
+- Closes on outside click or ESC key
+- Mobile-responsive layout
+
+#### Task 2.3: Integrate Help Buttons in Palette
+**Estimate:** 2 hours  
+**Priority:** High  
+**Dependencies:** Task 2.1, Task 2.2
+
+Modify the existing Palette component to include help buttons.
+
+**Deliverables:**
+- Updated `visual_workflow_builder/frontend/src/components/Palette/index.tsx`
+- Help button integration without breaking existing functionality
+
+**Acceptance Criteria:**
+- Help buttons appear on all palette tools
+- Drag-and-drop functionality remains intact
+- Hover states work correctly
+- Performance impact is minimal
+
+### Phase 3: Properties Panel Integration
+
+#### Task 3.1: Create Documentation Tab Component
+**Estimate:** 3 hours  
+**Priority:** High  
+**Dependencies:** Task 1.2
+
+Create the documentation tab for the properties panel.
+
+**Deliverables:**
+- `visual_workflow_builder/frontend/src/components/DocumentationTab/index.tsx`
+- `visual_workflow_builder/frontend/src/components/DocumentationTab/DocumentationTab.css`
+- Contextual highlighting based on current configuration
+
+**Acceptance Criteria:**
+- Displays documentation for selected node type
+- Shows general help when no node is selected
+- Highlights relevant sections based on current parameters
+- Updates automatically when selection changes
+
+#### Task 3.2: Integrate Documentation Tab in Properties Panel
+**Estimate:** 2 hours  
+**Priority:** High  
+**Dependencies:** Task 3.1
+
+Modify the PropertiesPanel to include the documentation tab.
+
+**Deliverables:**
+- Updated `visual_workflow_builder/frontend/src/components/PropertiesPanel/index.tsx`
+- Tab navigation integration
+
+**Acceptance Criteria:**
+- Documentation tab appears alongside existing tabs
+- Tab switching works smoothly
+- Content synchronizes with selected node
+- Maintains existing properties panel functionality
+
+### Phase 4: Advanced Features
+
+#### Task 4.1: Implement Contextual Help Features
+**Estimate:** 3 hours  
+**Priority:** Medium  
+**Dependencies:** Task 3.2
+
+Add contextual help features like parameter highlighting and related tool suggestions.
+
+**Deliverables:**
+- Enhanced DocumentationTab with contextual features
+- Parameter highlighting logic
+- Related tools suggestions
+
+**Acceptance Criteria:**
+- Highlights documentation sections relevant to current configuration
+- Suggests related tools based on current tool
+- Shows warnings for risky configurations
+- Provides links to complementary tools
+
+#### Task 4.2: Implement Search Engine
+**Estimate:** 3 hours  
+**Priority:** Medium  
+**Dependencies:** Task 2.2
+
+Enhance search functionality with advanced features.
+
+**Deliverables:**
+- `visual_workflow_builder/frontend/src/utils/SearchEngine.ts`
+- Advanced search with result ranking
+- Search result navigation
+
+**Acceptance Criteria:**
+- Searches across all content sections
+- Ranks results by relevance
+- Highlights matching terms
+- Supports navigation between results
+- Handles no results gracefully
+
+#### Task 4.3: Add Accessibility Features
+**Estimate:** 2 hours  
+**Priority:** Medium  
+**Dependencies:** Task 3.2
+
+Implement accessibility features for the documentation system.
+
+**Deliverables:**
+- Keyboard navigation support
+- Screen reader compatibility
+- Font size adjustment
+- High contrast support
+
+**Acceptance Criteria:**
+- F1 key opens documentation for selected tool
+- Full keyboard navigation in popups and tabs
+- ARIA labels for screen readers
+- Adjustable font sizes
+- Meets WCAG 2.1 AA standards
+
+### Phase 5: Performance & Polish
+
+#### Task 5.1: Implement Performance Optimizations
+**Estimate:** 2 hours  
+**Priority:** Medium  
+**Dependencies:** Task 4.2
+
+Optimize performance for large documentation content.
+
+**Deliverables:**
+- Content lazy loading
+- Search result caching
+- Component memoization
+
+**Acceptance Criteria:**
+- Documentation loads in <200ms
+- Search results appear instantly for cached queries
+- Memory usage remains reasonable
+- No performance impact on main workflow builder
+
+#### Task 5.2: Add Error Handling & Fallbacks
+**Estimate:** 2 hours  
+**Priority:** Medium  
+**Dependencies:** Task 5.1
+
+Implement comprehensive error handling and graceful degradation.
+
+**Deliverables:**
+- Error boundary components
+- Fallback content for missing documentation
+- User-friendly error messages
+
+**Acceptance Criteria:**
+- Handles missing documentation gracefully
+- Shows fallback content when errors occur
+- Provides recovery options for users
+- Logs errors for debugging
+
+### Phase 6: Testing
+
+#### Task 6.1: Unit Tests
+**Estimate:** 4 hours  
+**Priority:** High  
+**Dependencies:** Task 5.2
+
+Create comprehensive unit tests for all components and services.
+
+**Deliverables:**
+- `visual_workflow_builder/frontend/src/components/HelpButton/__tests__/index.test.tsx`
+- `visual_workflow_builder/frontend/src/components/DocumentationPopup/__tests__/index.test.tsx`
+- `visual_workflow_builder/frontend/src/components/DocumentationTab/__tests__/index.test.tsx`
+- `visual_workflow_builder/frontend/src/services/__tests__/DocumentationService.test.ts`
+- Test coverage >90%
+
+**Acceptance Criteria:**
+- All components have unit tests
+- Service methods are fully tested
+- Edge cases and error conditions covered
+- Tests run in CI/CD pipeline
+
+#### Task 6.2: Property-Based Tests
+**Estimate:** 3 hours  
+**Priority:** Medium  
+**Dependencies:** Task 6.1
+
+Implement property-based tests using fast-check to validate system properties.
+
+**Deliverables:**
+- `visual_workflow_builder/frontend/src/__tests__/properties/toolDocumentation.properties.test.ts`
+- Tests for all 8 core properties from design document
+- Minimum 100 iterations per property test
+
+**Acceptance Criteria:**
+- All core properties from design document are tested
+- Tests validate documentation completeness
+- UI integration properties are verified
+- Performance properties are validated
+- Tests include proper tags: `Feature: tool-documentation-ui, Property X: [description]`
+
+#### Task 6.3: Integration Tests
+**Estimate:** 2 hours  
+**Priority:** Medium  
+**Dependencies:** Task 6.2
+
+Create integration tests for the complete documentation system.
+
+**Deliverables:**
+- `visual_workflow_builder/frontend/src/__tests__/integration/documentationSystem.test.tsx`
+- End-to-end workflow tests
+- Cross-component interaction tests
+
+**Acceptance Criteria:**
+- Tests complete user workflows (palette → popup → properties)
+- Validates data flow between components
+- Tests accessibility features
+- Verifies performance requirements
+
+## Implementation Guidelines
+
+### Code Standards
+- Follow existing TypeScript/React patterns in the codebase
+- Use Material-UI components for consistency
+- Implement proper TypeScript interfaces for all data structures
+- Follow existing CSS naming conventions
+
+### Performance Requirements
+- Documentation popup must open in <200ms
+- Search results must appear instantly for cached queries
+- No impact on main workflow builder performance
+- Memory usage must remain reasonable
+
+### Accessibility Requirements
+- Full keyboard navigation support
+- Screen reader compatibility with ARIA labels
+- Adjustable font sizes
+- High contrast mode support
+- F1 shortcut for contextual help
+
+### Testing Requirements
+- Unit test coverage >90%
+- Property-based tests for all core properties
+- Integration tests for complete workflows
+- Performance tests for loading times
+
+## Success Criteria
+
+The implementation is considered successful when:
+
+1. **All 14 existing tools have complete French documentation** accessible via both palette help buttons and properties panel tab
+2. **Documentation loads in <200ms** and provides instant search results
+3. **Full accessibility support** including keyboard navigation and screen reader compatibility
+4. **Comprehensive test coverage** with unit, property-based, and integration tests
+5. **Zero performance impact** on existing workflow builder functionality
+6. **Graceful error handling** with appropriate fallbacks for missing content
+
+## Estimated Total Effort
+
+**26 hours** across 6 phases, with tasks prioritized for incremental delivery and testing.