Transform your testing process with: Real Device Features, Company-wide Licences, & Test Observability
No Result Found

Take screenshots

Take screenshots at different points in your Selenium test

You can take screenshots of your Selenium test in the following two ways:

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.

Taking screenshots using the Visual Logs capability is currently not supported on BrowserStack’s macOS Snow Leopard and Lion computers.

Visual Logs would be visible in the Automate dashboard only. If you want to download the screenshots to your local machine, then please take a screenshot explicitly from your test script.

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 debug capability.

If you are using BrowserStack SDK, you can set the following capabilities in the browserstack.yml file:

browserstack.yml
Copy icon Copy

You can use either Selenium 4 or Selenium Legacy JSON to organize your tests.

BrowserStack SDK is a plug-n-play solution that takes care of all the integration steps for you. Using the BrowserStack SDK is the recommended integration method for your project. To know more, visit the SDK core concepts page.

Capability Description Expected values
debug Enable visual logs A string. Defaults to false

true if you want to enable the visual logs. false otherwise.

Use the following code snippet to enable visual logs:

// Enabling visual logs

DesiredCapabilities capabilities = new DesiredCapabilities();
HashMap<String, Object> browserstackOptions = new HashMap<String, Object>();
browserstackOptions.put("debug", "true");
capabilities.setCapability("bstack:options", browserstackOptions);

// Enabling visual logs

var capabilities = {
 	'bstack:options' : {
 		"debug" : "true",
 	}
 }

// Enabling visual logs

Dictionary<string, object> browserstackOptions = new Dictionary<string, object>();
 browserstackOptions.Add("debug", "true");
 capabilities.AddAdditionalOption("bstack:options", browserstackOptions);

# Enabling visual logs

$caps = array(
 	'bstack:options' => array(
 		"debug" => "true",
 	)
 )

# Enabling visual logs

desired_cap = {
 	'bstack:options' : {
 		"debug" : "true"
 	}
 }

# Enabling visual logs

capabilities = {
 	'bstack:options' => {
 		"debug" => "true",
 	}
 }
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.

Use the following code snippet to 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"

Take screenshot from test script explicitly

You can choose to take a screenshot from your test script and either save it to your local machine or only display it in session’s text logs:

Take screenshot and download it to your local machine

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')

Response screenshotResponse = this.Execute(DriverCommand.Screenshot, null);
string base64 = screenshotResponse.Value.ToString();
return new Screenshot(base64);

file_put_contents('screenshot.png', $web_driver->takeScreenshot());

driver.save_screenshot('screenshots.png')

driver.save_screenshot("screenshots.png")

Take screenshot and display it on session’s text logs

You can choose when to take a screenshot from your test script and only display them in the session’s text logs.

Here is how you take a screenshot and show it in text logs:

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;
import org.openqa.selenium.OutputType;
import java.net.URL;
public class camera {
  public static final String AUTOMATE_USERNAME = "YOUR_USERNAME";
  public static final String AUTOMATE_ACCESS_KEY = "YOUR_ACCESS_KEY";
  public static final String URL = "https://" + AUTOMATE_USERNAME + ":" + AUTOMATE_ACCESS_KEY + "@hub-cloud.browserstack.com/wd/hub";
  public static void main(String[] args) throws Exception {
    DesiredCapabilities capabilities = new DesiredCapabilities();
    capabilities.setCapability("browserName", "Chrome");
    capabilities.setCapability("browserVersion", "103.0");
    HashMap<String, Object> browserstackOptions = new HashMap<String, Object>();
    browserstackOptions.put("os", "Windows");
    browserstackOptions.put("osVersion", "10");
    browserstackOptions.put("projectName", "Take Screenshot Sample Test");
    browserstackOptions.put("buildName", "Take Screenshot Sample Build");
    browserstackOptions.put("local", "false");
    browserstackOptions.put("seleniumVersion", "4.0.0");
    capabilities.setCapability("bstack:options", browserstackOptions);

    WebDriver driver = new RemoteWebDriver(new URL(URL), caps);
    driver = (RemoteWebDriver) new Augmenter().augment(driver);
    ((TakesScreenshot) driver).getScreenshotAs(OutputType.FILE);
    driver.get("https://www.google.com");
    driver.quit();
  }
}

