• Selenium Video Tutorials

Selenium - 捕獲影片

上一頁
下一頁

Selenium Webdriver 可以藉助另一個第三方 API 來捕獲影片。捕獲影片有助於除錯失敗的測試指令碼。此外，還可以將測試執行的捕獲影片與日誌一起共享給開發人員，以便更快地解決問題。

捕獲的測試用例影片可以作為證據新增到任何測試管理工具（如 JIRA、ALM 等）中。可以與其他專案利益相關者共享，以提高理解和可見性。

Monte 螢幕錄製 API

Selenium Webdriver 本身無法捕獲影片。它必須與另一個名為 Monte Screen Recorder 的 API 整合。為了使用 Monte Screen Recorder 來錄製影片，我們需要新增與其相關的 Maven 依賴項。

使用 Monte 螢幕錄製 API 捕獲影片的步驟

步驟 1 - 導航到以下連結 -

https://mvnrepository.com/artifact/

Selenium Capture Videos 1

步驟 2 - 單擊版本下方的 <version 連結>。在上圖中，版本號為 0.7.7.0。

Selenium Capture Videos 2

將 Maven 選項卡下可用的依賴項新增到我們將建立的 Maven 專案的 pom.xml 中。新增此依賴項後，我們將更新並重新整理我們的 maven 專案。在上面的示例中，以下依賴項如下所示 -

<!-- https://mvnrepository.com/artifact/com.github.stephenc.monte/monte-screen-recorder -->
<dependency>
   <groupId>com.github.stephenc.monte</groupId>
   <artifactId>monte-screen-recorder</artifactId>
   <version>0.7.7.0</version>
</dependency>

步驟 3 - 我們將藉助從原始碼獲取的實用程式程式碼：https://www.randelshofer.ch/monte/ 將 Monte 螢幕錄製 API 與我們的測試整合。

示例：捕獲影片（錄製測試）

讓我們以以下頁面為例，我們將從啟動應用程式、單擊“主要級別 1”標籤旁邊的複選框並退出瀏覽器開始錄製整個測試。之後，我們將停止錄製。測試完成後，整個錄製內容將儲存在測試專案下新建立的test-recordings資料夾中。在此資料夾下，將有一個名為 - main-<當前日期和時間> 的 .avi 檔案，其中包含測試的整個錄製內容。

Selenium Capture Videos 3

ScreenRecorderUtil.java 實用程式類的程式碼實現。

package org.example;

import java.awt.AWTException;
import java.awt.Dimension;
import java.awt.GraphicsConfiguration;
import java.awt.GraphicsEnvironment;
import java.awt.Rectangle;
import java.awt.Toolkit;
import java.io.File;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.Date;
import org.monte.media.Format;
import org.monte.media.FormatKeys.MediaType;
import org.monte.media.Registry;
import org.monte.media.math.Rational;
import org.monte.screenrecorder.ScreenRecorder;

import static org.monte.media.AudioFormatKeys.*;
import static org.monte.media.VideoFormatKeys.*;

public class ScreenRecorderUtil extends ScreenRecorder {
   public static ScreenRecorder screenRecorder;
   public String name;
   public ScreenRecorderUtil(GraphicsConfiguration cfg, Rectangle captureArea, Format fileFormat,
   Format screenFormat, Format mouseFormat, Format audioFormat, File movieFolder, String name)
   throws IOException, AWTException {
      super(cfg, captureArea, fileFormat, screenFormat, mouseFormat, audioFormat, movieFolder);
      this.name = name;
   }
   
   @Override
   protected File createMovieFile(Format fileFormat) throws IOException {
      if (!movieFolder.exists()) {
         movieFolder.mkdirs();
      } else if (!movieFolder.isDirectory()) {
         throw new IOException("\"" + movieFolder + "\" is not a directory.");
      }
      SimpleDateFormat dateFormat = new SimpleDateFormat("yyyy-MM-dd HH.mm.ss");
      return new File(movieFolder,
      name + "-" + dateFormat.format(new Date()) + "." + Registry.getInstance().getExtension(fileFormat));
   }

   public static void startRecord(String methodName) throws Exception {
      File file = new File("./test-recordings/");
      Dimension screenSize = Toolkit.getDefaultToolkit().getScreenSize();
      int width = screenSize.width;
      int height = screenSize.height;

      Rectangle captureSize = new Rectangle(0, 0, width, height);

      GraphicsConfiguration gc = 
      GraphicsEnvironment.getLocalGraphicsEnvironment().getDefaultScreenDevice().getDefaultConfiguration();
      screenRecorder = new ScreenRecorderUtil(gc, captureSize,
         new Format(MediaTypeKey, MediaType.FILE, MimeTypeKey, MIME_AVI),
         new Format(MediaTypeKey, MediaType.VIDEO, EncodingKey, ENCODING_AVI_TECHSMITH_SCREEN_CAPTURE,
         CompressorNameKey, ENCODING_AVI_TECHSMITH_SCREEN_CAPTURE, DepthKey, 24, FrameRateKey,
         Rational.valueOf(15), QualityKey, 1.0f, KeyFrameIntervalKey, 15 * 60),
         new Format(MediaTypeKey, MediaType.VIDEO, EncodingKey, "black", FrameRateKey, Rational.valueOf(30)),
         null, file, methodName);
      screenRecorder.start();
   }

   public static void stopRecord() throws Exception {
      screenRecorder.stop();
   }
}

ScreenRecorderUtil.java 的原始碼：https://www.randelshofer.ch/monte/

測試類 CaptureVid.java 的程式碼實現。

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import java.util.concurrent.TimeUnit;

public class CaptureVid {
   public static void main(String[] args) throws Exception {

      // start screen recording
      ScreenRecorderUtil.startRecord("main");

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();
      
      // adding implicit wait of 15 secs
      driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);

      // Opening the webpage where we will identify checkbox
      driver.get("https://tutorialspoint.tw/selenium/practice/check-box.php");

      // Identify element then click
      WebElement c = driver.findElement(By.xpath("//*[@id='c_bs_1']"));
      c.click();

      // verify if checkbox is selected
      Boolean result = c.isSelected();
      System.out.println("Checkbox is selected: " + result);

      //Closing browser
      driver.quit();

      // stop recording
      ScreenRecorderUtil.stopRecord();
   }
}

pom.xml 中的依賴項。

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
   xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
   xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 
   http://maven.apache.org/xsd/maven-4.0.0.xsd">
   <modelVersion>4.0.0</modelVersion>

   <groupId>org.example</groupId>
   <artifactId>SeleniumJava</artifactId>
   <version>1.0-SNAPSHOT</version>

   <properties>
      <maven.compiler.source>16</maven.compiler.source>
      <maven.compiler.target>16</maven.compiler.target>
      <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
   </properties>
   
   <!-- https://mvnrepository.com/artifact/org.seleniumhq.selenium/selenium-java -->
   <dependencies>
      <dependency>
         <groupId>org.seleniumhq.selenium</groupId>
         <artifactId>selenium-java</artifactId>
         <version>4.11.0</version>
      </dependency>
      
      <!-- https://mvnrepository.com/artifact/com.github.stephenc.monte/monte-screen-recorder -->
      <dependency>
         <groupId>com.github.stephenc.monte</groupId>
         <artifactId>monte-screen-recorder</artifactId>
         <version>0.7.7.0</version>
      </dependency>
   </dependencies>
</project>

請注意，在我們的示例中，實用程式檔案 ScreenRecorderUtil.java 和測試類檔案 CaptureVid.java 建立在同一個包下 - example。

pom.xml 中的依賴項。

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
   xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
   xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 
   http://maven.apache.org/xsd/maven-4.0.0.xsd">
   <modelVersion>4.0.0</modelVersion>

   <groupId>org.example</groupId>
   <artifactId>SeleniumJava</artifactId>
   <version>1.0-SNAPSHOT</version>

   <properties>
      <maven.compiler.source>16</maven.compiler.source>
      <maven.compiler.target>16</maven.compiler.target>
      <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
   </properties>
   
   <!-- https://mvnrepository.com/artifact/org.seleniumhq.selenium/selenium-java -->
   <dependencies>
      <dependency>
         <groupId>org.seleniumhq.selenium</groupId>
         <artifactId>selenium-java</artifactId>
         <version>4.11.0</version>
      </dependency>
      
      <!-- https://mvnrepository.com/artifact/com.github.stephenc.monte/monte-screen-recorder -->
      <dependency>
         <groupId>com.github.stephenc.monte</groupId>
         <artifactId>monte-screen-recorder</artifactId>
         <version>0.7.7.0</version>
      </dependency>
   </dependencies>
</project>

輸出

Checkbox is selected: true

Process finished with exit code 0

在上面的示例中，我們首先啟動了一個應用程式並單擊了複選框，並使用控制檯中的訊息驗證了複選框是否已選中 - 複選框已選中：true。

最後，收到訊息程序已完成，退出程式碼為 0，表示程式碼已成功執行。

此外，影片錄製檔名為main-2024-02-26 16.29.avi，位於test-recordings資料夾下，已在專案目錄中建立。測試執行後重新整理專案資料夾後，將可以看到此資料夾。單擊它後，我們將看到我們示例中執行的所有測試步驟的影片。

Selenium Capture Videos 4

因此，在本教程中，我們討論瞭如何使用 Selenium Webdriver 捕獲影片。

列印頁面
上一頁
下一頁
廣告

© . All rights reserved.