Question

我正在尝试为页面构建一个线束，以便我们可以针对它编写测试。我希望能够做的是使用CSS选择器来查找给定的元素，而不是手动修改SearchProperties或FilterProperties。对于Web测试，CSS Selector似乎比SearchProperties更直观。是否有一些机制可以做到这一点，我根本没有看到？

Answer 1

试试这个......

https://github.com/rpearsondev/CodedUI.jQueryExtensions/

它将扩展方法添加到BrowserWindow对象...

var example1 = browser.JQuerySelect<HtmlHyperlink>('a.class1');
var example2 = browser.JQuerySelect<HtmlListItem>('li.class2');

但是，我会告诉您我遇到的问题是抱怨经常出错。

Answer 2

正如sjdirect所指出的，如果你想使用那些类型的选择器，jQuery扩展可能就是这样。

但是，似乎您可能对某些抽象感兴趣，它不需要直接在UITestControl对象上设置搜索/过滤器属性。

有很好的抽象不使用与jQuery相同的选择器，但是提供了一种可读的，一致的方法来查找页面中的元素并与它们进行交互。

我建议您同时查看Code First和CodedUI Fluent（我写了流利的扩展名）或CodedUI Enhanced（CUITe）。

这些提供查询支持（来自CUITe）：

// Launch the web browser and navigate to the homepage
BrowserWindowUnderTest browserWindow = BrowserWindowUnderTest.Launch("https://website.com");

// Enter the first name
browserWindow.Find<HtmlEdit>(By.Id("FirstName")).Text = "John";

// Enter the last name
browserWindow.Find<HtmlPassword>(By.Id("LastName")).Text ="Doe";

// Click the Save button
browserWindow.Find<HtmlInputButton>(By.Id("Save")).Click();

Answer 3

尝试使用browserWindow.executeJavascript，如果返回通过css / xpath找到的控件，则返回相关的uiControl对象

const string javascript = "document.querySelector('{0}');";
var bw = BrowserWindow.Launch(new Uri("http://rawstack.azurewebsites.net"));
string selector = "[ng-model='filterOptions.filterText']";
var control = bw.ExecuteScript(string.Format(javascript,selector));
HtmlEdit filter= control as HtmlEdit;
filter.Text = "Alien";

编码的UI：通过CSS Selector查找元素

3 个答案: