Menu

Como fazer uma captura de tela no selênio

how take screenshot selenium

Experimente Nosso Instrumento Para Eliminar Problemas

Este tutorial explica a importância da captura de tela do Selenium e como usar o Ashot para obter a captura de tela no aplicativo Selenium com exemplos:

As capturas de tela são usadas basicamente na análise de bug. Eles ajudam a entender se o aplicativo funciona de acordo com os requisitos do usuário ou não.

Para cada caso de teste, a saída recebida pode ser diferente, às vezes a saída correta é recebida, às vezes obtemos um erro, às vezes uma mensagem de erro é recebida devido a dados de entrada ausentes ou insuficientes, etc. A captura de tela ajuda a rastrear as provas de ações / resultados recebido.

=> Verifique TODOS os tutoriais do Selenium aqui

Selenium Screenshots

Neste tutorial, aprenderemos onde as capturas de tela do Selenium são necessárias. Discutiremos Ashot e como podemos usar Ashot no Selenium (instalação e configuração do ashot ()), aprender a capturar screenshots no Selenium (para a página inteira da web, para um único elemento na página e para uma janela aberta atualmente, também comparando 2 imagens) e depois veja alguns exemplos em que as capturas de tela são frequentemente capturadas.

O que você aprenderá:

Compreendendo as capturas de tela do Selenium

Login do Gmail

A imagem acima é um exemplo de uma captura de tela capturada durante a execução do código do site do Gmail. A imagem ajuda a confirmar se o usuário fez login com êxito na conta de e-mail com o nome de usuário e a senha corretos.

Assim, as capturas de tela são muito úteis para capturar as ações / resultados recebidos depois que uma ação é executada e, portanto, ajudam a confirmar uma ação sendo executada sem qualquer problema.

Selenium pode fazer capturas de tela automaticamente; temos que apenas adicionar o código para captura de tela no processo de qualquer execução de código onde as capturas de tela são necessárias.

que tipo de teste é usado para verificar se todos os programas em um aplicativo funcionam corretamente juntos?

Onde as capturas de tela do Selenium são necessárias

A seguir estão as possibilidades:

  • Quando há dificuldade em encontrar um elemento em uma página da web.
  • Onde há um tempo limite para encontrar elementos da web em uma página.
  • Quando ocorre um erro ou problema no sistema / aplicativo.
  • Quando uma falha de asserção é encontrada.

O que é Ashot

Ashot () é um utilitário de terceiros que é compatível com o driver da web Selenium para capturar as imagens.

Ashot () fornece as seguintes operações na captura de imagens:

  • Capturando a página inteira
  • Capturando o elemento da web
  • Comparando imagens

Vamos ver como isso funciona exatamente na próxima seção.

Características do Ashot:

  • É possível fazer uma captura de tela de toda a página.
  • Também é possível fazer uma captura de tela de um elemento da web, que é compatível com várias plataformas, como o Android Emulator Browser, iOS Simulator Mobile Safari, os diferentes navegadores de desktop).
  • Fornece uma comparação de captura de tela flexível.
  • Decora as capturas de tela.

Ashot pode fazer capturas de tela em três etapas:

  • Captura uma imagem da página inteira.
  • Encontre o tamanho e a posição do elemento.
  • Recorta a captura de tela original.

Como podemos usar Ashot no selênio

Considere as seguintes etapas para baixar e configurar o Ashot em sua máquina:

  1. Vou ao ligação.
  2. Encontre a versão mais recente do arquivo jar presente para Ashot.
  3. Baixe e salve o arquivo jar em um caminho específico em sua máquina.
  4. Agora, para adicionar o arquivo jar ao seu projeto no Eclipse - Vá para o seu projeto -> Clique com o botão direito -> vá para propriedades -> selecione Build Path -> Bibliotecas -> adicione Jars externos
  5. Navegue até o caminho onde o arquivo jar baixado foi salvo.
  6. Selecione o arquivo jar, clique em Aplicar e feche.

Como capturar imagens no Selenium