const webdriver = require('selenium-webdriver');
const fs = require('fs');
// Input capabilities
var capabilities = {
	'bstack:options' : {
		"os" : "Windows",
		"osVersion" : "10",
		"projectName" : "Take Screenshot Sample Test",
		"buildName" : "Take Screenshot Sample Build",
		"local" : "false",
		"seleniumVersion" : "4.0.0",
		"userName" : "YOUR_USERNAME",
		"accessKey" : "YOUR_ACCESS_KEY",
	},
	"browserName" : "Chrome",
	"browserVersion" : "103.0",
}
async function runTestWithCaps () {
let driver = new webdriver.Builder()
    .usingServer('https://hub-cloud.browserstack.com/wd/hub')
    .withCapabilities(capabilities)
    .build();
  await driver.get("https://www.google.com");
  await driver.takeScreenshot()
  await driver.quit();
}
runTestWithCaps();  

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;
            ChromeOptions capabilities = new ChromeOptions();
            capabilities.BrowserVersion = "103.0";
            Dictionary<string, object> browserstackOptions = new Dictionary<string, object>();
            browserstackOptions.Add("os", "Windows");
            browserstackOptions.Add("osVersion", "10");
            browserstackOptions.Add("projectName", "Take Screenshot Sample Test");
            browserstackOptions.Add("buildName", "Take Screenshot Sample Build");
            browserstackOptions.Add("local", "false");
            browserstackOptions.Add("seleniumVersion", "4.0.0");
            browserstackOptions.Add("userName", "YOUR_USERNAME");
            browserstackOptions.Add("accessKey", "YOUR_ACCESS_KEY");
            capabilities.AddAdditionalOption("bstack:options", browserstackOptions);
            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();

            driver.Quit();
        }
    }
}

<?php
  require_once('vendor/autoload.php');
  use Facebook\WebDriver\Remote\RemoteWebDriver;
  use Facebook\WebDriver\WebDriverBy;
  $caps = array(
    'bstack:options' => array(
      "os" => "Windows",
      "osVersion" => "10",
      "projectName" => "Take Screenshot Sample Test",
      "buildName" => "Take Screenshot Sample Build",
      "local" => "false",
      "seleniumVersion" => "4.0.0",
    ),
    "browserName" => "Chrome",
    "browserVersion" => "103.0",
  )

  $web_driver = RemoteWebDriver::create(
    "https://YOUR_USERNAME:YOUR_ACCESS_KEY@hub-cloud.browserstack.com/wd/hub",
    $caps
  );
  # Searching for 'BrowserStack' on google.com
  $web_driver->get("https://google.com");
  file_put_contents('screenshot.png', $web_driver->takeScreenshot());
  $web_driver->quit();
?>

from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.common.desired_capabilities import DesiredCapabilities
from selenium.common.exceptions import TimeoutException
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
desired_cap = {
	'bstack:options' : {
		"os" : "Windows",
		"osVersion" : "10",
		"projectName" : "Take Screenshot Sample Test",
		"buildName" : "Take Screenshot Sample Build",
		"local" : "false",
		"seleniumVersion" : "4.0.0",
	},
	"browserName" : "Chrome",
	"browserVersion" : "103.0",
}

driver = webdriver.Remote(
    command_executor='https://YOUR_USERNAME:YOUR_ACCESS_KEY@hub-cloud.browserstack.com/wd/hub',
    desired_capabilities=desired_cap)
driver.get("https://www.google.com")
driver.save_screenshot('screenshots.png')
driver.quit()

require 'rubygems'
require 'selenium-webdriver'
# Input capabilities
capabilities = {
	'bstack:options' => {
		"os" => "Windows",
		"osVersion" => "10",
		"projectName" => "Take Screenshot Sample Test",
		"buildName" => "Take Screenshot Sample Build",
		"local" => "false",
		"seleniumVersion" => "4.0.0",
	},
	"browserName" => "Chrome",
	"browserVersion" => "103.0",
}
driver = Selenium::WebDriver.for(
    :remote,
    :url => "https://YOUR_USERNAME:YOUR_ACCESS_KEY@hub-cloud.browserstack.com/wd/hub",
    :capabilities => capabilities
)
# Searching for 'BrowserStack' on google.com
driver.navigate.to "https://www.google.com"
driver.save_screenshot("screenshots.png")
driver.quit

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;
import org.openqa.selenium.OutputType;
import java.net.URL;
public class camera {
  public static final String AUTOMATE_USERNAME = "YOUR_USERNAME";
  public static final String AUTOMATE_ACCESS_KEY = "YOUR_ACCESS_KEY";
  public static final String URL = "https://" + AUTOMATE_USERNAME + ":" + AUTOMATE_ACCESS_KEY + "@hub-cloud.browserstack.com/wd/hub";
  public static void main(String[] args) throws Exception {
    DesiredCapabilities caps = new DesiredCapabilities();
    caps.setCapability("os_version", "10");
    caps.setCapability("resolution", "1920x1080");
    caps.setCapability("browser", "Chrome");
    caps.setCapability("browser_version", "88.0");
    caps.setCapability("os", "Windows");
    caps.setCapability("name", "BStack-[Java] Sample Test"); // test name
    caps.setCapability("build", "BStack Build Number 1"); // CI/CD job or build name
    WebDriver driver = new RemoteWebDriver(new URL(URL), caps);
    driver = (RemoteWebDriver) new Augmenter().augment(driver);
    ((TakesScreenshot) driver).getScreenshotAs(OutputType.FILE);
    driver.get("https://www.google.com");
    driver.quit();
  }
}

const webdriver = require('selenium-webdriver');
const fs = require('fs');
// Input capabilities
const capabilities = {
  'browserName' : 'Chrome',
  'browser_version' : '88.0',
  'os' : 'Windows',
  'os_version' : '10',
  'name': 'BStack-[NodeJS] Sample Test', // test name
  'build': 'BStack Build Number 1' // CI/CD job or build name
}
async function runTestWithCaps () {
  let driver = new webdriver.Builder()
    .usingServer('https://YOUR_USERNAME:YOUR_ACCESS_KEY@hub-cloud.browserstack.com/wd/hub')
    .withCapabilities(capabilities)
    .build();
  await driver.get("https://www.google.com");
  await driver.takeScreenshot()
  await driver.quit();
}
runTestWithCaps();  

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();

            driver.Quit();
        }
    }
}

<?php
  require_once('vendor/autoload.php');
  use Facebook\WebDriver\Remote\RemoteWebDriver;
  use Facebook\WebDriver\WebDriverBy;
  $caps = array(
    "browser" => "Chrome",
    "browser_version" => "88.0",
    "realMobile" => "true",
    "os" => "Windows",
    "os_version" => "10",
    "name" => "BStack-[Php] Sample Test", // test name
    "build" => "BStack Build Number 1" // CI/CD job or build name
  );
  $web_driver = RemoteWebDriver::create(
    "https://YOUR_USERNAME:YOUR_ACCESS_KEY@hub-cloud.browserstack.com/wd/hub",
    $caps
  );
  # Searching for 'BrowserStack' on google.com
  $web_driver->get("https://google.com");
  file_put_contents('screenshot.png', $web_driver->takeScreenshot());
  $web_driver->quit();
?>

from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.common.desired_capabilities import DesiredCapabilities
from selenium.common.exceptions import TimeoutException
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
desired_cap = {
 'browser': 'Chrome',
 'browser_version': '88.0',
 'os': 'Windows',
 'os_version': '10',
 'name': 'BStack-[Python] Sample Test', # test name
 'build': 'BStack Build Number 1' # CI/CD job or build name
}
options.set_capability('bstack:options', desired_cap)
driver = webdriver.Remote(
    command_executor='https://hub-cloud.browserstack.com/wd/hub',
    options=options)
    
driver.get("https://www.google.com")
driver.save_screenshot('screenshots.png')
driver.quit()

require 'rubygems'
require 'selenium-webdriver'
# Input capabilities
caps = Selenium::WebDriver::Remote::Capabilities.new
caps['os'] = 'Windows'
caps['os_version'] = '10'
caps['browser'] = 'Chrome'
caps['browser_version'] = '88.0'
caps['name'] = 'BStack-[Ruby] Sample Test' # test name
caps['build'] = 'BStack Build Number 1' # CI/CD job or build name
driver = Selenium::WebDriver.for(:remote,
  :url => "https://YOUR_USERNAME:YOUR_ACCESS_KEY@hub-cloud.browserstack.com/wd/hub",
  :desired_capabilities => caps)
# Searching for 'BrowserStack' on google.com
driver.navigate.to "https://www.google.com"
driver.save_screenshot("screenshots.png")
driver.quit

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.

We're continuously improving our docs. We'd love to know what you liked





Thank you for your valuable feedback

  • ON THIS PAGE

    Is this page helping you?

    Yes
    No

    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.

    We're continuously improving our docs. We'd love to know what you liked





    Thank you for your valuable feedback!

    Talk to an Expert
    Download Copy Check Circle