c# selenium chrome-webdrive 使用 class 和标题单击按钮
c# selenium chrome-webdrive clicking button using class and title
我只想单击我页面中的按钮。
html 代码看起来像:
<tr ng-repeat="row in rowCollection" ng-class="{ "error-row": row.errorMessage }" ng-style="vm.getColor(row)" class="ng-scope" style="background: rgb(255, 242, 255) none repeat scroll 0% 0%;">
<td class="ng-binding">Wylaczenie nadan RDF</td><td class="ng-binding">WAITING_FOR_NOTIFICATION</td>
<td>
<a href="" ng-click="vm.showProcessDiagram(row.executor)" class="ng-binding">rfsSendingExecutor</a>
</td>
<td class="ng-binding">2017-09-06 11:14:12</td><td class="ng-binding">2017-09-06 11:14:13</td>
<td has-role="REQUEST" class="text-center">
<!-- ngIf: row.inXml || row.outXml -->
<button ng-if="row.inXml || row.outXml" ng-click="vm.showXml(row)" title="Show" class="btn btn-xs ng-scope"><span class="fa fa-code"></span></button>
<!-- end ngIf: row.inXml || row.outXml -->
</td>
<td has-role="ERROR" class="text-center"><button ng-show="row.errorMessage" ng-click="vm.showError(row.errorMessage)" title="Show" class="btn btn-xs ng-hide"><span class="fa fa-search"></span></button></td>
<td class="text-center">
<button ng-show="vm.enableCancel(row)" ng-click="vm.cancelTask(row.workItemId)" title="Cancel" class="btn btn-xs ng-hide">
<span class="fa fa-ban text-warning"></span>
</button>
<button ng-show="vm.enableRepeat(row)" ng-click="vm.repeatTask(row.id)" title="Repeat" class="btn btn-xs ng-hide">
<span class="fa fa-refresh text-success"></span>
</button>
<button ng-show="vm.enableRepeat(row)" ng-click="vm.repeatTaskWithParams(row.id)" title="Repeat with parameters" class="btn btn-xs ng-hide">
<span class="fa fa-refresh text-warning"></span>
</button>
<button ng-show="vm.enableSkip(row)" ng-click="vm.skipTask(row.workItemId)" title="Skip" class="btn btn-xs">
<span class="fa fa-angle-double-right text-success"></span>
</button>
</td>
</tr>
我只想点击这个按钮:
<button ng-show="vm.enableSkip(row)" ng-click="vm.skipTask(row.workItemId)" title="Skip" class="btn btn-xs">
<span class="fa fa-angle-double-right text-success"></span>
我已经阅读了 xpath 教程并检查了论坛上的许多其他帖子。我不确定我错过了什么。我只是想像这样通过 xpath 找到以下元素:
button_to_click= findElement(By.xpath("//button[@title='Skip']"));
但它不起作用。 问题: 为什么它不能仅按标题工作?
我尝试了另一种方式并这样做了:
button_to_click= findElement(By.xpath("//button[@class='btn btn-xs']"));
它运行良好,但是当我在这个 class 中有 3 或 4 个元素时,它只是按下了错误的按钮。
我怎样才能准确地按下这个按钮有人可以帮助我吗?
也许我应该尝试这样的事情?
button_to_click= findElement(By.xpath("//button[@class='btn btn-xs']//button[@title='Skip']"));
为什么仅按标题不起作用?我怎样才能做得更好?新手请耐心等待
编辑 1
我添加了更多代码,因为您想知道我在做什么。 :
此代码运行良好:
driver = new ChromeDriver();
driver.url ="http://mypage.com"
button_to_click= findElement(By.xpath("//button[@class='btn btn-xs']")).Click();
此代码无效:
driver = new ChromeDriver();
driver.url ="http://mypage.com"
button_to_click= findElement(By.xpath("//button[@title='Skip']")).Click();
编辑 2
我会给你一个示例页面进行测试。您只需下载 html 文件并在浏览器中打开它。Html page file
我们现在想做什么?
如果您 运行 这个 html 文件,您将看到所有页面。
现在我们想要点击屏幕上的这个按钮:
当你点击这个按钮后,你会看到下面的点击计数器:像这样:
有谁知道如何点击它?我尝试了几种方法,但仍然找不到解决方案。请帮忙。
编辑 3
我也试过 : - 但它也不起作用
drive.FindElement(By.XPath("//tr[class='ng-scope']/td[text()='Wylaczenie nadan RDF'] and button[@title='Skip'']]")).Click();
我很好奇您在 dom 中是否有一个元素与您尝试 select 的 XPath 具有相同的属性和 html 元素。让我们对我们的 XPath 进行超级具体化,并加入一些条件。给这个人一个机会:
//button[@ng-show='vm.enableSkip(row)' and @title='Skip' and @class='btn btn-xs']
如果您需要添加更多标识符,请继续添加它们。拥有非常具体的 XPath 并没有错。
看起来您的按钮也在 table 行中。如果在包含按钮的 tr 元素中有任何独特之处,您绝对应该将其放在按钮之前的 xpath 中,并且您不必担心它单击前一个 tr 中的按钮,这样做您就知道了XPath 按钮部分的唯一性只需要@title='Skip'。
例如...
//tr[@attribute='uniqueTRValue']/button[@title='Skip']
根据你的问题,这行代码有效:
button_to_click= findElement(By.xpath("//button[@class='btn btn-xs']")).Click();
这行代码不起作用:
button_to_click= findElement(By.xpath("//button[@title='Skip']")).Click();
解释:
查看 HTML DOM
很明显 WebApplication
使用了很多 JavaScript
& Ajax Calls
。因此是属性,例如ng-repeat
、ng-class
等具有动态值,例如{ "error-row": row.errorMessage }
, vm.showError(row.errorMessage)
等。所以很难用这些 values/attributes 来构造一个 xpath
或 CSSselector
使用 xpath
作为 //button[@title='Skip']
应该有效,前提是 xpath
唯一标识了我们感兴趣的特定元素。但由于它没有发生,我怀疑可能有多个元素匹配此 xpath
,其中一些可能是 disabled/hidden。因此,xpath
使用 title
属性作为 Skip
FAILED
.
将 xpath
用作 //button[@class='btn btn-xs']
没有失败,因为这里我们考虑了 class
属性,它在 [=22] 中被广泛使用=] 以及 xpath
内映射到 querySelector/querySelectorAll。因此,此选项更可靠且完美。
更新:
虽然将 xpath
用作 //button[@class='btn btn-xs']
对你来说没有任何失败,但我不确定你为什么要避免它。关于您在评论中提到的 xpath
,因为您使用 <button>
标签进行的搜索非常精细,因此似乎没有必要引用任何父节点,例如tr[text()='Wylaczenie nadan RDF']
。 Incase xpath
因为 //button[@class='btn btn-xs']
没有唯一标识元素,您可以考虑将 class
和 title
属性组合起来,如下所示:
button_to_click= findElement(By.xpath("//button[@class='btn btn-xs' and @title='Skip']")).Click();
我只想单击我页面中的按钮。 html 代码看起来像:
<tr ng-repeat="row in rowCollection" ng-class="{ "error-row": row.errorMessage }" ng-style="vm.getColor(row)" class="ng-scope" style="background: rgb(255, 242, 255) none repeat scroll 0% 0%;">
<td class="ng-binding">Wylaczenie nadan RDF</td><td class="ng-binding">WAITING_FOR_NOTIFICATION</td>
<td>
<a href="" ng-click="vm.showProcessDiagram(row.executor)" class="ng-binding">rfsSendingExecutor</a>
</td>
<td class="ng-binding">2017-09-06 11:14:12</td><td class="ng-binding">2017-09-06 11:14:13</td>
<td has-role="REQUEST" class="text-center">
<!-- ngIf: row.inXml || row.outXml -->
<button ng-if="row.inXml || row.outXml" ng-click="vm.showXml(row)" title="Show" class="btn btn-xs ng-scope"><span class="fa fa-code"></span></button>
<!-- end ngIf: row.inXml || row.outXml -->
</td>
<td has-role="ERROR" class="text-center"><button ng-show="row.errorMessage" ng-click="vm.showError(row.errorMessage)" title="Show" class="btn btn-xs ng-hide"><span class="fa fa-search"></span></button></td>
<td class="text-center">
<button ng-show="vm.enableCancel(row)" ng-click="vm.cancelTask(row.workItemId)" title="Cancel" class="btn btn-xs ng-hide">
<span class="fa fa-ban text-warning"></span>
</button>
<button ng-show="vm.enableRepeat(row)" ng-click="vm.repeatTask(row.id)" title="Repeat" class="btn btn-xs ng-hide">
<span class="fa fa-refresh text-success"></span>
</button>
<button ng-show="vm.enableRepeat(row)" ng-click="vm.repeatTaskWithParams(row.id)" title="Repeat with parameters" class="btn btn-xs ng-hide">
<span class="fa fa-refresh text-warning"></span>
</button>
<button ng-show="vm.enableSkip(row)" ng-click="vm.skipTask(row.workItemId)" title="Skip" class="btn btn-xs">
<span class="fa fa-angle-double-right text-success"></span>
</button>
</td>
</tr>
我只想点击这个按钮:
<button ng-show="vm.enableSkip(row)" ng-click="vm.skipTask(row.workItemId)" title="Skip" class="btn btn-xs">
<span class="fa fa-angle-double-right text-success"></span>
我已经阅读了 xpath 教程并检查了论坛上的许多其他帖子。我不确定我错过了什么。我只是想像这样通过 xpath 找到以下元素:
button_to_click= findElement(By.xpath("//button[@title='Skip']"));
但它不起作用。 问题: 为什么它不能仅按标题工作? 我尝试了另一种方式并这样做了:
button_to_click= findElement(By.xpath("//button[@class='btn btn-xs']"));
它运行良好,但是当我在这个 class 中有 3 或 4 个元素时,它只是按下了错误的按钮。
我怎样才能准确地按下这个按钮有人可以帮助我吗?
也许我应该尝试这样的事情?
button_to_click= findElement(By.xpath("//button[@class='btn btn-xs']//button[@title='Skip']"));
为什么仅按标题不起作用?我怎样才能做得更好?新手请耐心等待
编辑 1 我添加了更多代码,因为您想知道我在做什么。 : 此代码运行良好:
driver = new ChromeDriver();
driver.url ="http://mypage.com"
button_to_click= findElement(By.xpath("//button[@class='btn btn-xs']")).Click();
此代码无效:
driver = new ChromeDriver();
driver.url ="http://mypage.com"
button_to_click= findElement(By.xpath("//button[@title='Skip']")).Click();
编辑 2
我会给你一个示例页面进行测试。您只需下载 html 文件并在浏览器中打开它。Html page file
我们现在想做什么?
如果您 运行 这个 html 文件,您将看到所有页面。
现在我们想要点击屏幕上的这个按钮:
编辑 3
我也试过 : - 但它也不起作用
drive.FindElement(By.XPath("//tr[class='ng-scope']/td[text()='Wylaczenie nadan RDF'] and button[@title='Skip'']]")).Click();
我很好奇您在 dom 中是否有一个元素与您尝试 select 的 XPath 具有相同的属性和 html 元素。让我们对我们的 XPath 进行超级具体化,并加入一些条件。给这个人一个机会:
//button[@ng-show='vm.enableSkip(row)' and @title='Skip' and @class='btn btn-xs']
如果您需要添加更多标识符,请继续添加它们。拥有非常具体的 XPath 并没有错。
看起来您的按钮也在 table 行中。如果在包含按钮的 tr 元素中有任何独特之处,您绝对应该将其放在按钮之前的 xpath 中,并且您不必担心它单击前一个 tr 中的按钮,这样做您就知道了XPath 按钮部分的唯一性只需要@title='Skip'。
例如...
//tr[@attribute='uniqueTRValue']/button[@title='Skip']
根据你的问题,这行代码有效:
button_to_click= findElement(By.xpath("//button[@class='btn btn-xs']")).Click();
这行代码不起作用:
button_to_click= findElement(By.xpath("//button[@title='Skip']")).Click();
解释:
查看 HTML DOM
很明显 WebApplication
使用了很多 JavaScript
& Ajax Calls
。因此是属性,例如ng-repeat
、ng-class
等具有动态值,例如{ "error-row": row.errorMessage }
, vm.showError(row.errorMessage)
等。所以很难用这些 values/attributes 来构造一个 xpath
或 CSSselector
使用 xpath
作为 //button[@title='Skip']
应该有效,前提是 xpath
唯一标识了我们感兴趣的特定元素。但由于它没有发生,我怀疑可能有多个元素匹配此 xpath
,其中一些可能是 disabled/hidden。因此,xpath
使用 title
属性作为 Skip
FAILED
.
将 xpath
用作 //button[@class='btn btn-xs']
没有失败,因为这里我们考虑了 class
属性,它在 [=22] 中被广泛使用=] 以及 xpath
内映射到 querySelector/querySelectorAll。因此,此选项更可靠且完美。
更新:
虽然将 xpath
用作 //button[@class='btn btn-xs']
对你来说没有任何失败,但我不确定你为什么要避免它。关于您在评论中提到的 xpath
,因为您使用 <button>
标签进行的搜索非常精细,因此似乎没有必要引用任何父节点,例如tr[text()='Wylaczenie nadan RDF']
。 Incase xpath
因为 //button[@class='btn btn-xs']
没有唯一标识元素,您可以考虑将 class
和 title
属性组合起来,如下所示:
button_to_click= findElement(By.xpath("//button[@class='btn btn-xs' and @title='Skip']")).Click();