[Música] Beleza boa noite pessoal meu nome é Adriano vou apresentar para vocês uma ferramenta para automação de testes web o nome dela é Ghost inspector e eu vou mostrar para vocês uma proposta de você deixar tudo pronto e funcionando em apenas Quatro Passos isso mesmo tudo em apenas Quatro Passos Então você vai adicionar uma extensão você vai gravar o seu teste você vai deixar ele tem continuo e vai te notificar tudo isso simples e uma das vantagens né Desse Framework você não precisa aprender nenhuma linguagem de programação você não precisa aprender rub você não precisa
ter um diretório não precisa ter um controle de versão onde vou guardar meu código onde eu vou versionar quais browser que eu vou executar esse teste se vai ter um geek drive específico se vai ter uma versão específica do fire foox que tem que executar que não é compatível com a versão xpto Esquece tudo isso comess com esse Framework você de nada disso se eu vou ter docker se eu vou ter Jen você eu preciso configurar se vai ter content se vai ter memória não esquece tudo isso a ideia ser simples mas como ele funciona
bom ele é um como a comentado anteriormente ele é uma extensão livre de para gravação do Chrome Então ele vai gravar para você e todos os seus passos aí para quem é já familiarizado com celen ide Ele é bem similar só que bem mais simples do que o cend porque cende ainda tem aquela questão de configurar tempo dependendo do jeito que você executa você tem que diminuir o tempo esse daqui não tem muito esse tipo de problema eh então você adiciona e essa extensão no seu navegador então depois você só começa a gravar Então essa
esse é o visual depois que você adiciona essa extensão e quais que são as vantagens dessa né Depois que você grava esse seu teste ele tá com um servidor na nuvem então você não precisa se preocupar mais com nada com isso Você gravou fez os seus aceres gravou e espera ele vai ele já vai salvar esse seu teste vai deixar na nuvem e vai executar de tempos em tempos acordo que você for configurar então por exemplo se você tem uma uma API tipo ah eu quero configurar um projeto que a cada comite ele Execute seus
testes você também consegue configurar dessa forma ou você consegue configurar aquele execut de tempos em tempos E se eu não quiser gravar tipo ah não sou adepto à gravação eu gosto de eu mesmo fazer meus passos eu gosto de fazer meus servs não gosto desse tipo de Framework você também consegue fazer E nele você tem um um editor visual que é bem bem simples bem intuitivo que permite que você grave cada step de igual você faz normalmente no seu código só sempre preocupar com a com edificação instanciar o objeto fazer novo nova classe não precisa
preocupar muito com isso eh Essa é a interface gráfica dele então você vê que é bem simples Então você tem desde elementos simples como dá um clique no elemento você seleciona el pro CSS por por expf com classe sem precisar tipo criar um uma linha de comando gigantesca por exemplo para poder fazer uma coisa simples eh aqui eu falo que ele tem uma uma suporte para grande variáveis e além disso você consegue por exemplo também subir arquivos faz o pad de arquivo quero fazer um teste de um pad de um arquivo e depois executar ele
normalmente em linguagem de programação Hub Java isso seria bem difícil daria para fazer mas muito mais complicado aqui seria uma coisa bem simples de fazer também monitorando seus testes eh depois que você executa você cria esses testes ual tinha comentado antes você pode configurar na P line Ele trabalha com conceit de PEP line e teste Então você consegue configurar numa P Line que os testes executas de tempos em tempos de hora em hora de mês em mês ou de 15 15 dias ou um teste específico Ah eu quero que esse teste por ser crítico eu
quero que Execute de 10 em 10 minutos por exemplo e você vai ser notificado se ele falhar eh na interface visual dele esse é um é o exemplinho dele então você vai ter um um resumo do que do que aconteceu no seu teste então aqui na parte de cima você tem o nome do seu teste os passos que ele que ele executou para até chegar ao sucesso fala assim ah eu eu eu de como sucesso por causa desses Passos ele grava também um micr vídeo para você mostrando o que que el fez e uma imagem
que seria o assert dele para configurar se deu certo ou não nessa imagem você consegue configurar um percentual de de asserção por exemplo Ah eu quero que a imagem seja o teste passe se for simular 10% ou não ah se for até a diferença de 90% pode deixar passar porque eu eu tô eu tô assumindo esse risco ã a aqui eu falo as capturas de tela aí comparando mudanças dees que é o que mais acontece normalmente testes de aceitação são bem sábios Prime por causa de layout Ah o cara mudou a cor do teste mudou
um ponto era para ser salvo com sucesso sem ponos o cara colocou um ponto o teste não passa mais com isso daqui você consegue garantir esse tipo de coisa e também a parte de testes igual aqui eu tinha comentado Então você consegue configurar um percentual para esse teste ser compatível de 0 a 90% e ele identificar e ele também te grava essa mudança aí tinha até ter documentado é anteriormente aí o num reunião que assim por exemplo imagina que um teste você colocou que é para ser ser certo até 10 esse aqui 2% aí falou
assim ó deu diferença de 3.1% só que eu Imagina que realmente mudou eu quero que esse teste seja que a nova tela vai ser essa então você consegue fazer um accept então agora o novo screenshot de Acer desse teste é esse Então você consegue is bem bem Limpo também você não precisa Ah agora vou ter que criar um novo teste salvar uma nova imagem para poder substituir não você ver Ah tá certo isso daqui aceita Então a partir de agora todos os set vão assumir que a nova imagem o novo screenshot certo é esse que
paramente deu errado agora eh tem algumas configurações personalizadas Então você consegue configurar uma url de início por exemplo não tem que ficar escrevendo todas vezes os testes então ah sempre bate nessa URL você consegue agendar você consegue fazer autenticações vi http você consegue configurar um cust user argente que seria Ah eu quero executar num emulando um celular eu quero simular emulando um PDA Então esse parece veria essa parte de cust argente string resoluções de tela IP Ah eu quero rodar esse teste no Brasil Ah quer não quero rodar esse teste na Virgínia para ver quant
como que ficaria se o meu usuário usasse esse essa minha aplicação em outro país por exemplo integrações com alguns outros serviços também mas chega de de muita teoria Vamos fazer um teste na prática então vou sair aqui rapidinho então vou abrir aqui então zoom aqui e aqui então aqui você adiciona extensão Então vou adicionar aqui na hora vocês então Você busca ela ess extensão no Chrome adiciona ela beleza Quero adicionar extensão aí uma coisa que é importante você tem que ter uma conta né nesse no serviço deles então já viu aqui o Fantasminha aqui no
no cantinho direito então você loga aqui então você coloca seu e-mail usuário op Opa os cara quase pegou minha s viu vocês são esper hein esperto com vocês então depois que loga ele já habilita aqui a parte de começar gravação então para testar eu vou uma plataforma de testes eu perdi meu mouse agora não funcionando mais uma plataforma de cursos online A babel.com então vamos imaginar que minha minha o o meu produto é um site de de cursos eu quero garantir que o fluxo então eu quero garantir que Alunos novos consigam fazer cursos então por
exemplo então V começar a gravar aqui então você dá é Bem Simples então você dá gravar Então ele já começou a gravar ele não tá fazendo nenhum passo então você não precar meu Deus agora vou começar a gravar porque senão vai o vídeo vai ficar gigantesco não ele vai gravar a cada passo Então você tá parado aqui tô conversando com vocês ele não tá fazendo nada uhum Então beleza você escolhe então que escolher Ah quero escolher que eu quero aprender inglês os caras mudaram o layout do site que antes não tava assim mudança layout Então
vamos lá quero aprender espanhol Aí sim quero escolher o nível E aí ele vai perguntar minha idade Então vou colocar idade aqui eu acho que isso aqui deve ser olá olá deve ser gracias gracias buas noites meu Deus e agora perdão perdão Ah tá pronto tá pronto tá vendo aí pr tipo para não ficar também muito extenso Então vamos começar a fazer os aceres Como que você faz os aceres dele é só se você clicar novamente no no fantasminha aqui make asserções aí você pode colocar qualquer elemento da tela então por exemplo quero garantir que
tenha essa palavrinha aqui olá eu quero que tenha Hello que tenha T que é estranho num curso de espanhol mas tudo bem aí finalizei então a finish aí você define qual que vai ser o nome do seu teste então aqui papo reto Aí ele trabal com conceito também de swits então você pode Switch para seus testes específicos então crii aqui uma Switch do papo reto aí você consegue dizer se você quer comparar os screenshots ou não agora você pode configurar isso posteriormente também então já vamos colocar aqui para comparar o screenshot para depois eu mostrar
para vocês uma coisa legal você também já consegue configurar que assim que ele salva esse teste ele já Execute ele agora tipo ah já salvou já executa pela primeira vez então beleza então o meu teste tá pronto então vocês viram que eu não precisei aprender linguagem programação nenhuma não ficar me preocupando em tempo em frw qu o browser que eu iria executar agora aí enquanto ele vai salvando o meu teste no servidor vou mostrar PR vocês onde o usuário consegue acessar Todas aquelas configurações que eu mostrei nos slides lá então tenho que logar de novo
vai tristeza erado Peg errado meu Deus Beleza então meu Deus já termin aqui rápido meu Deus muito rápid falou Beleza então vamos lá então aqui ele criou a de testes a onde que o cara configurao aquele espaço aí seriam aqui os steps por exemplo eu quero mudar um passo desse teste antes que ele Execute então aqui Seria onde o usuário colocar Ah eu quero adicionar o novo passo que eu não eu não fiz na gravação aqui ele também Faria aí a nível de edição de como eu executo os testes a gente também tem um pouquinho
mais de configurações aqui então aqui em settings então aqui eu tenho o nome do meu mas aqui é T na sutch pera aí per deixa eu entrar no s entrar no Test E se eu entrar aqui cadei o mesmo nome que bonito teste Então beleza aí aqui você consegue a o nome dele né então aqui você consegue colocar o nome qual Switch que esse teste vai est uma descrição Uma Breve descrição para facilitar para você a parte de agendamento então aí aqui Entra naquele ideia do conceito sempre aqui boa parte das configurações você vai ter
ah que ele pegue as configurações da Switch ou que eles pegu as configurações do teste então por exemplo aqui tempo de agendamento pega da Switch ou não quero que eles que ele que tenha agendamento ou que eu Rode uma vez por dia uma vez uma vez por hora cada 30 minutos assim por diante qual browser que eu vou executar Então não preciso ficar me preocupando com que que eu drive qual versão do Firefox que vou usar aqui eu já consigo configurar isso então ah eu quero que Execute na última versão do Firefox não quero que
use na na versão do Phantom com web kit por exemplo aqui a parte do usos gente eu quero executar no no Firefox emulando o celular Firefox do celular como ficaria aqui a parte de requisições de htp autenticação caso seja necessário e aqui tem os steps delay né tipo quanto tempo que ele vai fazer de delay em entre cada passo quanto tempo que você quer que aguarde cada elemento caso o teste seja um pouquinho lento as requests aqui o final de ScreenShot Tipo depois de quanto tempo que você quer que ele tire a última screenshot para
dizer que terminou o teste aqui nos displays options Qual que é o tamanho que você quer que Execute esse teste então tem várias configurações aqui e se você quer compare ou não quando você habilita a comparação de imagem aí você consegue configurar aquele percentual que lá na apresentação ele fala que é de de 10 a 90% que acho que o quee fala que é o seguro né mas você pode falar assim não de zero se não for 100% igual eu não quero que passe o teste o g location então conso onde que esse teste vai
executar tem algumas opções aqui Canadá frankfur São Paulo Canadá Então você consegue executar de acordo com a necessidade você consegue pegar erros de JavaScript que em teste nenhum você conseguiria não se um teste específico de JavaScript com esse que você consegue garantir então Ah quebrou o JavaScript você esse teste pegaria para você ah o JavaScript não tá compilando então você consegue configurar aqui ó bota o teste se se tiver um ver JavaScript a mesma coisa o retry você consegue tipo ah quebrou dá um retry automático em vez de ficar me me notificar e tudo isso
aqui você consegue configurar se vai ser notificado por e-mail ou por se você configurar o um api se você quer ser notificado no Slack por exemplo que seria aqui o outro passo né se você quer ser notificado por e-mail sim ou não e se você tem web Hook se você quer configurar aí aqui depois web Hook cabe mais algumas opçõe zinhas aqui para você adicionar o seu seu web Hook para configurar aí sem mais delongas vamos ver o que que ele fez aqui nosso teste que falhou então ele falou ele falou que executou esses passos
que deu algum problema nesse elemento aí ele no screenshot aqui aparentemente deu problema porque é do Gracias e aqui que é o mais legal que eu já vejo desse desse Framework ele grava um micr vídeo eu não vi aind nenhum Framework que faz isso então além de executar o teste ele grava um micr vídeo para você mostrando o que que eu fiz então executou todos esses passos e parou aqui porque provalmente aqui na hora que deu esse graces aqui não deu certo então não conseguiu ir até aquela próxima etapa então por exemplo um teste simples
já pegaria um erro de de fluxo imagina que esse fluxo tivesse quebrado o usuário não consegue chegar até o passo dois por exemplo o teste já te notificar por e-mail E é isso que eu tinha para mostrar para [Música] vocês Y
