https://d226lax1qjow5r.cloudfront.net/blog/blogposts/uilicious-ai-studio-voice-alerts-for-low-code-testing/uilicious-ai-studio_voice-alert.png

UIlicious & AI Studio : Alertes Voice pour les tests de code bas

Publié le October 26, 2023

Temps de lecture : 3 minutes

UIlicious & AI Studio : Alertes Voice pour les tests de code bas

Qui aime écrire des tests de logiciels ? Personne ! Mais récemment, j'ai découvert une excellente plateforme de test low-code appelée UIlicious.

Uilicious possède de nombreuses fonctionnalités mais ne dispose pas d'alertes téléphoniques en cas d'échec des tests. Heureusement, nous pouvons construire une solution entièrement en code bas en intégrant UIlicious à AI Studio. Dans cet article, vous apprendrez à construire des tests UIlicious et à créer des alertes Voice (téléphone) dans AI Studio. Et vous ferez tout cela avec des plates-formes d'interface utilisateur conviviales à code bas !

Conditions préalables

Vonage API Account

To complete this tutorial, you will need a Vonage API account. If you don’t have one already, you can sign up today and start building with free credit. Once you have an account, you can find your API Key and API Secret at the top of the Vonage API Dashboard.

Comment construire des tests avec UIlicious

L'écriture de tests dans le cadre du développement de logiciels est notoirement pénible. C'est un peu comme aller chez le dentiste ; tout le monde sait qu'il faut le faire, mais personne ne veut le faire. UIlicious est une nouvelle plateforme géniale qui élimine une grande partie de la douleur liée à l'écriture de tests automatisés.

Tout d'abord, vous n'avez pas besoin de télécharger quoi que ce soit, UIlicious est hébergé dans le navigateur. Vous pouvez donc écrire vos tests, les exécuter, voir les résultats et même programmer des contrôles réguliers, le tout dans le navigateur.

Deuxièmement, l'écriture de tests avec UIlicious ne nécessite pas d'expérience dans l'écriture de tests ou même de logiciels. La plateforme promet :

Rédigez vos tests comme si vous expliquiez à votre père comment se connecter à Facebook par téléphone.

En savoir plus sur les tests dans UIlicious avec l'outil éditeur en ligne.

Rédiger nos tests

Dans le UIlicious Studioajoutez un nouveau projet. Créez un nouveau dossier. Ajoutez un nouveau test à votre dossier comme ceci :

How to create a new test file in UIliciousHow to create a new test file in UIlicious

Comment configurer les alertes Voice pour UIlicious

Mission : Nous voulons tester le site de documentation d'UIlicious et nous assurer qu'il contient des informations sur les intégrations de Vonage.

Pour notre test, nous voulons vérifier si quelque chose en rapport avec Vonage existe sur le site de documentation. Pour ce faire, notre test visitera le site UIlicious, ira à la recherche globale et vérifiera si une recherche pour Vonage donne un résultat vide.

Les tests ressemblent remarquablement au langage humain que je viens d'écrire ! Jetez-y un coup d'œil :

// Start by going to the documentation, like this:
I.goTo("<https://uilicious.com/>")
I.see("Docs")
I.click("Docs")

// Perform a search for Vonage
I.see("Search")
I.click("Search")
I.fill("Search docs", "Vonage")

// Now we need to somehow evaluate that Vonage is not here. UIlicious allows us to write Javascript directly into our tests. We know that an empty search returns the words No results for "Vonage"', so we can use that to write a conditional:
if(I.see$('No results for "Vonage"')){ 
// Something will happen here
}

Comment créer un agent Voice AI Studio

Mais que voulons-nous mettre en œuvre dans notre conditionnel ? Nous devons déclencher notre agent AI Studio qui, à son tour, enverra l'appel téléphonique. Nous devons donc nous rendre dans le tableau de bord du développeur de Vonage tableau de bord du développeur et créer un nouvel agent ! Nous pouvons suivre les instructions de la documentation pour créer notre agent Voice. Il y a trois options importantes à sélectionner pour notre agent :

  • Type : Téléphonie

  • Modèle : Partir de zéro

  • Événement : Appel sortant

