Comment faire une capture d'écran de la page Web entière ( capture d'écran pleine page ), pas seulement partielle ( top- de bas en haut ) en utilisant Selenium WebDriver?
Mon code: ( Liaisons Java )
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));
Avez-vous des idées sur la façon de résoudre ce problème?
LE: Je vois que beaucoup de gens sont intéressés par la capture d'écran pleine page, donc j'ai pensé que je pourrais mettre à jour la réponse avec quelques points positifs (des balles d'argent).
Il existe une poignée de cadres de test Web qui peuvent ( avec une configuration et des efforts minimes) produire un capture d'écran pleine page = . Je viens d'un environnement de test NodeJS, donc je ne peux que garantir les éléments suivants: WebdriverIO & Google's Puppeteer .
Si quelqu'un est intéressé par un moyen simple de le faire avec WebdriverIO, cochez this answer.
La réponse courte est NON, VOUS NE POUVEZ PAS , si vous utilisez uniquement du sélénium (raison détaillée ci-dessous). Mais, ce que vous pouvez faire, c'est tirer le meilleur parti de votre appareil (moniteur) fenêtre d'affichage .
Par conséquent, démarrez votre instance de navigateur (pilote) à l'aide de ChromeOptions()
, qui est la méthode de définition des fonctionnalités spécifiques à ChromeDriver. Nous pouvons faire ce qui suit:
--start-maximized
commutateur);F11
- touche sous Windows, Control+Cmd+F
sur Mac, en utilisant le --start-fullscreen
commutateur).Votre code devrait ressembler à ceci:
// 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);
En ce qui concerne le problème de la page complète, tous les pilotes (chromedriver
, geckodriver
, IEDriver
, EdgeDriver
, etc.) implémentent le WebDriver W3C standard. Ainsi, ils dépendent de la manière dont l'équipe WebDriver souhaite exposer la fonctionnalité de différentes fonctionnalités, dans notre cas, 'Take Screenshot' .
Si vous lisez la définition, elle indique clairement ce qui suit:
La commande Prendre une capture d'écran prend une capture d'écran de la fenêtre de visualisation du contexte de navigation de niveau supérieur [~ # ~] [~ # ~] .
En ce qui concerne l'héritage, certains pilotes ont pu produire une capture d'écran pleine page (en savoir plus ici ), comme l'ancien FirefoxDriver, IEDriver, etc. Ce n'est plus le cas car ils implémentent tous maintenant (à la lettre) la norme WebDriver W3C.
J'ai trouvé un tutoriel http://www.softwaretestingmaterial.com/how-to-capture-full-page-screenshot-using-Selenium-webdriver/ Pour les utilisateurs maven: n'oubliez pas d'ajouter la dépendance à partir de - https://mvnrepository.com/artifact/ru.yandex.qatools.ashot/ashot Lorsque je teste ce script, j'ai de grandes images, qui ne peuvent pas être ouvertes dans le navigateur (trop grandes ou cassé).
Alors peut-être que quelqu'un connaît un script, quelle page de focus sur le dernier localisateur utilisé?
On dirait ceci article suggérant AShot fonctionne pour moi. De plus, j'ai réussi à intégrer la capture d'écran de la page entière dans le rapport Cucumber avec le code suivant
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();
}
}
Vous pouvez utiliser Phantomjs pour y parvenir.
Voici mon Java:
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();
}
}
}
Vous pouvez donc obtenir une capture d'écran de la page Web complète de Phantomjs. Lorsque vous utilisez Phantomjs pour obtenir une capture d'écran complète, vous devez d'abord télécharger Phantomjs. Exécutez ensuite le script Phantomjs sur capture d'écran. Pour en savoir plus, vous pouvez référencer phantomjs.org .
Pour certaines pages, je dois faire une capture d'écran du début et de la fin de la page. J'utilise donc pour prendre 2 captures d'écran:
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));
Voici mon exemple de capture d'écran en plein écran en utilisant C #, mais changez simplement:
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();