วิธีถ่ายภาพหน้าจอด้วย Selenium WebDriver


499

ไม่มีใครรู้ว่าเป็นไปได้ที่จะจับภาพหน้าจอโดยใช้ Selenium WebDriver หรือไม่? (หมายเหตุ: ไม่ใช่ซีลีเนียม RC)


อาจมีเพียงวิธีเดียวในการทำเช่นนี้กับ WebDriver Wire Protocol แต่ไม่มีใครใช้โปรโตคอลนี้โดยตรง แต่ผู้คนใช้การเชื่อมโยง / ไลบรารีภาษาที่ต่างกันซึ่งล้อมรอบโปรโตคอลระดับต่ำ มีการผูกภาษามากมายดังนั้นคุณต้องบอกว่าคุณต้องการใช้ภาษาไหน มิฉะนั้นจะมีคำตอบมากเกินไป
oberlies

คุณใช้ภาษาโปรแกรมภาษาใด
Ripon Al Wasim

คุณต้องการถ่ายภาพหน้าจอทั้งหน้าหรือองค์ประกอบเฉพาะหรือไม่?
Ripon Al Wasim

ใช่เป็นไปได้ที่จะจับภาพหน้าจอทั้งหน้าหรือสำหรับองค์ประกอบเฉพาะกับ Selenium WebDriver
Ripon Al Wasim

คำตอบ:


507

ชวา

ใช่มันเป็นไปได้ ตัวอย่างต่อไปนี้อยู่ใน Java:

WebDriver driver = new FirefoxDriver();
driver.get("http://www.google.com/");
File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
// Now you can do whatever you need to do with it, for example copy somewhere
FileUtils.copyFile(scrFile, new File("c:\\tmp\\screenshot.png"));

30
การคัดลอกไฟล์แทนที่จะเปลี่ยนชื่อเป็นความคิดที่ดีถ้ามีโอกาสที่ต้นทางและปลายทางอาจไม่อยู่ในระบบไฟล์เดียวกัน คุณไม่สามารถเปลี่ยนชื่อข้ามขอบเขตระบบไฟล์ (ในยูนิกซ์อย่างน้อย) โปรดทราบว่าเป็นเรื่องปกติ/tmpที่จะอยู่ในระบบไฟล์ของตนเองและ FirefoxDriver เขียนภาพหน้าจอ/tmpเขียนภาพหน้าจอ
Tom Anderson

9
มีวิธีการทำเฉพาะกรณีที่ล้มเหลวหรือไม่?
some_other_guy

6
เป็นเรื่องน่าสังเกตที่HtmlUnitDriverไม่ได้ใช้TakesScreenshot(ดูselenium.googlecode.com/git/docs/api/java/org/openqa/selenium/ ......สำหรับรายการไดรเวอร์ที่รองรับ) แต่คุณสามารถบันทึกเป็น HTML
Wernight

7
แพ็กเกจใดที่จำเป็นต้องอิมพอร์ตเพื่อใช้คลาส FileUtils
Ripon Al Wasim

7
@RiponAlWasim อาจorg.apache.commons.io.FileUtils
Ben

269

หลาม

แต่ละ WebDriver มี.save_screenshot(filename)วิธีการ ดังนั้นสำหรับ Firefox มันสามารถใช้ดังนี้:

from selenium import webdriver

browser = webdriver.Firefox()
browser.get('http://www.google.com/')
browser.save_screenshot('screenie.png')

พลุกพล่านเป็น.get_screenshot_as_file(filename)วิธีการยังมีอยู่ว่าจะเป็นสิ่งเดียวกัน

นอกจากนี้ยังมีวิธีการสำหรับ: .get_screenshot_as_base64()(สำหรับการฝังใน html) และ.get_screenshot_as_png()(สำหรับการดึงข้อมูลไบนารี)

และโปรดทราบว่า WebElements มี.screenshot()วิธีการที่คล้ายกัน แต่จับองค์ประกอบที่เลือกเท่านั้น


สำหรับเบราว์เซอร์อื่นให้แลกเปลี่ยนอินสแตนซ์ของ webdriver ถ้าคุณเพียงต้องการภาพหน้าจอของเว็บไซต์ของคุณรวมทั้งรัฐมีลักษณะที่Usersnap
Gregor

@ DavidRöthlisberger thats ดีทั้งหมด แต่ความคิดเห็นของคุณมีอะไรจะทำอย่างไรกับคำตอบของฉัน
คอเรย์โกลด์เบิร์ก

หากต้องการสร้าง scrennshot แบบเต็มหน้าไม่ใช่เฉพาะในพื้นที่ที่มองเห็นได้ให้ใช้รหัสไพ ธ อนจากคำตอบของฉันที่นี่เพื่อ stich: stackoverflow.com/questions/37906704/…
Fabian Thommen

1
@CoreyGoldberg จริงไม่มีอะไรเกี่ยวข้องกับคำตอบของคุณ แต่สคริปต์เก่าของฉันใช้ FF ที่เก่ากว่าและใช้ทั้งหน้าไม่ใช่เฉพาะวิวพอร์ต หลังจากพวกเขาเปลี่ยนเป็นวิวพอร์ตตอนนี้เท่านั้น ดังนั้นฉันจึงต้องการช่วยคนที่มีปัญหาเดียวกัน และใช่องค์ประกอบคงที่เป็นความเจ็บปวดที่แท้จริงในการเลื่อน / stich!
Fabian Thommen

1
driver.set_window_size(1366, 728)อีกสิ่งหนึ่งที่ช่วยให้ฉันอย่างมากหากคุณจำเป็นต้องเปลี่ยนมิติภาพเพียงกำหนดขนาดของหน้าต่างก่อนที่คุณจะถ่ายภาพโดยใช้
SpoiledBrat

110

ค#

public void TakeScreenshot()
{
    try
    {            
        Screenshot ss = ((ITakesScreenshot)driver).GetScreenshot();
        ss.SaveAsFile(@"D:\Screenshots\SeleniumTestingScreenshot.jpg", System.Drawing.Imaging.ImageFormat.Jpeg);
    }
    catch (Exception e)
    {
        Console.WriteLine(e.Message);
        throw;
    }
}

9
ทำงานได้อย่างสมบูรณ์แบบ Caveat: ถ่ายภาพหน้าจอไม่ใช่ภาพหน้าจอ
ljgww

คุณหมายความว่ามันได้รับเดสก์ทอปและทุกอย่าง? หรือคุณหมายถึงว่ามันเพิ่งได้วิวพอร์ต?
vtortola

มันจะได้รับสิ่งที่อยู่ในขอบเขตของไดรเวอร์เท่านั้นนี่คือการอนุญาตให้ทำการทดสอบแบบขนานหลายครั้ง โปรดทราบว่ามันจะไม่ย่อลงหากโฟกัสหน้าต่างหลักของไดรเวอร์มีแถบเลื่อนหรือหากเกินหน้าเดียว
Ben

3
อัปเดตเป็น SaveAsFile (เส้นทางสตริงรูปแบบ ScreenshotImageFormat) ScreenshotImageFormat.Jpeg
Kieran

1
สิ่งนี้ได้ผลสำหรับฉัน! ฉันใช้ CopyFromScreen จากเนมสเปซกราฟิก ข้อได้เปรียบของการแก้ปัญหาข้างต้นคือมันทำงานได้เมื่อรหัสถูกเรียกในทางที่ไม่ปลอดภัยจาก TFS วิธี CopyFromScreen แบบเก่าของฉันใช้ได้เฉพาะเมื่อเรียกใช้การทดสอบซีลีเนียมจาก Visual Studio แต่ไม่เคยทำงานสำหรับการทดสอบการเรียกใช้ TFS ของฉัน
Ewan

74

JavaScript (Selenium-Webdriver)

driver.takeScreenshot().then(function(data){
   var base64Data = data.replace(/^data:image\/png;base64,/,"")
   fs.writeFile("out.png", base64Data, 'base64', function(err) {
        if(err) console.log(err);
   });
});

3
คล้ายกับวิธี Browserstack อธิบาย: browserstack.com/automate/node#enhancements-screenshots
ไมค์ causer

ใน data.replace คุณกำลังทำอะไรอยู่ในวงเล็บ?
John Demetriou

@ JohnDemetriou ข้อมูลเป็นชื่อของวัตถุหรือตัวแปรที่จะถูกสร้างขึ้นเมื่อคุณเรียกมัน คุณสามารถโทรหาได้var1ถ้าคุณต้องการ คุณควรดูtakeScreenshot()ฟังก์ชั่นเพื่อรู้ว่ามันคืออะไร อาจเป็นภาพไบนารีที่แสดงจากจาวาสคริปต์โดยใช้ Canvas มันอาจเป็นโดมก่อนที่มันจะถูกเรนเดอร์ มองเข้าไปใน.
m3nda

66

ทับทิม

require 'rubygems'
require 'selenium-webdriver'

driver = Selenium::WebDriver.for :ie 
driver.get "https://www.google.com"   
driver.save_screenshot("./screen.png")

มีประเภทและตัวเลือกไฟล์ให้ใช้เพิ่มเติมและคุณสามารถดูได้ใน takes_sc4.0.rb


ทำงานได้ดีสำหรับฉันโดยใช้ Selenium Grid 2 สคริปต์และฮับที่ทำงานบน OS X Snow Leopard; โหนดที่ทำงานบน RedHat EL 4 กับ Firefox 3.6.18 ภายใต้ Xvfb
MarkD

1
มีวิธีใดบ้างในการจับภาพหน้าจอเต็มหน้าจอไม่ใช่เฉพาะพื้นที่ที่มองเห็นได้
Arihant Godha

2
หน้าเต็มถูกนำมาใช้โดยค่าเริ่มต้น อย่างน้อยก็ใช้headlessและFirefox
แอชลีย์

35

ชวา

ฉันได้รับการแก้ไขปัญหานี้แล้ว คุณสามารถเพิ่มRemoteWebDriverเพื่อให้อินเทอร์เฟซทั้งหมดที่ไดรเวอร์พรอกซีใช้ดำเนินการ:

WebDriver augmentedDriver = new Augmenter().augment(driver); 
((TakesScreenshot)augmentedDriver).getScreenshotAs(...); //works this way

หากคุณทำเช่นนั้นคุณไม่จำเป็นต้องคัดลอกภาพหน้าจอไปยังชื่อไฟล์ด้วย threadId เพื่อให้คุณสามารถบอกได้ว่าเธรด / อินสแตนซ์ของไดรเวอร์ของคุณโยนภาพหน้าจอหรือไม่ มิฉะนั้นเบราว์เซอร์หลายอินสแตนซ์บนโหนดกริดหนึ่งจะเขียนทับภาพหน้าจอของผู้อื่นหรือไม่
djangofan

1
ฉันต้องการจะชี้ให้เห็นว่าวิธีแก้ปัญหานี้ใช้ได้สำหรับฉันโดยใช้หัวขาด ChromeDriver
GabrielRado

34

PHP (PHPUnit)

ใช้ PHPUnit_Selenium extension เวอร์ชั่น 1.2.7:

class MyTestClass extends PHPUnit_Extensions_Selenium2TestCase {
    ...
    public function screenshot($filepath) {
        $filedata = $this->currentScreenshot();
        file_put_contents($filepath, $filedata);
    }

    public function testSomething() {          
        $this->screenshot('/path/to/screenshot.png');
    }
    ...
}

daaaamn! ฉันต้องการทราบเพิ่มเติมเกี่ยวกับเรื่องนี้ซีลีเนียมเป็นสิ่งใหม่สำหรับฉันและฉันกำลังมองหาโซลูชัน cli เพื่อสร้างภาพหน้าจอในเบราว์เซอร์และระบบปฏิบัติการ
OS

25

ค#

public Bitmap TakeScreenshot(By by) {
    // 1. Make screenshot of all screen
    var screenshotDriver = _selenium as ITakesScreenshot;
    Screenshot screenshot = screenshotDriver.GetScreenshot();
    var bmpScreen = new Bitmap(new MemoryStream(screenshot.AsByteArray));

    // 2. Get screenshot of specific element
    IWebElement element = FindElement(by);
    var cropArea = new Rectangle(element.Location, element.Size);
    return bmpScreen.Clone(cropArea, bmpScreen.PixelFormat);
}

18

ชวา

public String captureScreen() {
    String path;
    try {
        WebDriver augmentedDriver = new Augmenter().augment(driver);
        File source = ((TakesScreenshot)augmentedDriver).getScreenshotAs(OutputType.FILE);
        path = "./target/screenshots/" + source.getName();
        FileUtils.copyFile(source, new File(path)); 
    }
    catch(IOException e) {
        path = "Failed to capture screenshot: " + e.getMessage();
    }
    return path;
}

คุณใช้ไดรเวอร์อะไร ใหม่ Augmenter (). augment (ไดรเวอร์);
kozla13

12

Jython

import org.openqa.selenium.OutputType as OutputType
import org.apache.commons.io.FileUtils as FileUtils
import java.io.File as File
import org.openqa.selenium.firefox.FirefoxDriver as FirefoxDriver

self.driver = FirefoxDriver()
tempfile = self.driver.getScreenshotAs(OutputType.FILE)
FileUtils.copyFile(tempfile, File("C:\\screenshot.png"))

9

Java (Robot Framework)

ฉันใช้วิธีนี้ในการถ่ายภาพหน้าจอ

void takeScreenShotMethod(){
    try{
        Thread.sleep(10000)
        BufferedImage image = new Robot().createScreenCapture(new Rectangle(Toolkit.getDefaultToolkit().getScreenSize()));
        ImageIO.write(image, "jpg", new File("./target/surefire-reports/screenshot.jpg"));
    }
    catch(Exception e){
        e.printStackTrace();
    }
}

คุณสามารถใช้วิธีนี้ได้ทุกที่ที่ต้องการ


คุณควรให้ความสำคัญกับเบราว์เซอร์ตลอดเวลาไม่เช่นนั้นจะจับภาพสิ่งที่โฟกัสอยู่ในปัจจุบัน
kushal.8

8

ชวา

ดูเหมือนว่าจะหายไปที่นี่ - การจับภาพหน้าจอขององค์ประกอบเฉพาะใน Java:

public void takeScreenshotElement(WebElement element) throws IOException {
    WrapsDriver wrapsDriver = (WrapsDriver) element;
    File screenshot = ((TakesScreenshot) wrapsDriver.getWrappedDriver()).getScreenshotAs(OutputType.FILE);
    Rectangle rectangle = new Rectangle(element.getSize().width, element.getSize().height);
    Point location = element.getLocation();
    BufferedImage bufferedImage = ImageIO.read(screenshot);
    BufferedImage destImage = bufferedImage.getSubimage(location.x, location.y, rectangle.width, rectangle.height);
    ImageIO.write(destImage, "png", screenshot);
    File file = new File("//path//to");
    FileUtils.copyFile(screenshot, file);
}

ฉันไม่คิดว่าวิธีการนี้ใช้งานได้จริงเนื่องจากภาพหน้าจอและเบราว์เซอร์จริงมีความละเอียดต่างกัน ดังนั้นเมื่อใช้ตำแหน่งพิกัดที่ได้รับโดยซีลีเนียมบนรูปภาพของคุณคุณค่อนข้างแน่ใจว่าจะใช้ java.awt.image.RasterFormatException: (y + ความสูง) อยู่นอก Raster
Ichwardort

คุณลองรหัสแล้วหรือยัง มันทำงานเมื่อฉันพยายามครั้งสุดท้าย
Erki M.

1
มันทำงานได้อย่างสมบูรณ์แบบตราบใดที่คุณลองจับองค์ประกอบที่มองเห็นได้โดยไม่ต้องเลื่อน เมื่อคุณต้องการเลื่อนไปยังองค์ประกอบเพื่อจับภาพจากนั้นค่าชดเชย y จะคำนวณจากด้านบนของหน้าซึ่งเกินขอบเขตของภาพเต็มหน้าจอ ดังนั้นทางออกที่ง่ายที่สุดคือการเพิ่มขนาดหน้าจอcodethis.driver.manage (). window (). setSize (มิติใหม่ (1680, 1050)); หรือลบองค์ประกอบที่ไม่จำเป็นใด ๆ ผ่าน css ทางออกที่เหมาะสมคือการคำนวณค่า y-offset จากการเลื่อน
Ichwardort

1
ใช้Firefoxงานได้ดีในขณะที่ครอบตัดหน้าจอองค์ประกอบจากภาพเต็มตามขนาด ในChromeกรณีที่องค์ประกอบพร้อมใช้งานในส่วนมุมมองโดยไม่เลื่อนภาพจากส่วนมุมมองนั้นจะจับองค์ประกอบได้ดี หากเราต้องการจับภาพหน้าจอหลังจากเลื่อนระดับdocument.documentElement.clientHeightความสูงของไคลเอ็นต์สองครั้งการใช้(location.y)-2*clientHeightเพื่อให้ได้ภาพหน้าจอองค์ประกอบที่แน่นอน ขอบคุณสำหรับโพสต์นี้เพราะมันช่วยฉัน ...
Yash

6

ค#

using System;
using OpenQA.Selenium.PhantomJS;
using System.Drawing.Imaging;

namespace example.com
{
    class Program
    {
        public static PhantomJSDriver driver;

        public static void Main(string[] args)
        {
            driver = new PhantomJSDriver();
            driver.Manage().Window.Size = new System.Drawing.Size(1280, 1024);
            driver.Navigate().GoToUrl("http://www.example.com/");
            driver.GetScreenshot().SaveAsFile("screenshot.png", ImageFormat.Png);
            driver.Quit();
        }
    }
}

ต้องใช้ NuGetPackages:

  1. PhantomJS 2.0.0
  2. ซีลีเนียมสนับสนุน 2.48.2
  3. Selenium.WebDriver 2.48.2

ทดสอบกับ. NETFramework v4.5.2


5

ชวา

ฉันไม่สามารถรับคำตอบที่ได้รับการยอมรับ แต่ตามเอกสาร WebDriver ปัจจุบันสิ่งต่อไปนี้ใช้ได้กับฉันด้วย Java 7 บน OS X 10.9:

import java.io.File;
import java.net.URL;

import org.openqa.selenium.OutputType;
import org.openqa.selenium.TakesScreenshot;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.remote.Augmenter;
import org.openqa.selenium.remote.DesiredCapabilities;
import org.openqa.selenium.remote.RemoteWebDriver;

public class Testing {

   public void myTest() throws Exception {
       WebDriver driver = new RemoteWebDriver(
               new URL("http://localhost:4444/wd/hub"),
               DesiredCapabilities.firefox());

       driver.get("http://www.google.com");

       // RemoteWebDriver does not implement the TakesScreenshot class
       // if the driver does have the Capabilities to take a screenshot
       // then Augmenter will add the TakesScreenshot methods to the instance
       WebDriver augmentedDriver = new Augmenter().augment(driver);
       File screenshot = ((TakesScreenshot)augmentedDriver).
               getScreenshotAs(OutputType.FILE);
   }
}

4

ทับทิม (แตงกวา)

After do |scenario| 
    if(scenario.failed?)
        puts "after step is executed"
    end
    time = Time.now.strftime('%a_%e_%Y_%l_%m_%p_%M')

    file_path = File.expand_path(File.dirname(__FILE__) + '/../../../../../mlife_screens_shot')+'/'+time +'.png'

    page.driver.browser.save_screenshot file_path
end

Given /^snapshot$/ do
    time = Time.now.strftime('%a_%e_%Y_%l_%m_%p_%M')

    file_path = File.expand_path(File.dirname(__FILE__) + '/../../../../../mlife_screens_shot')+'/'+time +'.png'
    page.driver.browser.save_screenshot file_path
end

นี่คือภาษาอะไร?
codygman

ดูเหมือนว่าจะเป็นทับทิมไม่ได้ใช้ไดรเวอร์เว็บใด ๆ โดยเฉพาะ
James

4

ทับทิม

time = Time.now.strftime('%a_%e_%Y_%l_%m_%p_%M_%S')
file_path = File.expand_path(File.dirname(__FILE__) + 'screens_shot')+'/'+time +'.png'
#driver.save_screenshot(file_path)
page.driver.browser.save_screenshot file_path

4

PHP

public function takescreenshot($event)
  {
    $errorFolder = dirname(dirname(__FILE__)) . DIRECTORY_SEPARATOR . "ErrorScreenshot";

    if(!file_exists($errorFolder)){
      mkdir($errorFolder);
    }

    if (4 === $event->getResult()) {
      $driver = $this->getSession()->getDriver();
      $screenshot = $driver->getWebDriverSession()->screenshot();
      file_put_contents($errorFolder . DIRECTORY_SEPARATOR . 'Error_' .  time() . '.png', base64_decode($screenshot));
    }
  }

ในรุ่นปัจจุบันของ facebook / webdriver วิธีการคือหน้าจอ () และมันไม่จำเป็นต้อง base64_encode () เอาท์พุทก่อนที่จะบันทึกไฟล์
บิลเลียด

1
คุณช่วยเพิ่มรหัสลงในตัวอย่างที่แสดงวิธีเรียกtakescreenshotใช้ฟังก์ชันนี้ได้ไหม โดยเฉพาะที่ใดที่$eventตัวแปรมาจากไหน? ฉันเป็นซีลีเนียม noob ที่สมบูรณ์ดังนั้นคำตอบสำหรับคำถามนี้ที่ไม่ถือว่าความรู้ก่อนซีลีเนียมจะได้รับการชื่นชมอย่างมาก!
Kenny83

4

PowerShell

Set-Location PATH:\to\selenium

Add-Type -Path "Selenium.WebDriverBackedSelenium.dll"
Add-Type -Path "ThoughtWorks.Selenium.Core.dll"
Add-Type -Path "WebDriver.dll"
Add-Type -Path "WebDriver.Support.dll"

$driver = New-Object OpenQA.Selenium.PhantomJS.PhantomJSDriver

$driver.Navigate().GoToUrl("https://www.google.co.uk/")

# Take a screenshot and save it to filename
$filename = Join-Path (Get-Location).Path "01_GoogleLandingPage.png"
$screenshot = $driver.GetScreenshot()
$screenshot.SaveAsFile($filename, [System.Drawing.Imaging.ImageFormat]::Png)

ไดรเวอร์อื่น ๆ ...

$driver = New-Object OpenQA.Selenium.Chrome.ChromeDriver
$driver = New-Object OpenQA.Selenium.Firefox.FirefoxDriver
$driver = New-Object OpenQA.Selenium.IE.InternetExplorerDriver
$driver = New-Object OpenQA.Selenium.Opera.OperaDriver

น่าจะใช้[OpenQA.Selenium.ScreenshotImageFormat]::Pngดีกว่าSystem.Drawingเนมสเปซ
Adarsha

4

Python ภาพหน้าจอขององค์ประกอบ:

นี่เป็นคำถามที่ค่อนข้างเก่าและมีหลายคำตอบ อย่างไรก็ตามดูเหมือนว่าการจับภาพหน้าจอขององค์ประกอบเว็บโดยใช้ Python หายไปที่นี่

ที่ตั้ง

องค์ประกอบของเว็บมีตำแหน่งของตัวเองในหน้าเว็บและโดยทั่วไปจะวัดเป็น x และ y พิกเซลและรู้จักกันในชื่อ (x, y) พิกัดขององค์ประกอบ และวัตถุที่ตั้งมีสองค่า

  1. location ['x'] - ส่งคืน 'x' พิกัดขององค์ประกอบ
  2. location ['y'] - ส่งคืน 'y' ประสานงานขององค์ประกอบ

ขนาด

เช่นเดียวกับสถานที่แต่ละ WebElement มีความกว้างและความสูง ใช้เป็นวัตถุขนาด

  1. size ['width'] - ส่งคืน 'width' ขององค์ประกอบ
  2. ขนาด ['ความสูง'] - ส่งคืน 'ความสูง' ขององค์ประกอบ

การใช้ (x, y) ประสานและค่าความกว้างความสูงเราสามารถครอบตัดรูปภาพและเก็บไว้ในไฟล์

from selenium import webdriver
from PIL import Image

driver = webdriver.Firefox(executable_path='[Browser Driver Path]')
driver.get('https://www.google.co.in')

element = driver.find_element_by_xpath("//div[@id='hplogo']")

location = element.location
size = element.size

driver.save_screenshot("/data/image.png")

x = location['x']
y = location['y']
width = location['x']+size['width']
height = location['y']+size['height']

im = Image.open('/data/WorkArea/image.png')
im = im.crop((int(x), int(y), int(width), int(height)))
im.save('/data/image.png')

หมายเหตุ:ถ่ายจาก http://allselenium.info/capture-scurrency-element-using-python-selenium-webdriver/


อัฒภาคคืออะไร
Maikflow

3

มีหลายวิธีผ่าน 's และ ลูกค้าที่จะจับภาพหน้าจอโดยใช้


วิธีการของจาวา

ต่อไปนี้เป็นวิธีJava ที่แตกต่างกันในการจับภาพหน้าจอ :

  • ใช้getScreenshotAs()จากส่วนต่อประสาน TakesSc4.0 :

    • บล็อครหัส:

      package screenShot;
      
      import java.io.File;
      import java.io.IOException;
      
      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.openqa.selenium.support.ui.ExpectedConditions;
      import org.openqa.selenium.support.ui.WebDriverWait;
      
      public class Firefox_takesScreenshot {
      
          public static void main(String[] args) throws IOException {
      
              System.setProperty("webdriver.gecko.driver", "C:\\Utility\\BrowserDrivers\\geckodriver.exe");
              WebDriver driver =  new FirefoxDriver();
              driver.get("https://login.bws.birst.com/login.html/");
              new WebDriverWait(driver, 20).until(ExpectedConditions.titleContains("Birst"));
              File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
              FileUtils.copyFile(scrFile, new File(".\\Screenshots\\Mads_Cruz_screenshot.png"));
              driver.quit();
          }
      }
      
    • ภาพหน้าจอ:

Mads_Cruz_screenshot

  • หากหน้าเว็บเป็นjqueryเปิดใช้งานคุณสามารถใช้จากpazone / ashot library:

    • บล็อครหัส:

      package screenShot;
      
      import java.io.File;
      import javax.imageio.ImageIO;
      import org.openqa.selenium.WebDriver;
      import org.openqa.selenium.firefox.FirefoxDriver;
      import org.openqa.selenium.support.ui.ExpectedConditions;
      import org.openqa.selenium.support.ui.WebDriverWait;
      
      import ru.yandex.qatools.ashot.AShot;
      import ru.yandex.qatools.ashot.Screenshot;
      import ru.yandex.qatools.ashot.shooting.ShootingStrategies;
      
      public class ashot_CompletePage_Firefox {
      
          public static void main(String[] args) throws Exception {
      
              System.setProperty("webdriver.gecko.driver", "C:\\Utility\\BrowserDrivers\\geckodriver.exe");
              WebDriver driver =  new FirefoxDriver();
              driver.get("https://jquery.com/");
              new WebDriverWait(driver, 20).until(ExpectedConditions.titleContains("jQuery"));
              Screenshot myScreenshot = new AShot().shootingStrategy(ShootingStrategies.viewportPasting(100)).takeScreenshot(driver);
              ImageIO.write(myScreenshot.getImage(),"PNG",new File("./Screenshots/firefoxScreenshot.png"));
              driver.quit();
          }
      }
      
    • ภาพหน้าจอ:

firefoxScreenshot.png

  • การใช้ จากห้องสมุด assertthat / selenium-shutterbug :

    • บล็อครหัส:

      package screenShot;
      
      import org.openqa.selenium.WebDriver;
      import org.openqa.selenium.firefox.FirefoxDriver;
      import com.assertthat.selenium_shutterbug.core.Shutterbug;
      import com.assertthat.selenium_shutterbug.utils.web.ScrollStrategy;
      
      public class selenium_shutterbug_fullpage_firefox {
      
          public static void main(String[] args) {
      
              System.setProperty("webdriver.gecko.driver", "C:\\Utility\\BrowserDrivers\\geckodriver.exe");
              WebDriver driver =  new FirefoxDriver();
              driver.get("https://www.google.co.in");
              Shutterbug.shootPage(driver, ScrollStrategy.BOTH_DIRECTIONS).save("./Screenshots/");
              driver.quit();
          }
      }
      
    • ภาพหน้าจอ:

2019_03_12_16_30_35_787.png


วิธีการหลาม

ต่อไปนี้เป็นวิธีPython ที่แตกต่างกันในการจับภาพหน้าจอ :

  • ใช้save_screenshot()วิธีการ:

    • บล็อครหัส:

      from selenium import webdriver
      
      driver = webdriver.Chrome(r'C:\Utility\BrowserDrivers\chromedriver.exe')
      driver.get("http://google.com")
      driver.save_screenshot('./Screenshots/save_screenshot_method.png')
      driver.quit()
      
    • ภาพหน้าจอ:

save_screenshot_method.png

  • ใช้get_screenshot_as_file()วิธีการ:

    • บล็อครหัส:

      from selenium import webdriver
      
      driver = webdriver.Chrome(r'C:\Utility\BrowserDrivers\chromedriver.exe')
      driver.get("http://google.com")
      driver.get_screenshot_as_file('./Screenshots/get_screenshot_as_file_method.png')
      driver.quit()
      
    • ภาพหน้าจอ:

get_screenshot_as_file_method.png

  • ใช้get_screenshot_as_png()วิธีการ:

    • บล็อครหัส:

      from selenium import webdriver
      
      driver = webdriver.Chrome(r'C:\Utility\BrowserDrivers\chromedriver.exe')
      driver.get("http://google.com")
      screenPnG = driver.get_screenshot_as_png()
      #Crop it back to the window size (it may be taller)
      box = (0, 0, 1366, 728)
      im = Image.open(BytesIO(screenPnG))
      region = im.crop(box)
      region.save('./Screenshots/get_screenshot_as_png_method.png', 'PNG', optimize=True, quality=95)
      driver.quit()
      
    • ภาพหน้าจอ:

get_screenshot_as_png_method.png


2

หลาม

คุณสามารถจับภาพจาก windows โดยใช้ไดรเวอร์เว็บไพ ธ อน ใช้รหัสด้านล่างที่หน้าจำเป็นต้องจับภาพหน้าจอ

driver.save_screenshot('c:\foldername\filename.extension(png,jpeg)')

4
คำตอบนี้เป็นคำซ้ำที่โพสต์หลายปีหลังจากคำตอบของ Python ดั้งเดิม
Corey Goldberg

3
ยังคำตอบนี้ไม่หนี backslashes ในชื่อเส้นทาง .. ซึ่งจะทำให้เกิดข้อผิดพลาด
Corey Goldberg

นอกจากนี้ยังไม่มีรหัสการตั้งค่าบรรทัดนี้ด้วยตัวเองจะไม่ทำงาน
ลดกิจกรรม

2

ชวา

public  void captureScreenShot(String obj) throws IOException {
    File screenshotFile=((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
    FileUtils.copyFile(screenshotFile,new File("Screenshots\\"+obj+""+GetTimeStampValue()+".png"));
}

public  String GetTimeStampValue()throws IOException{
    Calendar cal = Calendar.getInstance();       
    Date time=cal.getTime();
    String timestamp=time.toString();
    System.out.println(timestamp);
    String systime=timestamp.replace(":", "-");
    System.out.println(systime);
    return systime;
}

การใช้สองวิธีนี้คุณสามารถถ่ายภาพหน้าจอพร้อมวันที่และเวลาได้เช่นกัน


2

ชวา

การใช้ RemoteWebDriver หลังจากเพิ่มความสามารถของ Node ที่มีความสามารถในการจับภาพหน้าจอแล้ว

void takeScreenShotMethod(){
    try{
        Thread.sleep(10000);
        long id = Thread.currentThread().getId();
        BufferedImage image = new Robot().createScreenCapture(new Rectangle(
            Toolkit.getDefaultToolkit().getScreenSize()));
        ImageIO.write(image, "jpg", new File("./target/surefire-reports/"
            + id + "/screenshot.jpg"));
    }
    catch( Exception e ) {
        e.printStackTrace();
    }
}

คุณสามารถใช้วิธีนี้ได้ทุกที่ที่ต้องการ จากนั้นฉันคิดว่าคุณสามารถปรับแต่งสไตล์ชีตของ maven-surefire-report-plugin ที่ surefire-reports / html / custom.css เพื่อให้รายงานของคุณมีลิงค์ไปยังสกรีนช็อตที่ถูกต้องสำหรับการทดสอบแต่ละครั้ง?


ทุกวันนี้ฉันจะไม่ทำแบบนี้ ฉันจะใช้กรอบอย่าง Selenide
djangofan

2

ชวา

String yourfilepath = "E:\\username\\Selenium_Workspace\\foldername";

// take a snapshort
File snapshort_file = ((TakesScreenshot) mWebDriver)
        .getScreenshotAs(OutputType.FILE);
// copy the file into folder

FileUtils.copyFile(snapshort_file, new File(yourfilepath));

หวังว่านี่จะช่วยแก้ปัญหาของคุณ


2

ค#

public static void TakeScreenshot(IWebDriver driver, String filename)
{
    // Take a screenshot and save it to filename
    Screenshot screenshot = ((ITakesScreenshot)driver).GetScreenshot();
    screenshot.SaveAsFile(filename, ImageFormat.Png);
}


2

ค#

คุณสามารถใช้ข้อมูลโค้ด / ฟังก์ชั่นต่อไปนี้เพื่อถ่ายภาพหน้าจอด้วยซีลีเนียม:

    public void TakeScreenshot(IWebDriver driver, string path = @"output")
    {
        var cantakescreenshot = (driver as ITakesScreenshot) != null;
        if (!cantakescreenshot)
            return;
        var filename = string.Empty + DateTime.Now.Hour + DateTime.Now.Minute + DateTime.Now.Second + DateTime.Now.Millisecond;
        filename = path + @"\" + filename + ".png";
        var ss = ((ITakesScreenshot)driver).GetScreenshot();
        var screenshot = ss.AsBase64EncodedString;
        byte[] screenshotAsByteArray = ss.AsByteArray;
        if (!Directory.Exists(path))
            Directory.CreateDirectory(path);
        ss.SaveAsFile(filename, ImageFormat.Png);
    }

"ใช้ System.Drawing.Imaging;" การชุมนุม
ArNumb

ฉันต้องใช้บรรทัดนี้ในการโทร SaveAsFile: ss.SaveAsFile (ชื่อไฟล์ ScreenshotImageFormat.Png); ฉันชอบที่จะใช้ Path.Combine (โฟลเดอร์ชื่อไฟล์) เหนือเส้นทาง + @ "\" เพราะมันอ่านได้ดีกว่าและฉันคิดว่ามันอาจจะให้อภัยมากขึ้นในการจัดรูปแบบโฟลเดอร์ / ชื่อไฟล์ การตั้งค่าส่วนตัวเท่านั้น ดังนั้นบรรทัดนั้นจะกลายเป็น: filename = Path.Combine (path, filename + ".png");
Developer63


2

JAVA

วิธีการจับภาพหน้าจอสำหรับความล้มเหลวใน Selenium ด้วย TestName และ Timestamp ต่อท้าย

public class Screenshot{        
    final static String ESCAPE_PROPERTY = "org.uncommons.reportng.escape-output";
    public static String imgname = null;

    /*
     * Method to Capture Screenshot for the failures in Selenium with TestName and Timestamp appended.
     */
    public static void getSnapShot(WebDriver wb, String testcaseName) throws Exception {
      try {
      String imgpath=System.getProperty("user.dir").concat("\\Screenshot\\"+testcaseName);
      File f=new File(imgpath);
      if(!f.exists())   {
          f.mkdir();
        }   
        Date d=new Date();
        SimpleDateFormat sd=new SimpleDateFormat("dd_MM_yy_HH_mm_ss_a");
        String timestamp=sd.format(d);
        imgname=imgpath+"\\"+timestamp+".png";

        //Snapshot code
        TakesScreenshot snpobj=((TakesScreenshot)wb);
        File srcfile=snpobj.getScreenshotAs(OutputType.FILE);
        File destFile=new File(imgname);
        FileUtils.copyFile(srcfile, destFile);

      }
      catch(Exception e) {
          e.getMessage();
      }
   }

หากคุณพบว่าคำตอบ (หรือมี) นี้เป็นประโยชน์โปรดโหวตขึ้น หากสิ่งนี้ตอบคำถามของคุณโปรดทำเครื่องหมายว่าเป็นคำตอบที่ยอมรับได้ ขอบคุณ!
Anuj Teotia

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.