Le Blog Amazon Web Services

Révolutionner vos tests d’interface utilisateur de bout en bout avec IA Agentique et « Computer Use » d’Anthropic sur Amazon Bedrock (Partie 1)

Cette série, en 2 parties, explore une approche pour automatiser les tests d’interface utilisateur de bout en bout (E2E) en utilisant l’IA générative dans un contexte de système agentique, en utilisant l’outil Computer Use (Utilisation de l’ordinateur) d’Anthropic.

Le premier article se concentre sur l’intégration de l’outil Computer Use dans un environnement de navigateur sans périphériques, adapté aux pipelines d’intégration et de déploiement continus (CI/CD). Il détaille l’architecture proposée et illustre son application concrète pour tester les parcours utilisateurs sur amazon.com.

La deuxième partie, explore comment appliquer Computer Use dans une application React personnalisée et intégrer des outils supplémentaires, tels que Bash et des éditeurs de texte, pour gérer des charges de travail personnalisées.

Avertissement : Il s’agit d’une solution expérimentale, pas d’une offre, complète ou managée, et il n’y a aucun engagement de la part d’AWS concernant son développement ou sa disponibilité future.

Tests de bout en bout: Un problème récurrent

Les tests de bout en bout sont une pratique essentielle pour assurer la fiabilité des systèmes. Cependant, le processus comporte des défis qui le rendent complexe, fragile et gourmand en ressources. Ces défis se traduisent souvent par des retards dans le déploiement des fonctionnalités, une augmentation des coûts et une frustration des développeurs qui préféreraient se concentrer sur le développement de nouvelles fonctionnalités plutôt que sur la maintenance de suites de tests fragiles.

Principaux défis des tests de bout en bout :

  1. Simuler précisément le comportement réel : Les tests de bout en bout reproduisent la façon dont les utilisateurs interagissent avec une application, ce qui implique souvent des modèles d’utilisation imprévisibles et dynamiques impossibles à modéliser.
  2. Comprendre les librairies d’Interface Utilisateur (UI) et les sélecteurs : L’écriture de tests efficaces nécessite une compréhension approfondie des librairies UI, de la structure Document Object Model (DOM) et des sélecteurs Cascading Style Sheets (CSS), ce qui peut être complexe, en particulier pour les équipes nouvelles dans la stack.
  3. Exigences évolutives : Les mises à jour fréquentes des fonctionnalités ou des éléments de design rendent souvent les tests existants obsolètes, nécessitant une maintenance constante.
  4. Gestion des données dynamiques : Les applications modernes reposent sur des données dynamiques en temps réel, ce qui complique les assertions et la configuration des tests.

Ces défis soulignent le besoin urgent de solutions d’automatisation plus intelligentes dans les tests d’interface utilisateur. L’automatisation permet aux développeurs de rationaliser le processus de test, réduire la charge de maintenance et livrer des fonctionnalités plus rapidement sans compromettre la qualité.

Bien que la solution proposée ne réponde pas à tous ces défis, elle fournit un point de départ solide pour aborder une partie de la complexité—particulièrement en simplifiant le processus de test et en réduisant la dépendance à une connaissance approfondie des librairies d’interface utilisateurs. Elle ouvre des opportunités pour une exploration et un perfectionnement supplémentaires dans le paysage évolutif de l’automatisation des tests d’interface utilisateur de bout en bout.

Qu’est-ce qui a changé ?

Avec l’essor des Large Modèles de Langage (LLM), ces agents, outils et plus largement de l’Intelligence Artificielle (IA), les systèmes peuvent désormais comprendre à la fois le langage humain et le contexte informatique. Ils peuvent interpréter le code, analyser le comportement des applications et aider à automatiser des tâches qui nécessitaient auparavant un effort manuel considérable.

Cela soulève une question intéressante : Est-ce que les LLM peuvent être utilisés pour automatiser les tests de bout en bout ? Imaginez un outil alimenté par l’IA qui peut automatiquement exécuter des tests basés sur des descriptions en langage naturel, naviguer dans le système reconnaître les éléments d’interface utilisateur et s’adapter aux changements. Cela sans avoir besoin de sélecteurs créés manuellement. Les capacités des Agents LLM rendent possible, offrant une solution prometteuse aux défis des tests de bout en bout.

Présentation de l’outil Computer Use d’Anthropic

