.takeElementScreenshot() Suggest edits

Since: 2.0.0

Take a screenshot of the visible region encompassed by this element's bounding rectangle.

Usage

.takeElementScreenshot(selector, [callback])
.takeElementScreenshot(using, selector, [callback])

Example

module.exports = {
  demoTest(browser) {
    browser.takeElementScreenshot('#main', function (imageData, err) {
      require('fs').writeFile('out.png', imageData.value, 'base64', function (err) {
        console.log(err);
      });
    });

    // with explicit locate strategy
    browser.takeElementScreenshot('css selector', '#main', function(imageData, err) {
      require('fs').writeFile('out.png', imageData.value, 'base64', function (err) {
        console.log(err);
      });
    });

    // with selector object - see https://nightwatchjs.org/guide#element-properties
    browser.takeElementScreenshot({
      selector: '#main ul li a',
      index: 1
    }, function(imageData, err) {
      require('fs').writeFile('out.png', imageData.value, 'base64', function (err) {
        console.log(err);
      });
    });
  },

  demoTestAsync: async function(browser) {
    const data = await browser.takeElementScreenshot('#main');
    require('fs').writeFile('out.png', data, 'base64');
  }
}

Parameters

Name Type description
using
Optional		 string

The locator strategy to use. See W3C Webdriver - locator strategies
selector string

The CSS/Xpath selector used to locate the element.
callback function

Callback function which is called with the result value.

Returns

Type description
string Take a screenshot of the visible region encompassed by this element's bounding rectangle.

W3C WebDriver spec