Рубрики
Без рубрики

Как Делать Скриншоты В Selenium? Руководство С Примерами

Захват скриншотов имеет решающее значение для понимания того, работает ли ваше веб-приложение плавно или нет … С тегом selenium, java, тестирование, скриншот.

Захват скриншотов имеет решающее значение для понимания того, работает ли ваше веб-приложение плавно или нет. Если нет, то где он терпит неудачу? Традиционно тестировщики привыкли снимать скриншоты вручную для каждого выполняемого ими теста, что было крайне утомительно и отнимало много времени. Однако внедрение Selenium позволило тестировщикам автоматизировать тестирование браузера, и тестировщики полагались на скриншоты Selenium для автоматического захвата своего веб-приложения в нескольких браузерах или средах без дополнительных хлопот.

В этой статье мы собираемся глубоко погрузиться в скриншоты Selenium. Мы узнаем, как делать скриншоты в Selenium разными способами. Но прежде чем мы это сделаем, давайте напомним о важности создания скриншотов в Selenium.

Почему Так Важно Делать Скриншоты При Тестировании Selenium?

Весь смысл внедрения автоматизации тестирования Selenium заключается в том, чтобы выполнять тесты без помех и получать результаты мгновенно. Не было бы неплохо иметь под рукой изображение на случай, если вы обнаружите ошибку? Вы никогда не знаете, когда тест может завершиться неудачей, и все ваши усилия будут напрасны, если у вас нет доказательств ошибки. Как говорится – “Картинка стоит тысячи слов. ” Вот почему захват скриншота Selenium будет рассматриваться как важный шаг в тестировании, поскольку он помогает

  1. Понимать сквозной поток веб-приложения.
  2. Проанализируйте ошибку.
  3. Отслеживание выполнения теста.
  4. Проанализируйте поведение теста в разных браузерах/средах.
  5. Отследите и изучите причину сбоя теста.

Когда Делать Скриншоты При Тестировании Selenium?

Скриншоты Selenium могут помочь вам проанализировать что угодно – от ошибки до веб-элемента. Ниже перечислены возможные сценарии, в которых вы могли бы рассмотреть возможность создания скриншота Selenium.

  1. Сделайте снимок экрана для каждого тестового примера.
  2. Захват скриншотов только в случае сбоя.
  3. Захват скриншотов за определенный промежуток времени.
  4. Захват скриншотов в разных браузерах.
  5. Захват скриншотов определенных элементов веб-страницы.
  6. Захват скриншотов в определенных контрольных точках.

Теперь я покажу вам, как сделать снимок экрана в Selenium разными способами.

Как Сделать Снимок Экрана С Помощью Selenium Webdriver?

Основными концепциями, на которых основывается захват скриншотов Selenium, являются типизация и обработка файлов. Снимок экрана в Selenium захватывается и сохраняется в указанном месте назначения, указанном в сценарии тестирования Selenium.

При автоматизации веб-приложения мы можем использовать интерфейс TakesScreenshot который сигнализирует WebDriver сделать снимок экрана во время выполнения теста. Интерфейс TakesScreenshot расширен интерфейсом WebElement (интерфейс расширяет другой интерфейс), а классы драйверов браузера, такие как FirefoxDriver, ChromeDriver, OperaDriver и т.д., реализуют один и тот же интерфейс (класс реализует интерфейс).

Класс RemoteWebDriver() реализует такие интерфейсы, как WebDriver(), TakesScreenshot() и т.д., И для доступа к этим методам мы должны отключить объект driver.

WebDriver driver = new ChromeDriver();
TakesScreenshot ts = (TakesScreenshot)driver;

Метод GetscReenshotas() в интерфейсе TakesScreenshot помогает делать снимки экрана и сохранять их по указанному пути. У нас есть другой тип вывода интерфейса, который используется для указания формата вывода скриншота, такого как ФАЙЛ, БАЙТЫ и т.д.

File file = ts.getScreenshotAs(OutputType.FILE);
FileUtils.copyFile(file,new File ("./ScreenShot_Folder/Test1_Login.png"));

В приведенном выше пути назначения “./” указывает текущий каталог, и мы можем указать вложенную папку для хранения сделанных скриншотов и имя, в котором должны быть сохранены скриншоты. Согласно приведенной выше строке, сделанный снимок экрана будет сохранен во вложенной папке ScreenShot_Folder внутри текущего рабочего каталога с именем Test1_Login.png файл. Если данная подпапка не существует, то при первом выполнении скрипта папка создается автоматически.

