使用Selenium和Firefox重现的屏幕截图

Question

我使用Selenium使用firefox Web驱动程序自动执行一些GUI测试。

在我看来，在测试运行期间创建屏幕截图以使用手册中的屏幕截图也是有意义的。

我的应用程序的屏幕是相对静态的 - 没有时间戳可见，等等。所以我的期望是，如果我创建一个截图，让我们说起始页面，稍后导航到起始页面，屏幕截图应该是相同的。此外，如果我运行测试两次，则两个运行之间的起始页面的屏幕截图应该相同。

我将屏幕截图保存为PNG，我甚至在保存之前处理屏幕截图（保存没有日期），以便文件应该完全相同。

然而，如果我将图片彼此进行比较（例如将它们相互减去），它们之间（肉眼不可见），桌子边界处的某些微弱线条或字体周围存在细微差别。

我的问题：

1）为什么会有差异？

2）确保屏幕截图相同的最简单方法是什么？ （我可以做什么样的后期处理）

PS：我也尝试将渲染器从skia更改为windows到cairo，但是虽然差异略有不同，但仍然无法解决问题。

Answer 1

你如何保存图像？

在红宝石中，我使用的是这样的东西？

def take_screenshot(image_id)
  scenario = Zpg::HooksHelper::FeatureHelper.scenario_name
  Dir.mkdir('output', 0o777) unless File.directory?('output')
  Dir.mkdir('output/screenshots', 0o777) unless File.directory?('output/screenshots')
  screenshot = "./output/screenshots/#{image_id}#{scenario.tr(' ', '_').gsub(/[^0-9A-Za-z_]/, '')}.png"
  if page.driver.browser.respond_to?(:save_screenshot)
    page.driver.browser.save_screenshot(screenshot)
  else
    save_screenshot(screenshot)
  end
  FileUtils.chmod(0o777, screenshot)
end

而我正在检查图像差异

    # return[hash]
    def image_diff(imageid_1 = nil, _imageid_2 = nil)
      scenario = Zpg::HooksHelper::FeatureHelper.scenario_name
      if imageid_1.class != Integer
        image_1 = "./features/support/data/images/#{Zpg.brand}/#{imageid_1}.png"
        image_2 = "./output/screenshots/#{_imageid_2}#{scenario.tr(' ', '_').gsub(/[^0-9A-Za-z_]/, '')}.png"
      else
        image_1 = "./output/screenshots/#{imageid_1}#{scenario.tr(' ', '_').gsub(/[^0-9A-Za-z_]/, '')}.png"
        image_2 = "./output/screenshots/#{_imageid_2}#{scenario.tr(' ', '_').gsub(/[^0-9A-Za-z_]/, '')}.png"
      end
      images = [
          ChunkyPNG::Image.from_file(image_1),
          ChunkyPNG::Image.from_file(image_2)
      ]

      diff = []

      images.first.height.times do |y|
        images.first.row(y).each_with_index do |pixel, x|
          diff << [x, y] unless pixel == images.last[x, y]
        end
      end
      puts "pixels (total):     #{images.first.pixels.length}"
      puts "pixels changed:     #{diff.length}"
      puts "pixels changed (%): #{(diff.length.to_f / images.first.pixels.length) * 100}%"

      # init empty hash
      diff_hash = {}
      # return pixels changed number
      diff_hash[:pixels_changed] = diff.length
      # return pixels changed percentage
      diff_hash[:pixels_changed_percentage] = (diff.length.to_f / images.first.pixels.length) * 100
      # return diff hash
      diff_hash
    end

如果浏览器DOM未加载100％，您可以获得不同的结果。我会尝试一个阈值，我期望我的图像。

这里有一个非常好的项目.Net https://www.codeproject.com/Articles/374386/Simple-image-comparison-in-NET你可以用你想要的任何语言进行转换。