Anthropic Claude est un large modèle de langage (LLM) de pointe doté de capacités de raisonnement avancées et d’analyse visuelle. L’entreprise a récemment présenté l’outil Computer Use dans la version Sonnet 3.5 v2, une fonctionnalité qui permet à Claude de comprendre le contexte informatique via son API. Cela signifie que les LLM sont capables de comprendre le langage humain, de reconnaître les pages web et les composants UI grâce à des capacités visuelles avancées, et d’interagir avec les systèmes en temps réel.

Avec le support API pour prendre des captures d’écran, effectuer des actions comme déplacer la souris, saisir du texte, cliquer, faire défiler et plus encore, Claude peut maintenant interagir avec les applications d’une manière auparavant inimaginable pour un LLM.

Comment utiliser Computer Use pour automatiser les tests UI ?

Architecture d'Automatisation de Tests Web avec Selenium et Amazon Bedrock

Figure 1 : Architecture d’Automatisation de Tests Web avec Selenium et Amazon Bedrock

Pour exploiter efficacement l’outil Computer Use de Claude pour l’automatisation des tests UI, il faut quelques composants clés :

  • Environnement : Afin de garantir que les tests puissent être exécutés sur n’importe quel environnement et être intégrés de manière transparente aux pipelines CI/CD, il faut un navigateur sans interface graphique, un navigateur headless. Ce navigateur effectue toutes les fonctions standard d’un navigateur, comme le rendu des pages web et l’exécution de JavaScript, mais sans afficher d’interface visuelle, ce qui les rend idéaux pour les tests automatisés en pipeline.
  • Loop Agent : Un script qui coordonne les interactions entre Claude et l’environnement sous-jacent, garantissant que les tâches sont effectuées de manière séquentielle et fiable.
  • Outil Computer Use : Des outils essentiels comme les contrôleurs de souris et de clavier, et un agent de capture d’écran, qui permettent au framework d’effectuer des actions (par exemple, cliquer, taper, faire défiler) et de capturer des instantanés dans l’environnement du navigateur headless.
  • Suite de tests : Les scénarios de test doivent être décrits en langage naturel, facilitant la définition et la gestion de différents cas de test pour l’UI, que Claude peut ensuite interpréter et exécuter.

Ces éléments forment un framework de test automatisé qui non seulement comprend les actions des utilisateurs, mais peut aussi interagir avec une interface utilisateur comme le ferait un humain—permettant en fin de compte de rationaliser le processus de test et d’améliorer l’efficacité.

Solution expérimentale proposée – Tests UI automatisés utilisant l’outil Computer Use

Deux versions de cette solution de framework de test sont exploré dans ces blog posts, chacune conçue pour répondre à des besoins de test distincts :

  1. Tests UI de bout en bout automatisés utilisant l’outil Computer Use en CICD
  2. Tests UI de bout en bout automatisés amélioré utilisant les outils « Bash et éditeur de texte »

Dans ce premier blog, la première solution est explorée. La deuxième sera en seconde partie du post.

Prérequis

Avant de commencer, assurez-vous de remplir les conditions suivantes :

Compte AWS

Vous devez avoir un compte AWS et un rôle et utilisateur Gestion des identités et des accès AWS (AWS IAM) avec les permissions nécessaires pour activer l’accès au modèle LLM et invoquer les API Bedrock. Si vous n’avez pas de compte AWS, consultez Comment créer et activer un nouveau compte Amazon Web Services ?

Obtenir l’accès au modèle

  • Naviguez dans Amazon Bedrock sur votre compte AWS.
  • Assurez-vous d’être dans la région ‘us-west-2’.
  • Demandez l’accès au LLM ‘Claude 3.5 Sonnet v2’ d’Anthropic.

Figure 2 : Console Amazon Bedrock – Sélection du modèle Claude 3.5 Sonnet pour les tests E2

Obtenir les identifiants AWS

Il existe plusieurs options pour se faire, la plus simple étant de configurer des variables d’environnement dans le terminal

[Linux/MacOs]
export AWS_ACCESS_KEY_ID="your-access-key-id"
export AWS_SECRET_ACCESS_KEY="your-secret-access-key"
export AWS_SESSION_TOKEN="your-session-token"
export AWS_REGION="us-west-2"

Veuillez suivre le guide AWS pour configurer les variables d’environnement pour l’AWS CLI.
Maintenant que votre environnement est prêt, procédons à l’essai de ces solutions.

Clonez le repo

git clone https://github.com/aws-samples/aws-genai-e2e-testing-samples

Installez les dépendances en créant et activant un environnement virtuel :

python3 -m venv venv
source venv/bin/activate # On Windows, use venv\Scripts\activat

Installez les packages requis

Cette solution nécessite les packages suivants :

anthropic[bedrock]>=0.37.1 # for invoking Bedrock APIs
selenium>=4.8.0 # to provide a web browser environment
jsonschema==4.22.0 # for data modelin

Vous pouvez installer les dépendances en utilisant cette commande :

pip install -r requirements.txt

Écrivez les tests dans le fichier tests/testcase.txt selon le format suivant :

  • La première ligne doit contenir l’URL du site web.
  • La deuxième ligne doit être vide.
  • Les lignes suivantes doivent contenir la description du cas de test.
  • Exemple :
https://www.amazon.com/
You are on amazon.com website.
Search for 'xbox' on the search bar at the top.
You should see a list of search results.
Click on the first item in the list.
You should see item details.
Finally verify that the item is indeed an Xbox console.

Avertissement : Vous devez fournir à la fois, l’URL du site web et indiquer dans votre scénario de test que vous êtes sur ce site web pour un meilleur contexte pour le LLM. Par exemple : « Vous êtes sur le site web amazon.com ».

Cet exemple ne montre l’exécution d’un seul test. Pour en ajouter d’autres, veuillez vous référer à src/main.py et src/utils/testcase_reader.py.

Exécutez les tests

cd src
python3 main.py

Pendant l’exécution du test :

  • Les logs détaillés sont dans la console, montrant ce que Claude fait à chaque étape.
  • Des captures d’écran seront sauvegardées dans le répertoire ./screenshots pour vous aider à mieux suivre l’exécution du test et vérifier les interactions d’interface utilisateurs.

Figure 3 : Démonstration

Conclusion

Cette approche agentique automatisé de bout en bout utilisant l’outil “Computer Use” d’Anthropic offre des possibilités de révolutionner la façon dont les développeurs abordent les tests en CICD. La capacité d’exécuter des tests basés sur le langage naturel, combinée à la flexibilité d’interagir avec des environnements dynamiques, représente un grand pas en avant dans l’efficacité du cycle de vie du développement logiciel.

Une fois perfectionnée, cette solution pourrait apporter plusieurs avantages importants :

  • Coûts QA : L’automatisation des tests réduira le besoin de tests manuels chronophages et gourmands en ressources.
  • Simplicité: Les fonctionnalités sont facilement testées tout en gardant le même contexte.
  • Systèmes plus robuste en production : Avec des tests automatisés en place, les développeurs peuvent s’assurer que les nouvelles fonctionnalités sont facilement testées et prêtes pour le déploiement, ce qui signifie plus de temps pour construire des fonctionnalités innovantes.
  • Productivité accrue des développeurs : En réduisant la charge d’écriture et de maintenance des tests manuels, les développeurs peuvent se concentrer davantage sur le développement de fonctionnalités et la résolution créative de problèmes, stimulant l’innovation au sein des équipes.

La prochaine partie de cette série explorera l’utilisation des outils Bash et éditeur de texte pour les tests automatisés E2E sur une application React personnalisée : https://aws.amazon.com/fr/blogs/france/revolutionner-vos-tests-dinterface-utilisateur-de-bout-en-bout-avec-ia-agentique-et-computer-use-danthropic-sur-amazon-bedrock-partie-2/

Maryam Khidir

Maryam Khidir

Maryam est ingénieure en développement logiciel AWS et possède une vaste expérience en tant qu’ingénieure en développement front-end et mobile. Chez AWS, elle fait partie de l’équipe Proserve PSE (Product and Solutions Engineering), où elle se concentre sur l’ingénierie de solutions évolutives qui répondent efficacement aux défis des clients et génèrent des résultats percutants.

Jeremy Labrado

Jeremy Labrado

Jeremy est un ingénieur senior en développement logiciel AWS avec une vaste expérience dans les systèmes informatiques et avec un background IoT. Passionné par l’intelligence artificielle, il travaille en étroite collaboration avec les clients pour les aider à mener à bien des projets complexes et ambigus, du début à la fin, avec des résultats percutants pour atteindre leurs objectifs principaux et stimuler l’innovation.

Mo

Mo

Mo est un ingénieur en développement logiciel AWS dans l’équipe l’équipe Produits et solutions de ProServe. Fort d’une expérience dans le développement d’applications d’IA évolutives, il participe activement au développement de solutions d’IA génératives pour les clients AWS.