1. Простая Программа Чтобы Захватить Скриншот В Selenium WebDriver

Сценарий: Перейдите на веб-страницу, введите действительные учетные данные и сделайте снимок экрана страницы, прежде чем нажать кнопку входа. После входа в систему проверьте, существует ли запись о сотруднике в списке сотрудников, и сделайте снимок экрана.

package com.LoginTest;

import java.io.File;
import java.io.IOException;
import java.util.concurrent.TimeUnit;
import org.apache.commons.io.FileUtils;
import org.openqa.selenium.By;
import org.openqa.selenium.OutputType;
import org.openqa.selenium.TakesScreenshot;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.Select;
import org.testng.annotations.AfterClass;
import org.testng.annotations.BeforeClass;
import org.testng.annotations.Test;

public class LoginPage {

        public WebDriver driver;


        @BeforeClass
        public void setUp() {
            System.setProperty("webdriver.chrome.driver", "C:\\Users\\shalini\\Downloads\\chromedriver\\chromedriver.exe");
            driver = new ChromeDriver();  
        }


        @Test
        public void loginTest() {

        //define the url
        driver.get("https://opensource-demo.orangehrmlive.com/");   

                             //maximize the window
        driver.manage().window().maximize();

                             //delete the cookies saved
        driver.manage().deleteAllCookies();


        driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);


        //get the title of the webpage
        String pageTitle = driver.getTitle();                            
        System.out.println("The title of this page is ===> " +pageTitle);

        //enter the locator of username and clear the input field before entering any value
        driver.findElement(By.id("txtUsername")).clear();   

                              //enter the username          
        driver.findElement(By.id("txtUsername")).sendKeys("Admin");     

        //enter the locator of password and clear the input field
        driver.findElement(By.id("txtPassword")).clear();

        //enter the value of password
        driver.findElement(By.id("txtPassword")).sendKeys("admin123");      

                             //downcast the driver to access TakesScreenshot method
        TakesScreenshot ts = (TakesScreenshot)driver;

                             //capture screenshot as output type FILE
        File file = ts.getScreenshotAs(OutputType.FILE);

        try {
                             //save the screenshot taken in destination path
            FileUtils.copyFile(file, new File("./ScreenShot_Folder/Test1_Login.png"));
        } catch (IOException e) {
            e.printStackTrace();
        }
        System.out.println("the login page screenshot is taken");


        //enter the locator of login button and click
        driver.findElement(By.id("btnLogin")).click();



         //wait for the page to load
        driver.manage().timeouts().pageLoadTimeout(20, TimeUnit.SECONDS);

        //search an employee by providing the name,role and status
        driver.findElement(By.linkText("Admin")).click();

        driver.findElement(By.xpath("//input[@id = 'searchSystemUser_userName']")).clear();
         driver.findElement(By.xpath("//input[@id = 'searchSystemUser_userName']")).sendKeys("Chris Evans");

        Select selectRole = new Select(driver.findElement(By.id("searchSystemUser_userType")));
        selectRole.selectByVisibleText("Admin");
        driver.findElement(By.id("searchSystemUser_employeeName_empName")).clear();
        driver.findElement(By.id("searchSystemUser_employeeName_empName")).sendKeys("Test 1");

        Select selectStatus = new Select (driver.findElement(By.id("searchSystemUser_status")));
        selectStatus.selectByVisibleText("Enabled");
        driver.findElement(By.id("searchBtn")).click();
        driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);

       TakesScreenshot ts1 = (TakesScreenshot)driver;
       File file1 = ts.getScreenshotAs(OutputType.FILE);

       try {
             FileUtils.copyFile(file1, new File("./ScreenShot_Folder/Test2_SearchUser.png"));
    } catch (IOException e) {
    e.printStackTrace();
}
    System.out.println("the userStatus screenshot is taken");

}

    @AfterClass
    public void tearDown() {
    driver.quit();
        }       
}

После входа в систему проверьте, существует ли запись о сотруднике в списке сотрудников, и сделайте снимок экрана.

Как только тест будет выполнен, обновите проект. Будет создана новая подпапка, как указано в скрипте, и вы увидите снимок экрана Selenium, сохраненный в пути.

Ниже приведены снятые скриншоты.

На первом скриншоте Selenium показана страница входа на веб-сайт.

