我找到了解決方法,使元素的屏幕截圖周圍元素10px的。
我動態添加新的DOM元素'wrap'並將其放在目標上。
然後我採取換行的截圖。這行得通!
代碼:
result_file = File.expand_path('../tmp/screenshot.jpg', __FILE__)
browser.execute_script %Q(
// add jQuery
(function(){
function getScript(src, callback) {
var fileref = document.createElement('script');
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", src);
if (callback) {
fileref.setAttribute("onload", callback());
}
document.getElementsByTagName("head")[0].appendChild(fileref);
}
getScript('https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js', function(){
$(function() {
var target = $('#{screenshot_target_selector}');
var offset = target.offset();
var wrap = $('<div id="inlinemanual_screenshot_target_selector_wrap"></div>').prependTo('body');
wrap.css({
position: 'absolute',
width: target.outerWidth() + 20,
height: target.outerHeight() + 20,
top: offset.top - 10,
left: offset.left - 10
});
});
});
}())
)
browser.screenshot_element(result_file, '#inlinemanual_screenshot_target_selector_wrap')