我正在努力寻找解决方案，尝试了很多选择。
我的理想目标是能够截图
- 抓取特定的 CSS 元素
- 抓取元素的全高（即使长于页面高度）
- 等待包含的任何资产已完全加载
- 快速地
第一次尝试（使用安装了 chromedriver 的 selenium-webdriver）
宝石文件
gem 'selenium-webdriver'
应用程序.rb
require 'selenium-webdriver'
driver = Selenium::WebDriver.for :chrome
driver.get url
driver.save_screenshot("screenshot.png")
这在一定程度上有效，但屏幕截图被修剪到最大高度（这看起来像是 Chromedriver https://code.google.com/p/chromedriver/issues/detail?id=294的一个非常老的问题）
第二次尝试（使用 poltergeist 改为切换到 phantomjs）
宝石文件
gem 'capybara'
gem 'poltergeist'
应用程序.rb
require "capybara/dsl"
require "capybara/poltergeist"
Capybara.run_server = false
Capybara.register_driver :poltergeist do |app|
Capybara::Poltergeist::Driver.new(app, {
# Raise JavaScript errors to Ruby
js_errors: true,
# Additional command line options for PhantomJS
phantomjs_options: ['--ignore-ssl-errors=yes', '--ssl-protocol=any'],
})
end
Capybara.current_driver = :poltergeist
class Screenshot
include Capybara::DSL
# Captures a screenshot of +url+ saving it to +path+.
def capture(url, path)
# Open page
visit url
if page.driver.status_code == 200
page.driver.save_screenshot(path, :full => true)
puts "screenshot saved"
else
# Handle error
puts "there was a problem #{page.driver.status_code}"
end
end
end
screenshot = Screenshot.new
screenshot.capture url, "screenshot.png"
这有不同的问题，
- 它捕获页面的全长
- 未嵌入 webfonts ( https://github.com/ariya/phantomjs/issues/12132 )
- 视网膜不可用（https://github.com/ariya/phantomjs/issues/10964）
第三次尝试（使用 Capybara 尝试利用 page.save_screenshot(path, :full => true)）
宝石文件
gem 'selenium-webdriver'
gem 'capybara'
应用程序.rb
require 'selenium-webdriver'
require "capybara/dsl"
Capybara.register_driver :chrome do |app|
Capybara::Selenium::Driver.new(app, :browser => :chrome)
end
Capybara.current_driver = :chrome
class Screenshot
include Capybara::DSL
# Captures a screenshot of +url+ saving it to +path+.
def capture(url, path)
# Open page
visit url
page.save_screenshot(path, :full => true)
puts "screenshot saved"
end
end
screenshot = Screenshot.new
screenshot.capture url, "screenshot.png"
短版 - 这无济于事
第四次尝试（使用 Watir）
宝石文件
gem 'watir-webdriver'
应用程序.rb
require 'watir-webdriver'
b = Watir::Browser.new
b.goto url
b.screenshot.save 'screenshot.png'
这可行（启动 Firefox），但在 DevicePixelRatio 上存在相同的问题，因为它无法获取视网膜屏幕截图。
第五次尝试（回到使用 Chrome）
应用程序.rb
require 'watir-webdriver'
b = Watir::Browser.new :chrome
b.goto url
b.screenshot.save './tmp/watir.png'
直接回到裁剪页面的问题。
理想情况下，我认为可能有一种方法可以使用最新 ChromeDriver v2.12 的移动仿真选项来实现这一点
指定单个设备属性
还可以通过指定单个属性来启用移动仿真。要以这种方式启用移动仿真，“mobileEmulation”字典可以包含“deviceMetrics”字典和“userAgent”字符串。必须在“deviceMetrics”字典中指定以下设备指标： “width” - 设备屏幕的宽度（以像素为单位） “height” - 设备屏幕的高度（以像素为单位） “pixelRatio” - 设备的像素比
https://sites.google.com/a/chromium.org/chromedriver/mobile-emulation
但还没有设法让它工作。
任何建议将不胜感激谢谢！