Selenium fornece funcionalidade embutida para capturar screenshots. De acordo com o requisito, TakesScreenshot interface é usada para fazer capturas de tela, durante a execução dos scripts Selenium. Assim, Selenium Webdriver ajuda na captura de screenshots enquanto o código está sendo executado.

Na seção abaixo, aprenderemos sobre os diferentes tipos de captura de tela que são capturados.

A seguir estão os tipos:

Captura de tela de:

  • Janela aberta atual
  • Toda a página da web
  • Apenas um elemento específico da web
  • Comparação da imagem da captura de tela com a imagem original

Vamos entender os pontos acima em detalhes.

# 1) Janela aberta atual

Vejamos a implementação do código para lidar com capturas de tela no Selenium para a janela aberta no momento:

package SeleniumPrograms; import java.io.File; import java.io.IOException; import java.util.concurrent.TimeUnit; import org.apache.commons.io.FileUtils; import org.openqa.selenium.OutputType; import org.openqa.selenium.TakesScreenshot; import org.openqa.selenium.WebDriver; import org.openqa.selenium.firefox.FirefoxDriver; import org.testng.annotations.Test; @Test public class Screenshot { public static void main(String() args) throws IOException { // TODO Auto-generated method stub WebDriver drv = new FirefoxDriver(); drv.manage().window().maximize(); //always write wait code after this drv.manage().timeouts().pageLoadTimeout(10, TimeUnit.SECONDS);//for page load drv.get('https://opensource-demo.orangehrmlive.com/'); //Testing webpage drv.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS); //for Implicit wait //Capturing the screenshot File f = ((TakesScreenshot) drv).getScreenshotAs(OutputType.FILE); FileUtils.copyFile(f, new File('C:/Users/Chait/Desktop/Screenshots/screenshot01.png')); //screenshot copied from buffer is saved at the mentioned path. System.out.println('The Screenshot is captured.'); } }

A imagem abaixo é a saída da implementação do código acima. Aqui, o site OrangeHRM é aberto e a captura de tela da página de login é capturada.

Janela aberta atual

(imagem fonte )

Assim, podemos capturar imagens onde for necessário durante a execução do código. A captura de tela é salva em um arquivo com extensão .png ou .jpeg. Precisamos fornecer o caminho onde o arquivo de imagem deve ser salvo.

# 2) A página da web inteira

Vejamos o código de implementação abaixo para capturar uma captura de tela da página completa, com a ajuda de Ashot no webdriver Selenium. Para isso, vamos considerar o exemplo de uma página (Jmeter-user-defined-variables) de - softwaretestinghelp.com .

package SeleniumPrograms; import java.io.File; import java.io.IOException; import java.util.ArrayList; import java.util.concurrent.TimeUnit; import javax.imageio.ImageIO; import org.apache.commons.io.FileUtils; import org.openqa.selenium.By; import org.openqa.selenium.JavascriptExecutor; import org.openqa.selenium.OutputType; import org.openqa.selenium.TakesScreenshot; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.firefox.FirefoxDriver; import ru.yandex.qatools.ashot.AShot; import ru.yandex.qatools.ashot.Screenshot; import ru.yandex.qatools.ashot.shooting.ShootingStrategies; public class Screenshot_EntirePage { public static void main(String() args) throws InterruptedException, IOException { WebDriver drv = new FirefoxDriver(); drv.manage().window().maximize(); //always write wait code after this drv.manage().timeouts().pageLoadTimeout(10, TimeUnit.SECONDS); //for page load drv.get('https://www.softwaretestinghelp.com/'); //Testing webpage drv.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS); //for Implicit wait WebElement auto = drv.findElement(By.xpath('//ul(@id='mega-menu-primary')/li(6)')); auto.click(); //click Automation tab WebElement jmeter = drv.findElement(By.linkText('JMeter')); //link to JMeter page jmeter.click(); //scroll down to open a link among various links, in the Video Tutorials section of the page JavascriptExecutor js = (JavascriptExecutor) drv; js.executeScript('window.scrollBy(0,1700)'); //scrolling downwards Thread.sleep(1500); WebElement udv = drv.findElement(By.linkText('User-Defined Variables')); udv.click(); //opening User-Defined Variables link Thread.sleep(1500); //Capturing the Screenshot with the help of ashot() Screenshot screenshot=new AShot().takeScreenshot(drv); ImageIO.write(screenshot.getImage(),'PNG',new File('C:\Users\Chait\Desktop\Screenshots\entirepage.png')); //The screenshot to be captured will be in .png image format and would be saved at above mentioned path. System.out.println('Screenshot for full page is captured successfully!'); } }

Aqui o variáveis ​​definidas pelo usuário jmeter página do nosso site: www.softwaretestinghelp.com é aberto e então tiramos uma captura de tela desta página da web completa (com a ajuda de ashot () em selênio) em formato .png e salva no caminho desejado. Da mesma forma, podemos capturar uma imagem de toda a página de qualquer página da web.

Assim, ao implementar o código acima para capturar a imagem da página inteira, a saída recebida é conforme mostrado na imagem abaixo para uma imagem completa da página da web.

Whole_Page

# 3) Um elemento da web

Vejamos o código de implementação abaixo, com o uso de Ashot no Selenium webdriver para capturar a captura de tela de um elemento específico da web na página da web.

package SeleniumPrograms; import java.io.File; import java.io.IOException; import java.util.concurrent.TimeUnit; import javax.imageio.ImageIO; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.firefox.FirefoxDriver; import org.testng.annotations.Test; import ru.yandex.qatools.ashot.AShot; import ru.yandex.qatools.ashot.Screenshot; import ru.yandex.qatools.ashot.shooting.ShootingStrategies; @Test public class Screenshot_WebEle_Ashot { public static void main(String() args) throws IOException { // TODO Auto-generated method stub WebDriver drv = new FirefoxDriver(); drv.manage().window().maximize(); //always write wait code after this drv.manage().timeouts().pageLoadTimeout(10, TimeUnit.SECONDS); //for page load drv.get('https://opensource-demo.orangehrmlive.com/'); //Testing webpage drv.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS); //for Implicit wait WebElement uname = drv.findElement(By.id('txtUsername')); //Username....ID.... uname.sendKeys('Admin'); WebElement pword = drv.findElement(By.id('txtPassword')); //Password....ID.... pword.sendKeys('admin123'); WebElement login_b = drv.findElement(By.xpath('//input(@id='btnLogin')')); login_b.click(); //Login button....XPATH.... WebElement ele = drv.findElement(By.linkText('Maintenance')); ele.click(); //opening link for element for which we want screenshot // pass driver as well as the element in takeScreenshot() method. Screenshot Screenshot_webele = new AShot().shootingStrategy(ShootingStrategies.viewportPasting(100)).takeScreenshot(drv, ele); // For saving the screenshot in .png/.jpeg format at the desired location ImageIO.write(Screenshot_webele.getImage(),'png',new File('C:\Users\Chait\Desktop\Screenshots\element.jpeg')); System.out.println('Screenshot for specified element captured successfully!'); } }

Assim, ao implementar o código acima para capturar uma imagem de um elemento específico (aqui, guia Manutenção), a saída recebida é conforme mostrado na imagem abaixo.

Maintenance_WebElement 1

Aqui, escolhemos a guia “Manutenção” como um elemento para o qual é necessária uma captura de tela. Mencione o caminho onde queremos que a captura de tela seja salva. Da mesma forma, podemos capturar uma imagem de qualquer outro elemento em qualquer site.

# 4) Comparando a captura de tela com a imagem original

Vamos dar uma olhada no código de implementação abaixo com o uso do Ashot no webdriver Selenium para capturar uma imagem de um elemento do logotipo na página da web e compará-lo com o logotipo original.

Para isso, vamos considerar o exemplo de naukri.com :

package SeleniumPrograms; import java.awt.image.BufferedImage; import java.io.File; import java.io.IOException; import java.util.concurrent.TimeUnit; import javax.imageio.ImageIO; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.chrome.ChromeDriver; import org.openqa.selenium.firefox.FirefoxDriver; import ru.yandex.qatools.ashot.AShot; import ru.yandex.qatools.ashot.Screenshot; import ru.yandex.qatools.ashot.comparison.ImageDiff; import ru.yandex.qatools.ashot.comparison.ImageDiffer; public class Screen_Compare { public static void main(String() args) throws IOException { // TODO Auto-generated method stub WebDriver drv = new FirefoxDriver(); drv.manage().window().maximize(); //always write wait code after this drv.manage().timeouts().pageLoadTimeout(10, TimeUnit.SECONDS); //for page load drv.get('https://www.naukri.com/nlogin/login'); //Testing webpage drv.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS); //for Implicit wait // Finding the logo element and capturing its screenshot WebElement logo = drv.findElement(By.xpath('//a(@class='nLogo fl')/img')); Screenshot logoSrcshot = new AShot().takeScreenshot(drv, logo); // Reading the image for comparision BufferedImage expectedImage = ImageIO.read(new File('C:\Users\Chait\Desktop\naukri_Logo.png')); BufferedImage actualImage = logoSrcshot.getImage(); ImageDiffer img_differnece = new ImageDiffer(); // Creating ImageDiffer object and calling the method makeDiff() ImageDiff differnece = img_differnece.makeDiff(actualImage, expectedImage); if (differnece.hasDiff() == true) //Checking the difference using in-built functions) { System.out.println('Both logo images matched') //in case when no difference found } else { System.out.println('The logo images are different'); //in case when difference found } } }

Assim, ao implementar o código acima para comparação da captura de tela de um elemento de logotipo (aqui, logotipo naukri.com), a saída recebida é conforme mostrado na imagem abaixo.

logotipo da naukri

Aqui, escolhemos o logotipo de “naukri.com”, capturamos sua imagem e, em seguida, é comparado com o logotipo original. A diferença entre as imagens é encontrada usando funções embutidas. Se nenhuma diferença for encontrada nas 2 imagens do logotipo, o programa imprime a saída como “ Ambas as imagens do logotipo correspondem ”Mais imprime“ As imagens do logotipo são diferentes ”.

Exemplos de onde as capturas de tela costumam ser capturadas

# 1) Confirmação de logout

Para fazer o login em um site, precisamos inserir o nome de usuário e a senha corretos e, em seguida, entraremos no site. Em seguida, o usuário executa as opções necessárias e, uma vez feito o trabalho, o usuário é desconectado.

Portanto, se fornecermos um código para captura de tela após ser desconectado, novamente a página de login será vista, o que confirmará a ação de logout. Por favor, veja a imagem abaixo para mais detalhes:

confirmação de logout

data de lançamento do fone de ouvido de realidade virtual xbox one

# 2) Confirmação de um registro recém-criado

Adicionar código para captura de tela depois de criar um novo registro confirma que o registro foi criado com sucesso. Por favor, veja a imagem abaixo para mais detalhes.

Confirmação de um registro recém-criado

Caso o registro não seja criado, o código não prossegue para capturar a tela e isso confirma que o registro não está sendo criado com sucesso.

# 3) Exemplo de saída ausente / incorreta

Este exemplo inclui a criação de um novo registro para Cargo no site OrangeHRM. Aqui, o campo Cargo está marcado com ‘*’, o que significa que é um campo obrigatório. Assim, o registro não seria criado até que os campos obrigatórios fossem preenchidos e somente então poderíamos salvar o registro. Por favor, veja a imagem abaixo para mais detalhes.

Exemplo de saída ausente / incorreta

Conclusão

Assim, neste artigo vimos onde as capturas de tela do Selenium são necessárias, como podemos lidar com as capturas de tela no Selenium, o que é Ashot, como ele pode ser baixado, configurado e realmente usado no Selenium. Compreendemos a implementação do código para lidar com a captura de tela e também vimos alguns exemplos em que as capturas de tela costumam ser capturadas.

=> Leia o guia completo do Selenium

Leitura recomendada

^