Возьмите элемент скриншота с селеном?

Question

Кто-нибудь знает, что сделал скриншот 1 элемент веб-страницы и преобразовал его в base64 в javascript?

Answer 1

var webdriver = require('selenium-webdriver'); 
var driver = new webdriver.Builder().usingServer('http://localURL:4444/wd/hub').withCapabilities({'browserName': 'chrome'}).build(); 
//driver.get([URL to webserver on my local machine]) 
driver.findElement(webdriver.By.xpath('//img[@id="tree_image0358"]')); 
driver.takeScreenshot("c:\\selenium_local_map\\out1.png"); 

driver.takeScreenshot().then(
    function(image, err) { 
     require('fs').writeFile('out.png', image, 'base64', function(err { 
      console.log(err); 
     }); 
    } 
); 

Answer 2

Это не мой ответ: Скопировано здесь: How to capture the screenshot of a specific element rather than entire page using Selenium Webdriver?

В Node.js, я написал следующий код, который работает, но она не основана на официальных WebDriverJS Селен, но на основе WebDriver SauceLabs'S: WD.js и очень компактную библиотеку изображений под названием EasyImage.

Я просто хочу подчеркнуть, что вы действительно не можете сделать снимок экрана, но то, что вы должны сделать, это сначала сделать снимок экрана всей страницы, затем выбрать часть страницы, которая вам нравится, и обрезать эту конкретную часть:

browser.get(URL_TO_VISIT) 
     .waitForElementById(dependentElementId, webdriver.asserters.isDisplayed, 3000) 
     .elementById(elementID) 
     .getSize().then(function(size) { 
      browser.elementById(elementID) 
        .getLocation().then(function(location) { 
         browser.takeScreenshot().then(function(data) { 
          var base64Data = data.replace(/^data:image\/png;base64,/, ""); 
          fs.writeFile(filePath, base64Data, 'base64', function(err) { 
           if (err) { 
            console.log(err); 
           } 
           else { 
            cropInFile(size, location, filePath); 
           } 
           doneCallback(); 
         }); 
        }); 
       }); 
      }); 

И cropInFileFunction, выглядит следующим образом:

var cropInFile = function(size, location, srcFile) { 
    easyimg.crop({ 
      src: srcFile, 
      dst: srcFile, 
      cropwidth: size.width, 
      cropheight: size.height, 
      x: location.x, 
      y: location.y, 
      gravity: 'North-West' 
     }, 
     function(err, stdout, stderr) { 
      if (err) throw err; 
     }); 
};