На втором скриншоте Selenium показан результат поиска сотрудника.

2. Как Сделать Снимок Экрана В Selenium Только Во Время Сбоя?

В нашем пакете автоматизации тестирования Selenium у нас может быть множество тестовых примеров, которые необходимо выполнить. Иногда захват скриншотов для каждого тестового примера не требуется. В таких случаях мы можем делать скриншоты только тогда, когда при выполнении происходит сбой. Для достижения этой цели мы могли бы использовать интерфейс ITestListener из Тестирование . Если вы новичок в тестировании, вы можете обратиться к нашему руководству по прослушиванию TestNG.

Сценарий: Перейдите на веб-страницу, введите учетные данные и нажмите кнопку входа.

Мы разделили приведенный выше сценарий на два случая – Тестовый пример 1: Перейдите на веб-страницу Тестовый пример 2: Введите имя пользователя и пароль и нажмите Войти.

В случае сбоя в любом тестовом примере снимок экрана будет захвачен и сохранен в пути назначения.

Чтобы достичь этого, сначала мы должны создать класс Listener. Этот класс реализует интерфейс ITestListener. Затем нажмите ” Добавить нереализованные методы “.

Один раз после добавления всех методов ваш код будет выглядеть так, как показано ниже.

package com.LoginTest;

import org.testng.ITestContext;
import org.testng.ITestListener;
import org.testng.ITestResult;

public class ListenerClass implements ITestListener{

    @Override
    public void onTestStart(ITestResult result) {
        // TODO Auto-generated method stub

    }

    @Override
    public void onTestSuccess(ITestResult result) {
        // TODO Auto-generated method stub

    }

    @Override
    public void onTestFailure(ITestResult result) {
        // TODO Auto-generated method stub

    }

    @Override
    public void onTestSkipped(ITestResult result) {
        // TODO Auto-generated method stub

    }

    @Override
    public void onTestFailedButWithinSuccessPercentage(ITestResult result) {
        // TODO Auto-generated method stub

    }

    @Override
    public void onStart(ITestContext context) {
        // TODO Auto-generated method stub

    }

    @Override
    public void onFinish(ITestContext context) {
        // TODO Auto-generated method stub

    }

}

Теперь мы можем настроить точку, в которой должен быть сделан снимок экрана Selenium. В нашем случае мы должны сделать снимок экрана в Selenium только тогда, когда происходит сбой.

Мы можем изменить метод onTestFailure() , чтобы сделать снимок экрана.

@Override
    public void onTestFailure(ITestResult result) {
        // TODO Auto-generated method stub
        TakesScreenshot ts = (TakesScreenshot)FacebookLogin.driver;
        File file = ts.getScreenshotAs(OutputType.FILE);

        try {
            FileUtils.copyFile(file, new File("./ScreenShot_Folder/TestFailure.png"));
        } catch (IOException e) {
            e.printStackTrace();
        }
        System.out.println("screenshot is taken");

    }

Фрагмент кода для двух тестов

Тестовый пример 1: Перейдите на страницу входа в Facebook, введите название страницы и проверьте, совпадает ли название страницы с исходным ” Facebook – войдите в систему или зарегистрируйтесь “

Тестовый пример 2: Введите учетные данные и нажмите кнопку входа, получите заголовок страницы и проверьте, соответствует ли заголовок страницы исходному названию “Facebook”. Только после успешного входа в систему мы сможем получить этот титул.

Чтобы сделать скриншоты в неудачных случаях, я намеренно провалил тестовый пример входа в систему, предоставив неверные учетные данные, которые, кстати, не будут перенаправлены на фактическую страницу, что приведет к сбою из-за несоответствия заголовка страницы.

package com.fbLoginPage;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.Assert;
import org.testng.annotations.AfterClass;
import org.testng.annotations.BeforeClass;
import org.testng.annotations.Listeners;
import org.testng.annotations.Test;

@Listeners (ListenerClass.class)
public class FacebookLogin {

        public static WebDriver driver;


        @BeforeClass
        public void setUp() {
            System.setProperty("webdriver.chrome.driver", "C:\\Users\\shalini\\Downloads\\chromedriver\\chromedriver.exe");
            driver = new ChromeDriver();  
        }


        @Test
        public void browsePageTest() {

        //define the url
        driver.get("https://www.facebook.com/");    

        driver.manage().window().maximize();
        driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);


        //get the title of the webpage
        String pageTitle = driver.getTitle();                            
        System.out.println("The title of this page is ===> " +pageTitle);
        Assert.assertEquals(pageTitle, "Facebook – log in or sign up");   

        }

        @Test
        public void loginTest() {
        //clear the input field before entering any value
        driver.findElement(By.xpath("//input[@id='email']")).clear();               
        driver.findElement(By.xpath("//input[@id='email']")).sendKeys("abc12@gmail.com");           

        //enter the locator of username
        driver.findElement(By.xpath("//input[@id='pass']")).clear();
        driver.findElement(By.xpath("//input[@id='pass']")).sendKeys("1234567890");


        driver.findElement(By.id("loginbutton")).click();

        String loginPageTitle = driver.getTitle();
        Assert.assertEquals(loginPageTitle, "Facebook");

    }

        @AfterClass
        public void tearDown() {
        driver.quit();
        }       
}

Чтобы сделать скриншоты в неудачных случаях, я намеренно провалил тестовый пример входа в систему, предоставив неверные учетные данные, которые, кстати, не будут перенаправлены на фактическую страницу, что приведет к сбою из-за несоответствия заголовка страницы.


!DOCTYPE suite SYSTEM "http://testng.org/testng-1.0.dtd">

Консольный вывод:

Как только тесты будут выполнены, обновите проект. Снимок экрана Selenium с неудачным тестом будет сохранен.

3. Как Сделать Снимок Экрана В Selenium Для Определенного Веб-Элемента?

Selenium предоставляет возможность делать скриншоты не только веб-страниц, но и веб-элементов, с которыми они взаимодействуют. Импортируйте класс javax.imageio. ImageIO предоставляет плагины ImageReader и ImageWriter, которые используются для обрезки изображения указанного веб-элемента на веб-странице с помощью параметров высоты, ширины и координат.

Сценарий: Перейдите на страницу Facebook, введите учетные данные и нажмите кнопку входа в систему. Сделайте снимок экрана с логотипом Facebook и кнопкой входа в систему.

package com.LoginPage.LogoTest;

import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import java.util.Random;
import java.util.concurrent.TimeUnit;

import javax.imageio.ImageIO;

import org.apache.commons.io.FileUtils;
import org.openqa.selenium.By;
import org.openqa.selenium.OutputType;
import org.openqa.selenium.Point;
import org.openqa.selenium.TakesScreenshot;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.Assert;
import org.testng.annotations.AfterClass;
import org.testng.annotations.BeforeClass;
import org.testng.annotations.Test;

public class ElementCaptureTest {

    public static WebDriver driver;


    @BeforeClass
    public void setUp() {
        System.setProperty("webdriver.chrome.driver", "C:\\Users\\shalini\\Downloads\\chromedriver\\chromedriver.exe");
        driver = new ChromeDriver();  
    }


    @Test
    public void browsePageTest() throws IOException {

              //navigate to the webPage
    driver.get("https://www.facebook.com/");    

    driver.manage().window().maximize();
    driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);

    String pageTitle = driver.getTitle();                            
    System.out.println("The title of this page is ===> " +pageTitle);
    Assert.assertEquals(pageTitle, "Facebook – log in or sign up");

              //identify the locator of the WebElement – FaceBook Logo
    WebElement fbLogo =  driver.findElement(By.xpath("//*[@id=\"blueBarDOMInspector\"]/div/div/div/div[1]"));
    takeScreenshotOfElement(fbLogo);



              //identify the locator of the WebElement – Login Button

    WebElement loginButton = driver.findElement(By.id("loginbutton"));
    takeScreenshotOfElement(loginButton);


    }

    @AfterClass
    public void tearDown() {
        driver.quit();

    }

    public static void takeScreenshotOfElement(WebElement element) throws IOException {
        //capture the screenshot of full page 
        TakesScreenshot ts = (TakesScreenshot)driver;
        File file = ts.getScreenshotAs(OutputType.FILE);

                              // read the screenshot image
        BufferedImage fullScreen = ImageIO.read(file);

                   //get the width and height of the element
                   int width = element.getSize().getWidth();
        int height = element.getSize().getHeight();

                   //get the X and Y coordinates of the webElement      
        Point location = element.getLocation();           

//get the image using height,width and coordinates
        BufferedImage logoImage = fullScreen.getSubimage(location.getX(), location.getY(),width, height);
        ImageIO.write(logoImage, "png", file);  

//save the captured screenshot
        Random random = new Random();
        FileUtils.copyFile(file,new File("./ScreenShot_Folder/screenshot_Test"+random.nextInt()+".png"));


    }

}

