Take Screenshots
Take screenshots at different points in your Selenium test
You can take screenshots of your Selenium test in the following two ways:
- Using the Visual Logs capability, BrowserStack Automate can automatically take screenshots during the test run
- Explicitly from your test script as and when required and download the screenshot to your local machine
Automatically capture screenshots
BrowserStack has a Visual Logs feature to take screenshots automatically during your Selenium test without you initiating a screenshot explicitly through test code.
These contain the screenshots that are auto-generated during each Selenium command that your code executes. Visual logs help with debugging the exact step and how the page was rendered when the failure occurred. They also help identify any layout or design related issues with your web pages on different browsers.
Visual logs are disabled by default. You can enable them by using the browserstack.debug capability.
| Capability | Description | Expected values |
|---|---|---|
browserstack.debug |
Enable visual logs | A string. Defaults to false true if you want to enable the visual logs. false otherwise. |
For example, this is how you enable visual logs:
// Enabling visual logs
DesiredCapabilities caps = new DesiredCapabilities();
caps.setCapability("browserstack.debug", "true");
// Enabling visual logs
var capabilities = {
"browserstack.debug" : "true"
}
// Enabling visual logs
DesiredCapabilities caps = new DesiredCapabilities();
caps.SetCapability("browserstack.debug", "true");
# Enabling visual logs
$caps = array(
"browserstack.debug" => "true"
);
# Enabling visual logs
capabilities = {
"browserstack.debug" : "true"
}
# Enabling visual logs
caps = Selenium::WebDriver::Remote::Capabilities.new
caps["browserstack.debug"] = "true"
# Enabling visual logs
my $capabilities = {
"browserstack.debug" => "true"
}
Take screenshot from test script explicitly
You can choose when to take a screenshot from your test script and also save these screenshots to the machine that runs the automated tests. If you are on a CI/CD setup, make sure you transfer these screenshots before you wind down the machine.
Here is how you take a screenshot and save it to your machine:
// Import the relevant packages
// ... your test code
// Take a screenshot and save it to /location/to/screenshot.png
driver = (RemoteWebDriver) new Augmenter().augment(driver);
File srcFile = (File) ((TakesScreenshot) driver).getScreenshotAs(OutputType.FILE);
FileHandler.copy(srcFile, new File("/location/to/screenshot.png"));
// ... your test code
var fs = require('fs');
webdriver.WebDriver.prototype.saveScreenshot = function(filename) {
return driver.takeScreenshot().then(function(data) {
fs.writeFile(filename, data.replace(/^data:image\/png;base64,/,''), 'base64', function(err) {
if(err) throw err;
});
})
};
driver.saveScreenshot('snapshot1.png')
using System;
using OpenQA.Selenium;
using OpenQA.Selenium.Remote;
namespace SeleniumTest
{
public class ScreenShotRemoteWebDriver : RemoteWebDriver, ITakesScreenshot
{
public ScreenShotRemoteWebDriver(Uri uri, OpenQA.Selenium.Chrome.ChromeOptions dc)
: base(uri, dc)
{
}
public new Screenshot GetScreenshot()
{
Response screenshotResponse = this.Execute(DriverCommand.Screenshot, null);
string base64 = screenshotResponse.Value.ToString();
return new Screenshot(base64);
}
}
class Program
{
static void Main(string[] args)
{
ScreenShotRemoteWebDriver driver;
//IWebDriver driver;
OpenQA.Selenium.Chrome.ChromeOptions capability = new OpenQA.Selenium.Chrome.ChromeOptions();
capability.AddAdditionalCapability("os_version", "10", true);
capability.AddAdditionalCapability("resolution", "1920x1080", true);
capability.AddAdditionalCapability("browser", "Chrome", true);
capability.AddAdditionalCapability("browser_version", "latest-beta", true);
capability.AddAdditionalCapability("os", "Windows", true);
capability.AddAdditionalCapability("name", "Take Screenshot Sample Test", true); // test name
capability.AddAdditionalCapability("build", "Screenshot Test Build", true); // CI/CD job or build name
capability.AddAdditionalCapability("browserstack.user", "YOUR_USERNAME", true);
capability.AddAdditionalCapability("browserstack.key", "YOUR_ACCESS_KEY", true);
driver = new ScreenShotRemoteWebDriver(
new Uri("https://hub-cloud.browserstack.com/wd/hub/"), capability
);
driver.Navigate().GoToUrl("https://www.google.com/ncr");
Console.WriteLine(driver.Title);
IWebElement query = driver.FindElement(By.Name("q"));
query.SendKeys("Browserstack");
query.Submit();
Console.WriteLine(driver.Title);
ITakesScreenshot screenshotDriver = driver as ITakesScreenshot;
Screenshot screenshot = screenshotDriver.GetScreenshot();
screenshot.SaveAsFile("/your/full/screenshot/path/ss.png", OpenQA.Selenium.ScreenshotImageFormat.Png);
driver.Quit();
}
}
}
file_put_contents('screenshot.png', $web_driver->takeScreenshot());
driver.save_screenshot('screenshots.png')
driver.save_screenshot("screenshots.png")
open(FH,'>','screenshot.png');
binmode FH;
my $png_base64 = $driver->screenshot();
print FH MIME::Base64::decode_base64($png_base64);
close FH;
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
