UIlicious & AI Studio: Alertas por SMS para testes com low-code

Você deveria ir a conferências de desenvolvedores! Em primeiro lugar, você volta para casa com todo tipo de material legal de graça. E, em segundo lugar, você aprende sobre novas metodologias e softwares. E o mais importante: você tem a chance de conversar com pessoas de carne e osso que estão criando essas novas ferramentas incríveis.

Quando estive na conferência CityJS em Cingapura, conheci uma nova plataforma low-code incrível chamada UIlicious. Sim, fui atraído pela chance de ganhar um Nintendo Switch. A tarefa era simples: criar alguns testes legais com o UIlicious. E, em menos de 30 minutos, consegui desenvolver uma integração bem legal entre o UIlicious e o AI Studio da Vonage para criar testes automatizados com alertas.

Neste artigo, você aprenderá a criar alguns testes básicos no UIlicious e a configurar alertas por SMS no AI Studio quando seus testes falharem. E fará tudo isso com plataformas de interface do usuário (UI) de baixo código e fáceis de usar!

Pré-requisitos

• UIlicious Account

• Account de desenvolvedor da Vonage

Como criar testes no UIlicious

Escrever testes no desenvolvimento de software é notoriamente trabalhoso. É como ir ao dentista: todo mundo sabe que precisa fazer isso, mas ninguém quer. O UIlicious é uma excelente plataforma nova que facilita bastante a tarefa de escrever testes.

Em primeiro lugar, você não precisa baixar nada. O UIlicious é hospedado no navegador. Assim, você pode escrever seus testes, executá-los, ver os resultados e até mesmo programar um monitoramento regular, tudo diretamente no navegador.

Em segundo lugar, escrever testes com o UIlicious não exige experiência em escrever testes nem mesmo em programação. A plataforma promete:

Basta escrever seus testes como se estivesse explicando ao seu pai, por telefone, como fazer login no Facebook.

Saiba mais sobre como realizar testes no UIlicious com o Editor no navegador.

Como escrever nossos testes

No UIlicious Studio, abra um novo projeto. Crie uma nova pasta. Adicione um novo teste à sua pasta da seguinte maneira:

Create a new test file in UIlicious

Como configurar alertas por SMS para o UIlicious

Missão: Queremos testar o site de documentação do UIlicious e garantir que haja informações sobre as integrações com a Vonage.

Queremos verificar se o site de documentação possui uma seção sobre integrações com a Vonage. Para isso, nosso teste acessará o site da UIlicious, irá até a documentação e, em seguida, procurará a aba correspondente na seção de integrações.

O resultado do teste parece incrivelmente semelhante à linguagem humana que acabei de escrever! Dê uma olhada:

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

// Navigate to the Integrations section:
I.see("How to Guides")
I.click("How to Guides")
I.see("Integrations")
I.click("Integrations")

Agora precisamos, de alguma forma, verificar se o Vonage não está presente. O UIlicious nos permite escrever JavaScript diretamente em nossos testes. Assim, podemos usar uma condição e verificar se o Vonage não aparece:

if(!(I.see$("Vonage"))){
  // Something will happen here
}

Como criar um agente no SMS AI Studio

Mas o que queremos colocar aqui? Precisamos, de alguma forma, acionar nosso agente do AI Studio, que, por sua vez, enviará o SMS. Portanto, precisaremos acessar o Vonage Painel do Desenvolvedor da Vonage e criar um novo agente! Podemos seguir as instruções da documentação para criar nosso agente de SMS. Existem três opções importantes para o nosso agente; selecione:

• Tipo: SMS

• Modelo: Começar do zero

• Evento: Outbound

Como vamos enviar apenas uma única mensagem de alerta, nosso fluxo será bem simples. Vamos criar um parâmetro personalizado parâmetro (da entidade @sys.any) chamado $TestingError. Em seguida, nosso único nó “Enviar Mensagem” enviará uma mensagem junto com nosso $TestingError que virá do nosso teste. O nó deve ficar assim:

Send Alert Node in AI Studio

Para melhorar a experiência do cliente, conclua o fluxo com um nó “Encerrar conversa”.

Como acionar um agente SMS do AI Studio a partir do UIlicious

Agora que nosso agente está pronto, vamos acioná-lo a partir do nosso teste. O UIlicious nos permite fazer solicitações HTTP, exatamente da maneira que AI Studio nos orienta a acionar um agente de saída. Dentro da nossa condição, precisamos adicionar o seguinte código:

if(!(I.see$("Vonage"))){
  let res = UI.httpPost("https://studio-api-eu.ai.vonage.com/messaging/conversation", {
    headers:{ "X-Vgai-Key": "YOUR X-Vgai-Key"},
    // Instructions to send AI Studio
    data: { 
      "to": "TO_NUMBER", 
      "agent_id": "AGENT_ID", 
      "channel": "sms",
      "session_parameters": [{
        "name": "TestingError",
        "value": "Vonage not found in Integrations Section"
      }]
    },
    //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))
}

Você precisará atualizar o X-Vgai-Key, to, agent_id com seus valores.

• Você pode encontrar a X-Vgai-Key no canto superior direito da sua tela. Clique no ícone “usuário” e, em seguida, em “Gerar chave de API”.

• O to número é o destino para o qual os alertas serão enviados, provavelmente para quem estiver responsável pelo seu DevOps.

• O agent_id podem ser encontrados na seção “Detalhes do agente”:

AI Studio Agent Details

O que esse código faz?

• Ele envia uma solicitação ao AI Studio, o que aciona um agente.

• Qual agente? Bem, deve ser um agente de SMS e, especificamente, o agent_id esse, e ele usa o seu X-Vgai-Key para garantir que essa seja uma solicitação legítima.

• Também informamos para onde a mensagem deve ser enviada. Fornecemos o valor do $TestingError parâmetro, para que ele saiba o que informar ao usuário final.

• E, por fim, processamos a resposta do AI Studio, que nos informa se a solicitação foi bem-sucedida ou não.

Participe da conversa

Você gostou deste artigo? Quais ferramentas você está usando para testes de software? Adoraria saber quais são suas ferramentas “no-code” e “low-code” preferidas. Confira mais de nossas posts do blog sobre low-code.

Você está usando SMS para notificações ou outros canais? Acesse a Slack da Comunidade de Desenvolvedores da Vonage e conte para a gente o que você está desenvolvendo.

Adoraria saber o que você acha do AI Studio e do UIlicious. Manda um tweet no X, antes conhecido como Twitter. E dê um follow enquanto estiver por lá!