Логотип Facebook

Авторизоваться

Различные Способы Сохранения Захваченных Скриншотов

Чтобы улучшить удобочитаемость, мы можем сохранить захваченный снимок экрана в Selenium, присвоив каждому из них динамическое имя. Двумя наиболее предпочтительными способами являются-

  1. Сохранение захваченных скриншотов на основе временной метки.
  2. Сохранение захваченных скриншотов на основе случайного идентификатора.

Делайте Скриншоты И Сохраняйте Их На Основе Временной Метки

Обычно, когда вы называете снимок экрана Selenium в коде, каждый раз, когда выполняется тест, снимок экрана будет заменен. Поэтому, чтобы преодолеть это, мы можем использовать логику временной метки для сохранения скриншота в виде нескольких файлов, имена которых основаны на временной метке при каждом выполнении теста.

Я добавил отдельный метод для захвата скриншотов и присвоения им имен в зависимости от текущего времени выполнения текста. Можно было бы использовать различные временные форматы.

package com.Loginpage;

import java.io.File;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.Date;
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.chrome.ChromeDriver;
import org.testng.Assert;
import org.testng.annotations.AfterClass;
import org.testng.annotations.BeforeClass;
import org.testng.annotations.Test;

public class SaveScreenshotWithTime {

    public static WebDriver driver;


    @BeforeClass
    public void setUp() {
        System.setProperty("webdriver.chrome.driver", "C:\\Users\\shalini\\Downloads\\chromedriver\\chromedriver.exe");
        driver = new ChromeDriver();  
    }


    @Test
    public void browsePageTest() {

    driver.get("https://www.facebook.com/");    

    driver.manage().window().maximize();
    driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);

    String pageTitle = driver.getTitle();                            
    System.out.println("The title of this page is ===> " +pageTitle);
    Assert.assertEquals(pageTitle, "Facebook – log in or sign up");
    try {
        screenShot(driver);
    } catch (IOException e) {
        // TODO Auto-generated catch block
        e.printStackTrace();
    } catch (InterruptedException e) {
        // TODO Auto-generated catch block
        e.printStackTrace();
    }

    }

    @AfterClass
    public void tearDown() {
        driver.quit();

    }


    public static void screenShot (WebDriver driver) throws IOException, InterruptedException {
        TakesScreenshot ts = (TakesScreenshot)driver;
        File source=ts.getScreenshotAs(OutputType.FILE);
        File destination= new File("./ScreenShot_Folder/screenshot_"+timestamp()+".jpeg");
        FileUtils.copyFile(source, destination);

    }

    public static String timestamp() {
        return new SimpleDateFormat("yyyy-MM-dd HH-mm-ss").format(new Date());
    }

}

После выполнения тестов снятые скриншоты сохраняются по нужному пути на основе метки времени.

Делайте Скриншоты И Сохраняйте Их На Основе Случайного Идентификатора

Мы можем использовать класс random в Java для генерации случайных чисел и сохранения снятых скриншотов с этим номером.

Мы должны заменить логику временных меток, использованную в предыдущем коде, на приведенную ниже

Random random = new Random();
FileUtils.copyFile(file,new File("./ScreenShot_Folder/screenshot_Test"+random.nextInt()+".png"));

Скриншоты, снятые и сохраненные с помощью логики генерации случайных чисел.

Отлично! Вы успешно сделали скриншоты Selenium различными способами и научились сохранять эти скриншоты. Но что, если я скажу вам, что есть простой способ сделать скриншоты Selenium?

Самый Простой Способ Сделать Снимок Экрана Selenium

Самый простой способ сделать скриншоты в Selenium – это использовать Lambda Test cloud Selenium Grid из более чем 2000 реальных браузеров для настольных компьютеров и мобильных устройств.

В Lambda Test мы хотим сделать тестирование Selenium максимально удобным. Именно поэтому мы предоставляем кнопку переключения в нашем генераторе желаемых возможностей Selenium.

Эта кнопка при включении добавит возможность с именем ‘ visual ‘ в желаемый класс возможностей и установит ее значение как true .