Notre flux sera très simple puisque nous n'envoyons qu'un seul message d'alerte. Nous allons créer un paramètre personnalisé paramètre appelé $TestingError. Ensuite, notre nœud Speak unique enverra un message audio comprenant notre $TestingErrorqui proviendra de UIlicious. Le nœud devrait ressembler à ceci :

Send Alert Node in AI StudioSend Alert Node in AI Studio

Comment déclencher un agent vocal d'AI Studio depuis UIlicious

Maintenant que notre agent est prêt, déclenchons-le à partir de notre test. UIlicious nous permet d'appeler des requêtes HTTP exactement de la même manière qu'AI Studio nous indique de déclencher un agent sortant. AI Studio nous indique de déclencher un agent sortant. Dans notre conditionnel, nous devons ajouter le code suivant :

if(I.see$('No results for "Vonage"')){
  let res = UI.httpPost("https://studio-api-eu.ai.vonage.com/telephony/make-call", {
    headers:{
      "X-Vgai-Key": "YOUR X-Vgai-Key"
    },
    // Instructions to send AI Studio
    data: { 
      "to": "TO_NUMBER", 
      "agent_id": "AGENT_ID", 
      "session_parameters": [{
        "name": "TestingError",
        "value": "Vonage not found in Global Search!"
      }]
    },
    // Expect the response to be JSON
    responseType: "json", 
  })
  //Log the response from the API
  TEST.log.info("Response from API is: " + JSON.stringify(res.data))
}

Vous devrez mettre à jour les X-Vgai-Key, to, agent_id en fonction de vos valeurs.

  • Vous trouverez l'icône X-Vgai-Key en haut à droite de votre canevas. Cliquez sur l'icône "utilisateur", puis sur "Générer une clé API".

  • Le numéro to numéro est la destination vers laquelle les alertes iront, probablement la personne en charge de votre DevOps.

  • Les agent_id se trouve dans les détails de l'agent :

AI Studio Agent DetailsAI Studio Agent Details

Que fait le code ?

  • Il envoie une demande à AI Studio, qui déclenche un agent.

  • Quel agent ? L'agent ayant agent_id utilise alors votre X-Vgai-Key pour s'assurer qu'il s'agit d'une demande légitime.

  • Nous lui indiquons également où envoyer l'appel téléphonique.

  • Nous fournissons la valeur du paramètre $TestingError afin qu'il sache ce qu'il doit dire à l'utilisateur final.

  • Enfin, nous traitons la réponse d'AI Studio, qui nous indique si la demande a abouti ou non.

Participez à la conversation

Vous avez apprécié cet article ? Quels outils utilisez-vous pour tester vos logiciels ? J'aimerais connaître vos outils préférés de type "no-code" et "low-code". Vous pouvez consulter d'autres articles de notre blog sur le articles de blog sur le low-code.

Vous utilisez Voice pour les notifications ou d'autres canaux ? Rendez-vous sur le Slack de la Slack de la communauté des développeurs de Vonage et faites-nous savoir ce que vous construisez.

J'aimerais savoir ce que vous pensez d'AI Studio et d'UIlicious. Envoyez-moi un Tweet sur X, anciennement connu sous le nom de Twitter. Et donnez à VonageDev pendant que vous y êtes !

Partager:

https://a.storyblok.com/f/270183/384x384/e4e7d1452e/benjamin-aronov.png
Benjamin AronovDéfenseur des développeurs

Benjamin Aronov est un défenseur des développeurs chez Vonage. C'est un bâtisseur de communauté qui a fait ses preuves, avec une formation en Ruby on Rails. Benjamin apprécie les plages de Tel Aviv, où il vit. Sa base à Tel Aviv lui permet de rencontrer et d'apprendre de certains des meilleurs fondateurs de startups du monde. En dehors de la technologie, Benjamin aime voyager à travers le monde à la recherche du parfait pain au chocolat.