c# selenium chrome-webdrive 单击按钮使用类和标题 [英] c# selenium chrome-webdrive clicking button using class and title

问题描述

我只想点击页面中的按钮.html 代码看起来像:

i just want to click button in my page. The html code lookls like :

<tr ng-repeat="row in rowCollection" ng-class="{ &quot;error-row&quot;: 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>

我想要做的就是点击这个按钮:

All i want to do is click this 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>

我已经阅读了 xpath 教程并查看了论坛上的许多其他帖子.我不确定我错过了什么.我只是想像这样通过 xpath 找到以下元素:

I've been through the xpath tutorials and checked many other posts nad forums. I'm not sure what I'm missing. I'm simply trying to find the following element by xpath like this :

button_to_click= findElement(By.xpath("//button[@title='Skip']"));

但它不起作用.问题:为什么它不能仅通过标题起作用?我尝试了另一种方式并这样做:

but it doesn't work. QUESTION : Why it don't work only by title? I try another way and do like that :

 button_to_click= findElement(By.xpath("//button[@class='btn btn-xs']"));

它运行良好，但是当我在这个类中有 3 或 4 个元素时，它只是按错了按钮.我怎样才能准确地按下这个按钮，有人可以帮我吗?
也许我应该尝试这样的事情?

And it works well , but when i have 3 or 4 elements in this class it just press wrong button. How can i press exacly this button can someone help me?
Maybe shouold i try something like this?

button_to_click= findElement(By.xpath("//button[@class='btn btn-xs']//button[@title='Skip']"));

为什么它不能仅通过标题起作用?我怎样才能做得更好?新手请耐心等待.

编辑 1我添加了更多代码，因为您想知道我在做什么.:此代码运行良好:

EDIT 1 I add more code as you want to know what I'm doing. : This code works well :

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 文件并在浏览器中打开它.单击此按钮后，您将看到下面的点击计数器:像这样:有谁知道如何点击它?我尝试了几种方法，但仍然找不到解决方案.请帮忙.

EDIT 2 I will give you an example page for testing. You just have to download the html file and open it in your browser.Html page file What we now want to do? If you run this html file you will see all page. And now we want to make a Click on exacly this button on screen : After when you click on this button you will see click counter below : like this : Have anyone idea how to click it? I try few ways and can't find solution still. Please help.

编辑 3

我也尝试过:-但它也不起作用

I try also : - but it too doesn't work

drive.FindElement(By.XPath("//tr[class='ng-scope']/td[text()='Wylaczenie nadan RDF'] and button[@title='Skip'']]")).Click();

推荐答案

根据您的问题，这行代码有效:

As per your Question, this line of code works :

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 调用.因此是属性，例如ng-repeat、ng-class 等具有动态值，例如{ "error-row": row.errorMessage }, vm.showError(row.errorMessage) 等，因此很难使用这些值/属性来构建 xpath 或 CSSselector

Explanation:

Looking at the HTML DOM it's clear the WebApplication uses a lot of JavaScript & Ajax Calls. Hence are the attributes e.g. ng-repeat, ng-class etc with dynamic values e.g. { "error-row": row.errorMessage }, vm.showError(row.errorMessage) etc. So it will be tough to use these values/attributes to construct an xpath or CSSselector

使用 xpath 作为 //button[@title='Skip'] 应该有效，前提是 xpath 唯一标识了我们的兴趣.但由于它没有发生，我怀疑可能有多个元素与此 xpath 匹配，其中一些元素可能被禁用/隐藏.因此，xpath 使用 title 属性作为 Skip FAILED.

Using xpath as //button[@title='Skip'] should have worked provided the xpath uniquely identified the specific element of our interest. But as it is not happening I suspect there may be multiple elements matching this xpath where some of them may be disabled/hidden. So, the xpath using the title attribute as Skip FAILED.

使用 xpath 作为 //button[@class='btn btn-xs'] 没有失败，因为这里我们已经考虑了 类 属性在 CSSselector 以及 xpath 中被广泛使用，它映射到 querySelector/querySelectorAll.因此，此选项更可靠且运行完美.

Using xpath as //button[@class='btn btn-xs'] works without failure because here we have considered the class attribute which is extensively used within CSSselector as well as within xpath which maps down to querySelector/querySelectorAll. Hence, this option is more reliable and works perfect.

虽然使用 xpath 作为 //button[@class='btn btn-xs'] 对你来说没有任何失败，我是不知道为什么要避免它.关于您在评论中提到的 xpath，由于您使用 <button> 标记在搜索中获得了很多细化，因此似乎没有必要引用任何父节点，例如tr[text()='Wylaczenie nadan RDF'].Incase xpath as //button[@class='btn btn-xs'] 不能唯一标识您可以考虑加入的元素class 和 title 属性如下:

Though using xpath as //button[@class='btn btn-xs'] works for you without any failure I am not sure why you want to avoid it. About the xpath you mentioned in your comment, as you have got much granular in your search using the <button> tag it seems unnecessary to reference any parent node e.g. tr[text()='Wylaczenie nadan RDF']. Incase xpath as //button[@class='btn btn-xs'] doesn't identifies the element uniquely you can consider to club up the class and title attribute as follows:

button_to_click= findElement(By.xpath("//button[@class='btn btn-xs' and @title='Skip']")).Click();

这篇关于c# selenium chrome-webdrive 单击按钮使用类和标题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！