Если вы передадите эту возможность в свой класс DesiredCapabilities во время запуска вашего скрипта тестирования Selenium в LambdaTest Selenium Grid, мы создадим пошаговые скриншоты для вашего скрипта автоматизации Selenium.

Вы можете найти эти пошаговые скриншоты на панели автоматизации, перейдя в Журналы автоматизации –> Метаданные.

На вкладке Метаданные вы найдете кнопку Загрузить все скриншоты.

Перенести ваши сценарии тестирования Selenium на лямбда-тест несложно. Все, что вам нужно сделать, это указать свое имя пользователя для лямбда-теста и ключ доступа в качестве переменных среды для маршрутизации ваших тестов Selenium на удаленном WebDriver. Обратитесь к нашей документации по тестированию с помощью Selenium.

Мы также предлагаем RESTful API для захвата скриншотов Selenium для автоматического тестирования браузера.

Делайте Автоматические Скриншоты Без Скриптов Selenium

Мы также предлагаем функцию, называемую тестированием скриншотов, которая позволяет вам делать скриншоты всей страницы вашего веб-сайта в 25 различных браузерах и операционных системах. Тесты могут выполняться как в настольных, так и в мобильных браузерах.

Вы можете создавать скриншоты полной страницы без написания какого-либо скрипта Selenium всего за два шага.

Шаг 1: После входа в систему нажмите Визуальное тестирование пользовательского интерфейса 🡪 Скриншот. Шаг 2: Введите URL-адрес веб-сайта, который вы хотите протестировать, выберите браузеры и нажмите кнопку захвата.

Это автоматически сгенерирует скриншоты вашего веб-приложения в выбранных вами браузерах и операционных системах.

Делайте Скриншоты После Входа В Систему

Шаг 1: Чтобы сделать снимок экрана за функцией входа в систему, нажмите кнопку Входа и создайте Новый логин профиль.

Шаг 2: Введите URL-адрес веб-страницы и нажмите кнопку Далее.

Шаг 3: Введите локаторы полей имени пользователя, пароля и кнопки входа в систему. Нажмите кнопку Далее.

Вы можете выбрать любой из локаторов, как показано ниже-

Шаг 4: Введите действительное имя пользователя и пароль и нажмите кнопку Далее.

Шаг 5: Сохраните профиль входа в систему.

Шаг 6: После сохранения будет создан профиль.

Чтобы сделать снимок экрана для той же веб-страницы с теми же учетными данными, вы можете просто переключить профиль пользователя.

Шаг 7: Выберите браузеры и платформу для выполнения теста и нажмите “Захватить”. Как только тест будет выполнен в разных браузерах и платформах, скриншоты Selenium будут сняты и отображены.

Скриншоты также можно загрузить и проверить.

Используйте Автоматизированный API Скриншотов Для Легкого Кроссбраузерное Тестирование

Выполнение тестовых примеров в нескольких браузерах, средах и устройствах требует большой работы. Поиск совместимой версии браузера и допустимой версии устройств требует значительных усилий. Несмотря на то, что захват скриншотов может показаться простым делом, организация захваченных скриншотов для отслеживания в будущем остается сложной задачей.

Лямбда-тест обеспечивает простой подход к захвату скриншотов с помощью Automated Screenshot API и их сохранению на устройстве/платформе, за которым следует версия браузера. Таким образом, он обеспечивает лучшую читаемость и отслеживание. Платформа, на которой должен быть сделан снимок экрана во время выполнения теста, должна быть предоставлена в виде объекта json в теле запроса, а несколько версий браузера могут быть записаны в массив, что представляется простым подходом к подаче входных данных.

Позвольте мне показать вам пример захвата скриншотов в нескольких средах с помощью Lambda Test Automated screenshot API.

Шаг 1: Перейдите к https://www.lambdatest.com/support/docs/api-doc/#screenshots и выберите вкладку API автоматизированных скриншотов. Нажмите кнопку Авторизовать .

Шаг 2: Введите свое имя пользователя и ключ доступа, которые были предоставлены после того, как вы вошли в Lambda Test. Нажмите кнопку Авторизовать.

Шаг 3: Нажмите Начать тест скриншота и нажмите Попробуйте это .

Шаг 4: Чтобы запросить этот API для захвата скриншота, мы должны создать тело запроса.

HTTP-метод для захвата скриншота в этом API – POST.

