Wie man einen Screenshot der gesamten Webseite macht ( Ganzseiten-Screenshot ), nicht nur teilweise ( nach unten ) mit Selenium WebDriver?
Mein Code: ( Java-Bindungen )
System.setProperty("webdriver.chrome.driver","/home/alex/Downloads/chromedriver_linux64/chromedriver");
WebDriver driver = new ChromeDriver();
driver.get("http://google.com");
File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
FileUtils.copyFile(scrFile, new File(RESULT_FILENAME));
Irgendwelche Ideen, wie man das angehen kann?
LE: Ich sehe, dass ziemlich viele Leute an dem ganzseitigen Screenshot interessiert sind, also dachte ich, ich könnte die Antwort mit ein paar positiven Punkten aktualisieren (- Silberkugeln).
Es gibt eine ganze Reihe von Web-Test-Frameworks, mit denen (mit minimalem Aufwand) ein ganzseitiger Screenshot . Ich komme aus einer NodeJS-Testumgebung und kann daher nur Folgendes garantieren: WebdriverIO & Googles Puppenspieler .
Wenn jemand an einer einfachen Möglichkeit interessiert ist, dies mit WebdriverIO zu tun, überprüfen Sie diese Antwort.
Kurze Antwort ist NEIN, SIE KÖNNEN NICHT , wenn Sie nur Selen verwenden (detaillierter Grund unten). Sie können jedoch das Beste aus dem Ansichtsfenster Ihres Geräts herausholen.
Starten Sie daher Ihre Browser-Instanz (den Treiber) mit ChromeOptions()
, der Methode zum Festlegen der ChromeDriver-spezifischen Funktionen. Wir können Folgendes tun:
--start-maximized
Schalter);F11
- Taste unter Windows, Control+Cmd+F
auf dem Mac mit dem --start-fullscreen
Schalter).Ihr Code sollte folgendermaßen aussehen:
// Setting your Chrome options (Desired capabilities)
ChromeOptions options = new ChromeOptions();
options.add_argument('--start-maximized');
options.add_argument('--start-fullscreen');
// Creating a driver instance with the previous capabilities
WebDriver driver = new ChromeDriver(options);
// Load page & take screenshot of full-screen page
driver.get("http://google.com");
File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
In Bezug auf das Problem mit der vollständigen Seite implementieren alle Treiber (chromedriver
, geckodriver
, IEDriver
, EdgeDriver
usw.) das WebDriver W3C Standard. Sie hängen daher davon ab, wie das WebDriver-Team die Funktionalität verschiedener Funktionen offenlegen möchte, in unserem Fall 'Take Screenshot' .
Wenn Sie die Definition lesen, heißt es eindeutig:
Mit dem Befehl "Screenshot erstellen" wird ein Screenshot des Ansichtsfensters [~ # ~] [~ # ~] des Browserkontexts der obersten Ebene erstellt .
In der Vergangenheit konnten einige Treiber einen ganzseitigen Screenshot erstellen (lesen Sie mehr darüber hier ), wie der alte FirefoxDriver, IEDriver usw. Das ist nicht mehr der Fall wie sie jetzt alle den WebDriver W3C-Standard (auf den Buchstaben) implementieren.
Ich habe ein Tutorial gefunden http://www.softwaretestingmaterial.com/how-to-capture-full-page-screenshot-using-Selenium-webdriver/ Für Maven-Benutzer: Denken Sie daran, Abhängigkeiten von - hinzuzufügen. https://mvnrepository.com/artifact/ru.yandex.qatools.ashot/ashot Beim Testen dieses Skripts sind große Bilder vorhanden, die im Browser nicht geöffnet werden können (zu groß oder zu groß) gebrochen).
Kennt also vielleicht jemand irgendein Skript, dessen Schwerpunktseite auf dem zuletzt verwendeten Locator liegt?
Sieht so aus Artikel schlägt vor A Shot funktioniert bei mir. Außerdem habe ich den ganzseitigen Screenshot mit folgendem Code erfolgreich in den Cucumber-Bericht eingebettet
scenario.embed(takeScreenShotAsByte(getWebDriver()), "image/png");
private static byte[] takeScreenShotAsByte(WebDriver webDriver) throws IOException {
return takeFullPageScreenShotAsByte(webDriver);
}
private static byte[] takeFullPageScreenShotAsByte(WebDriver webDriver) throws IOException {
Screenshot fpScreenshot = new AShot().shootingStrategy(ShootingStrategies.viewportPasting(1000))
.takeScreenshot(webDriver);
BufferedImage originalImage = fpScreenshot.getImage();
try (ByteArrayOutputStream baos = new ByteArrayOutputStream()) {
ImageIO.write(originalImage, "png", baos);
baos.flush();
return baos.toByteArray();
}
}
Sie können Phantomjs verwenden, um dies zu erreichen.
Hier ist mein Java Code:
public class PhantomjsTest {
public static void main(String[] args) {
try {
long start=System.currentTimeMillis();
//The page you want to screenshot
String targetUrl="https://www.iqiyi.com/";
//File path
String targetImg="iqiyi.png";
String command = "/Users/hetiantian/SoftWares/phantomjs/bin/phantomjs /Users/hetiantian/SoftWares/phantomjs/examples/rasterize.js "+targetUrl + " " +targetImg;
Process p = Runtime.getRuntime().exec(command);
p.waitFor();
System.out.println((System.currentTimeMillis()-start));
} catch (Exception e) {
e.printStackTrace();
}
}
}
So können Sie einen Screenshot der vollständigen Webseite von Phantomjs erhalten. Wenn Sie Phantomjs verwenden, um einen vollständigen Screenshot zu erhalten, müssen Sie zuerst Phantomjs herunterladen. Führen Sie dann das Phantomjs-Skript aus, um einen Screenshot zu erstellen. Mehr dazu können Sie unter phantomjs.org nachlesen.
Für einige Seiten muss ich einen Screenshot vom Anfang und Ende der Seite machen. Also mache ich 2 Screenshots:
public static String javaIoTmpDir = System.getProperty("Java.io.tmpdir"); //tmp dir
//create screenshot
driver.manage().window().fullscreen();
//For large pages - body over 850 px highh - take addition screenshot of the end of page
if (driver.findElements(By.id("panel_body")).size()>0) {
WebElement body = driver.findElement(By.id("panel_body"));
int bodyHight = body.getSize().getHeight();
if (bodyHight > 850) {
Robot robot = new Robot();
robot.keyPress(KeyEvent.VK_END);
robot.keyRelease(KeyEvent.VK_END);
Thread.sleep(1000);
File scrFile = ((TakesScreenshot) driver).getScreenshotAs(OutputType.FILE);
String timePictureEnd = javaIoTmpDir+"\\scr_"+String.valueOf(System.currentTimeMillis())+getClass().toString().substring(getClass().toString().lastIndexOf(".qa.")+3)+".png";
FileUtils.copyFile(scrFile, new File(timePictureEnd));
robot.keyPress(KeyEvent.VK_HOME); //back to top page for next screen
robot.keyRelease(KeyEvent.VK_HOME);
Thread.sleep(1000);
}
}
String timePicture = javaIoTmpDir+"\\scr_"+String.valueOf(System.currentTimeMillis())+getClass().toString().substring(getClass().toString().lastIndexOf(".qa.")+3)+".png";
File scrFile = ((TakesScreenshot) driver).getScreenshotAs(OutputType.FILE);
FileUtils.copyFile(scrFile, new File(timePicture));
Hier ist mein Beispiel für Get Full Screen ScreenShot mit C #, aber ändern Sie es einfach:
string _currentPath = Path.GetDirectoryName(Assembly.GetAssembly(typeof(One of your objects)).Location) + @"\Attachs\";
var filePath = _currentPath + sSName;
if (!Directory.Exists(_currentPath))
Directory.CreateDirectory(_currentPath);
Dictionary<string, Object> metrics = new Dictionary<string, Object>();
metrics["width"] = _driver.ExecuteScript("return Math.max(window.innerWidth,document.body.scrollWidth,document.documentElement.scrollWidth)");
metrics["height"] = _driver.ExecuteScript("return Math.max(window.innerHeight,document.body.scrollHeight,document.documentElement.scrollHeight)");
metrics["deviceScaleFactor"] = (double)_driver.ExecuteScript("return window.devicePixelRatio");
metrics["mobile"] = _driver.ExecuteScript("return typeof window.orientation !== 'undefined'");
_driver.ExecuteChromeCommand("Emulation.setDeviceMetricsOverride", metrics);
_driver.GetScreenshot().SaveAsFile(filePath, ScreenshotImageFormat.Png);
_driver.ExecuteChromeCommand("Emulation.clearDeviceMetricsOverride", new Dictionary<string, Object>());
_driver.Close();