8

我没有多少资源可以对包含数百个不同网页的许多项目进行测试,最乏味的部分是验证网站的外观是否正常。特别是 HTML 元素的布局没有被破坏。

有没有办法通过不开发高度复杂的人工智能工具来自动化这样的测试?:)

4

8 回答 8

19

尽管这个问题已有两年之久,但我认为该领域已经有了巨大的飞跃,这证明了更新答案的合理性。

有许多工具可让您对 Web/移动应用程序执行自动化可视化测试,从而节省宝贵的时间。这些工具在几个方面有所不同:

  1. 视觉比较的类型:无论是像素到像素、基于阈值还是更复杂的算法。
  2. 自动化:其中一些工具与现有的自动化框架集成,例如Selenium/Webdriver,其他工具使用他们自己的专有自动化框架。
  3. 开源/商业。

以下是工具的部分列表及其描述:

  1. Applitools Eyes - My personal favourite, and IMHO the best and most advanced tool out there by far. It's a commercial tool, but it also has a free plan. Since this tool is aimed to visual testing as a human would, its comparison engine does all the work for you and does not require you to define any thresholds or mark parts of the screen or anything like that. Test maintenance is done via a web application, and provides very powerful maintenance features (automatic identification of similar changes across different steps etc.) which I haven't encountered in any other tool. It has SDKs for Selenium (Java/Python/Ruby/Javascript), Appium, Protractor, and more, and even an Extension which allows you to perform tests without any coding at all.
  2. WebdriverCSS - An open source tool which is based on WebdriverIO (A Selenium wrapper written in Javascript). It uses GraphicsMagick for comparing images, and you can define a threshold from which images are considered different. If you're already using WebDriverIO it's super easy to add visual checkpoints to your tests.
  3. Sikuli - An open source tool with a proprietary automation framework based on the visual elements in the screen.

There are actually quite a few more tools, such as PhantomCSS, Huxley, dpxdt and more.

于 2014-12-23T13:05:05.337 回答
5

我将在 Arran 的评论中加入我的投票,即虽然您/可以/这样做,但您可能应该/不/将宝贵的时间花在这上面。我基于多年来在许多不同工具中围绕 UI 自动化工作,包括 Watir、WebDriver、Selenium RC、Visual Studio 和 Telerik 的 Test Studio。

当您只是尝试进行功能测试时,UI 自动化既困难又脆弱。尝试自动化外观和感觉来验证 CSS、布局定位、图像外观等是非常脆弱的——即使是浏览器之间的最小差异和 UI 的最小更改也会让您花费大量时间来更新失败的测试。

是的,这是可能的。但是,通过将自动化工作集中在功能上来保持理智。将视觉检查留给最快、最简单的工具:人眼。

更新:请务必阅读 dcoder 的回复。他/她是绝对正确的。该领域已经取得了一些重大(早该!)的进步。您需要评估这些工具是否适合。

于 2012-10-29T19:53:45.040 回答
2

有一个 YouTube 视频可以很好地解决这个问题:来自 Google Developers Live的安全持续部署的秘密。在视频中, Breett Slatkin教我们如何使用视觉差异进行“外观和感觉”测试。

我希望这可以帮助你。

于 2013-07-04T02:12:43.420 回答
1

你可以这样做,虽然它的麻烦多于它的价值:

编写一个脚本来测试每个元素的宽度/高度/xy 位置是否等于元素的某些定义值。

于 2012-10-26T15:46:50.807 回答
1

我也支持布局图像外观徽标的 UI 自动化的观点,例如。我有很多这样的情况,其中基于登录类型等显示特定的 ui 元素,但投资是乏味的,改变可能会适得其反

于 2012-10-30T10:03:19.150 回答
0

嗨,要自动化网络浏览器,您可以使用 selenium (http://seleniumhq.org/) 例如查看用户单击的位置等...要验证 html,您可以找到一个接受一批页面并通过验证运行它们的验证器... 像http://www.htmlhelp.com/tools/validator/或类似的东西

希望有帮助

于 2012-10-26T15:45:35.717 回答
0

Selenium 可用于检查网站的外观。

使用验证,断言命令来测试这个

此外,QTP 也可以用于相同的目的。

于 2012-11-22T16:26:21.577 回答
0

您为什么不尝试图像比较,尝试捕获屏幕截图并将其与存档图像进行比较。 C# - 捕获活动窗口的屏幕截图

于 2014-04-03T20:34:54.703 回答