Тело запроса API скриншота имеет контекстный тип JSON и содержит различные теги, которые передают информацию об URL-адресе веб-страницы, веб-странице, которая должна быть автоматизирована, нескольких браузерах, платформах и устройствах, на которых должен выполняться тест, разрешении и макете скриншота и предпочтении отправки захваченного скриншоты по почте.

Образец тела запроса приведен ниже.

{
  "url": "https://www.facebook.com",
  "defer_time": 5,
  "email": true,
  "mac_res": "1024x768",
  "win_res": "1366X768",
  "smart_scroll": true,
  "layout": "portrait",
  "configs": {
    "windows 10": {
      "chrome": [
        "76",
        "75"
      ],
      "firefox": [
        "67",
        "66"
      ],
      "opera": [
        "58",
        "57"
      ],
      "ie": [
        "11"
      ]
    },
    "macos mojave": {
      "chrome": [
        "76",
        "75"
      ],
      "firefox": [
        "67",
        "66"
      ],
      "opera": [
        "58",
        "57"
      ],
      "safari": [
        "12"
      ]
    },
    "ios 12.0": {
      "devices": [
        "iphone xr",
        "iphone xs",
        "iphone xs max"
      ]
    },
    "android 9.0": {
      "devices": [
        "galaxy s9 plus"
      ]
    }
  }
}

Шаг 5: Как только тело запроса будет создано, нажмите Выполнить .

Шаг 6: При успешном выполнении мы могли видеть код состояния HTTP как 200, а test_id был сгенерирован в качестве ответа.

Шаг 7: Перейдите на главную страницу приложения Lambda Test и перейдите на вкладку Журналы тестирования . Мы можем видеть журналы всех тестов, которые были выполнены на этой платформе. Чтобы отследить тест скриншота здесь, используйте test_id, который был сгенерирован в качестве успешного ответа.

При прокрутке вниз можно увидеть скриншоты, сделанные в разных браузерах, платформах и устройствах, как указано в теле запроса.

Все скриншоты также можно загрузить в ZIP-файле, а затем подробно проанализировать. Скриншоты будут называться браузером и его версией, платформой и устройством, на котором был выполнен тест. Это облегчит отслеживание различных тестовых примеров.

В случае любой неверной информации в теле запроса, такой как неправильная версия браузера или неверное имя, будет выдан ответ об ошибке с кодом состояния 400 и соответствующим сообщением об ошибке.

Например, если в полезной нагрузке запроса указана недопустимая версия Google Chrome, будет выдан ответ с ошибкой.

Тело запроса

{
  "url": "https://www.facebook.com",
  "defer_time": 5,
  "email": true,
  "mac_res": "1024x768",
  "win_res": "1366X768",
  "smart_scroll": true,
  "layout": "portrait",
  "configs": {
    "windows 10": {
      "chrome": [
        "101"
      ]
    }
  }
}

Ответ

Помимо основного скриншота веб-страницы, вы также можете попробовать сделать снимок экрана для входа в систему, используя опцию “Проверка скриншота с базовой аутентификацией”, где вам необходимо указать имя пользователя и пароль в теле запроса вместе с другими деталями, которые вы видели ранее.

Заключительные мысли

Подводя итог, я рассказал вам о различных способах захвата скриншота в Selenium, используя интерфейс TakesScreenshot, ITestListener, ImageIO, визуальное тестирование пользовательского интерфейса и автоматизированный API скриншотов в LambdaTest, а также различные логики для сохранения захваченных скриншотов. Мы видели важность захвата скриншотов Selenium в веб-приложении.

Понимание сквозного потока рабочего продукта важно для любого тестировщика, поскольку он должен знать всю функциональность, прежде чем начинать процесс автоматизации тестирования Selenium. Захват скриншота Selenium на каждом этапе выполнения теста обеспечивает четкость рабочего процесса, а также облегчает отслеживание каждого тестового примера.

Я надеюсь, что вы получили знания по созданию скриншота в selenium. Сделайте шаг вперед, попробуйте это на практике и дайте мне знать ваше мнение в разделе комментариев ниже. Не стесняйтесь делиться этим со своими коллегами и друзьями, так как это может помочь в преодолении проблем в их сценарии автоматизации тестирования Selenium. Изучите возможности автоматизации, а до тех пор Счастливого тестирования …!!!

Оригинал: “https://dev.to/shalinibaskaran12/how-to-capture-screenshots-in-selenium-guide-with-examples-41jh”

Читайте ещё по теме: