如何用F#库天棚测试UI

本文将详细解释如何使用F#库天棚进行UI测试。边肖觉得挺实用的，分享给大家参考。希望你看完这篇文章能有所收获。

InfoQ：你能否为我们介绍一下canopy？

Chris Holt:canopy是基于Selenium的一层功能，用F#实现。它的目标是让UI测试的行为满足用户的期望。硒的表现不错，但有时似乎太死板了。在canopy中，所有行为不再因为不能单击某个元素而立即报告错误，而是继续尝试单击某个元素，直到一段合理的时间后不能单击。这将帮助您创建更可靠的测试，而不是通常只在第一次尝试时成功的测试。

InfoQ：canopy如何简化通过Selenium进行UI测试的过程？

CH: Canopy内置重试功能，包括元素的获取和用户在屏幕上的行为，以及验证功能。此外，canopy还可以通过实用的错误信息帮助用户修复一些常见问题，例如选择器的拼写错误。它还支持多种方式选择元素，并且很容易扩展这些功能。

例如，如果用户的屏幕上有一个显示“保存”二字的按钮，只需要在代码中写上“点击‘保存’”即可达到点击的目的。在传统的Selenium代码中，用户必须在ByText、ById、ByCSS、ByXPath等方法中进行选择。如果想要扩展这个功能，只需要针对用户网页惯用的方式，添加相应的finder实现，比如表单数据中的占位符值或者人工定义的data-*标记来表示元数据。

Canopy还提供了一个简洁的API，让用户更容易读写测试。它还可以克服html中的各种差异。例如，每个输入类型在html中都有不同的表达式，因此通过原始Selenium操作它们的方式也是不同的。在雨棚里，操作方式是一样的。例如：

//assignavaluetatotextbox ordropdown

#州' '纽约'

InfoQ：canopy是否支持与外部自动化服务的集成，例如Browserstack？

CH:对，只要是硒元素支持的功能，天棚也支持。为了支持Browserstack，用户需要使用RemoteWebdriver。因为canopy本身有很多内置的重试功能，所以交互的次数会增加。但是，因为用户不必频繁调用Sleep，所以这种增加的交互是可以接受的。Canopy还提供了许多可选的优化方法，如果您打算指定选择器的类型，而不是让canopy分析您的选择器类型，则可以应用这些方法。

InfoQ：在页面中选择元素有没有推荐的做法？比方说，通过id选择元素是否会为测试带来更好的可维护性与健壮性？

CH:UI自动化使用的“技能”大部分都与选择元素有关。我们需要在是否应该使用整洁的选择器或者是否必须向标签添加类或id等属性之间找到平衡。在我看来，CSS和JQuery选择器的语法是最好的，用户可以在80-90%的场景中使用这种方法。剩下的10%-20%场景可以使用XPath。精确的文本匹配或查找元素的父元素需要XPath。按值或内部文本搜索也非常方便。如果上面提到的点击“保存”的例子，它的内部实现使用XPath。

经过一段时间的练习，用户可以熟练掌握创建选择器的方法。工程师建议用户通过实践来学习，而不是使用一些工具来生成选择器。这种方法更准确，当页面结构发生变化，影响用户测试时，更容易纠正。一旦用户对选择器有了一些经验，他们就会知道如何使html代码更容易维护，从而简化选择器的创建。

选择器在某些方面可以变得更容易理解。例如，选择器#头。links表示页面标题div中的所有link元素。在自动生成的XPath中，可能会变成HTML/body/div/div/div[2]/ul/Li/a，这对理解其含义毫无帮助。此外，如果在这个选择链中添加或删除div，选择器将不起作用。由CSS编写的选择器总是有效的，除非有人更改了id头或者删除/更改了类链接。

InfoQ：用户是否可以自定义错误报告？比方说，我们是否能够在测试失败时自动截屏呢？

Ch: Canopy目前有三个内置的报告器实现，即ConsoleRepo。

rter、TeamCityReporter和HtmlReporter。如果用户需要新增一个自定义的功能，只需简单地实现IReporter这个接口就行了。

InfoQ：有哪些方法能够扩展canopy的功能？

1）通过实现IReporter接口，自定义测试结果的输出。

2) 在canopy所使用的finder集合中添加新的通用finder实现，以帮助用户找到页面元素。

3) 为用户常用的action添加新的函数。由于F#会运行某个函数最新定义的版本，因此用户还能够“重写”现有的函数，以满足自身的需求。

比方说，用户可以实现自定义的“click”功能，只需创建一个模块，例如“canopyExtensions”，并在“打开canopy”操作后“打开”这一模块，将所有扩展方法与重写的方法定义在其中。这样一来，所有测试都会调用由用户所定义的功能，而无需改动任何现有的功能。

这个示例表现的是某人希望能够在多选框中实现对元素的Ctrl+Click操作。由于canopy本身不具备这一特性，因此作者编写了一段扩展方法。

4) canopy并没有隐藏任何Selenium中的特性，或是对其进行抽象化。它只是使用了IWebDriver与IWebElement接口。用户在Stack      
overflow网站上看到的各种问题与回复对canopy都是100%有效的。用户所要做的唯一一件事就是将代码转换为F#。

InfoQ：在持续集成（CI）服务器上运行canopy测试需要经过哪些步骤？

CH：测试的运行方式是执行由构建过程所生成的控制台应用。测试结果支持不同的输出格式。支持TeamCity的配置过程只需一行代码：

reporter <- new TeamCityReporter() :> IReporter

 

我个人会选择使用一些简单的任务来实现整个构建过程，因此我在TeamCity中创建的任务都是很简单的，例如从源代码控制系统中获取最新代码，随后通过一个命令行语句启动我的任务，并完成其余工作。

在Jenkins环境中，我会选用HtmlReporter，通过一个Jenkins的插件生成html文档，并保存到整个任务的结果中。这同样也可以通过简短的几行代码完成设置工作。

关于“如何利用F#库canopy进行UI测试”这篇文章就分享到这里了，希望