堆栈内存溢出
  简体   繁体   English

默认选择第一行

[英]Select first table row by default

 原文  2021-07-16 21:10:32  3   3    java/ selenium/ selenium-webdriver

问题描述

I have this Angular application which displays selected table rows:我有这个 Angular 应用程序，它显示选定的表格行：

<div class="ag-center-cols-container" ref="eCenterContainer" role="rowgroup" unselectable="on" style="width: 432px; height: 100px;">
   <div role="row" row-index="0" aria-rowindex="2" row-id="0" comp-id="370" class="ag-row ag-row-focus ag-row-even ag-row-selected ag-row-level-0 ag-row-position-absolute ag-row-first" aria-selected="true" style="height: 50px; transform: translateY(0px); " aria-label="Press SPACE to deselect this row.">
      <div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="1" comp-id="371" col-id="rowCheckbox" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 32px; left: 0px;  ">
         <mobileweb-checkbox-selection-renderer _nghost-tkr-c21="" class="ng-star-inserted"><i _ngcontent-tkr-c21="" class="far fa-check-square"></i><i _ngcontent-tkr-c21="" class="far fa-square" hidden=""></i></mobileweb-checkbox-selection-renderer>
      </div>
      <div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="2" comp-id="372" col-id="lookupCode" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 100px; left: 32px;">4</div>
      <div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="3" comp-id="373" col-id="shipmentLookupCode" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-focus ag-cell-value" style="width: 100px; left: 132px;">20</div>
      <div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="4" comp-id="374" col-id="carrierName" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 100px; left: 232px;"></div>
      <div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="5" comp-id="375" col-id="shipmentExpectedDate" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 100px; left: 332px;">2021-01-28T16:20:35.987</div>
   </div>
   <div role="row" row-index="1" aria-rowindex="3" row-id="1" comp-id="376" class="ag-row ag-row-no-focus ag-row-odd ag-row-level-0 ag-row-position-absolute ag-row-last" aria-selected="false" style="height: 50px; transform: translateY(50px); " aria-label="Press SPACE to select this row.">
      <div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="1" comp-id="377" col-id="rowCheckbox" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 32px; left: 0px;  ">
         <mobileweb-checkbox-selection-renderer _nghost-tkr-c21="" class="ng-star-inserted"><i _ngcontent-tkr-c21="" class="far fa-check-square" hidden=""></i><i _ngcontent-tkr-c21="" class="far fa-square"></i></mobileweb-checkbox-selection-renderer>
      </div>
      <div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="2" comp-id="378" col-id="lookupCode" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 100px; left: 32px;">3</div>
      <div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="3" comp-id="379" col-id="shipmentLookupCode" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 100px; left: 132px;">19</div>
      <div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="4" comp-id="380" col-id="carrierName" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 100px; left: 232px;"></div>
      <div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="5" comp-id="381" col-id="shipmentExpectedDate" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 100px; left: 332px;">2021-01-28T12:36:31.057</div>
   </div>
</div>

Full code https://pastebin.com/GUaHHnpA完整代码https://pastebin.com/GUaHHnpA

How I can always click on the first table row and select it using Selenium WebDriver with Java?我如何始终单击第一行并使用带有 Java 的 Selenium WebDriver 选择它？

3 个解决方案

解决方案1
 2  2021-07-19 06:22:34

The link that you have shared for full HTML code , does not have <body> tag in it, nonetheless it has </body> , so can you re-verify that first ?您为完整HTML code共享的链接中没有<body> tag ，但它有</body> ，所以您能先re-verify一下吗？

Now, based on the HTML code above, if the goal is to select the first table row , here is my suggestion/Recommendations.现在，根据上面的 HTML 代码，如果目标是选择第一个表格行，这是我的建议/推荐。

You can achieve that in two ways :-您可以通过两种方式实现这一目标：-

  1. Use of xpath indexing使用xpath indexing

  2. use of Selenium - findElements() method Selenium - findElements()使用Selenium - findElements()方法

Demonstration of case 1 :案例1的演示：

if this xpath如果这个xpath

//div[@role='row']

represent rows in the HTML , you would see lot of entering in DOM.代表HTML行，你会看到很多进入 DOM。

and in your case, since you wanna grab the first item, it'd be something like this :在你的情况下，因为你想抓住第一项，它会是这样的：

(//div[@role='row'])[1]

in case if you'd like to select 2nd row , or 3rd row , we can get it done using changing this value from above xpath :如果您想选择2nd row或3rd row ，我们可以通过从 xpath 上方更改此值来完成它：

[1] to [2] or [3] [1]到[2]或[3]

in code you can use it like below :在代码中，您可以像下面这样使用它：

WebDriverWait wait = new WebDriverWait(driver, 30);
WebElement firstRow = wait.until(ExpectedConditions.visibilityOfElementLocated(By.xpath("(//div[@role='row'])[1]")));
firstRow.click();

Demonstration of case 2 :案例2的演示：

2.1 : 2.1 :

List<WebElement> allRows = driver.findElements(By.xpath("//div[@role='row']"));
WebElement firstRow = allRows.get(0);
firstRow.click();

OR要么

2.2 : 2.2 :

List<WebElement> allRows = driver.findElements(By.xpath("//div[@role='row']"));
for (WebElement rows : allRows) {
    rows.click();
    break;
}

The below part is request by OP (additionally, it has nothing to do with the original question)以下部分是OP的要求（另外，它与原始问题无关）

if you have already implemented WebDriverEventListener Interface or extended AbstractWebDriverEventListener Class , you can make use of the below methods :如果您已经实现了WebDriverEventListener接口或扩展的AbstractWebDriverEventListener Class ，则可以使用以下方法：

WebDriverWait wait = new WebDriverWait(driver, 30);
WebElement firstRow = wait.until(ExpectedConditions.visibilityOfElementLocated(By.xpath("(//div[@role='row'])[1]")));
beforeClickOn(firstRow, driver);
firstRow.click();
afterClickOn(firstRow, driver);

and let's say this is written in class A then you can extends it like this :假设这是在class A编写的，那么您可以像这样扩展它：

public class A extends AbstractWebDriverEventListener

解决方案2
 1  2021-07-19 04:54:39

The first row has ag-row-first and ag-row-selected classes, you can use either one.第一行有ag-row-first和ag-row-selected类，您可以使用任何一个。 This will match 3 elements (according to the html you posted in the link), so you can combine it with a parent element that doesn't have ag-hidden class这将匹配 3 个元素（根据您在链接中发布的 html），因此您可以将其与没有ag-hidden类的父元素组合

driver.findElement(By.cssSelector("div:not(.ag-hidden) > .ag-row-first"));

In general, findElement will return the first matching element in the DOM, so一般来说， findElement会返回 DOM 中第一个匹配的元素，所以

driver.findElement(By.className(".ag-row-selected"));

Or its equivalent或者它的等价物

driver.findElements(By.className(".ag-row-selected")).get(0);

Should have worked if the row was really the first in the DOM.如果该行确实是 DOM 中的第一行，则应该有效。

解决方案3
 1  2021-07-20 12:49:57

Using the Selenium plugin, you can find any element by XPath or CSS expressions.使用 Selenium 插件，您可以通过 XPath 或 CSS 表达式查找任何元素。

In order to find the first row using CSS expression, use this string:为了使用 CSS 表达式找到第一行，请使用以下字符串：

String cssExpresison = "div[role='row'][row-id='0']";
WebElement we = driver.findElement(By.cssSelector(cssExpression));
we.click();

You can use the text written in the first row via XPath:您可以通过 XPath 使用第一行中写入的文本：

String xPathExpression = "//div[contains(text(), 'Press SPACE to deselect this row')]";
WebElement we = driver.findElement(By.xpath(xPathExpression));
we.click();

If we.click() does Not work, do this:如果 we.click() 不起作用，请执行以下操作：

Actions builder = new Actions(driver);            
builder.moveToElement(we).click().build().perform();

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 Primefaces LazyLoading表默认选择第一行 - Primefaces LazyLoading Table Select First Row by Default Select 填充表格后的第一行 - Select first row after table is populated 在第一行中设置默认值 - Making a default value in a first row 单击复选框时如何选择整个tableviewer行（表的第一列每行都有复选框） - how to select entire tableviewer row when checkbox clicked (first column of the table has checkboxes in each row) Glazedlist表的第一行中的IndexOutOfBoundsException？ - IndexOutOfBoundsException in the first row of Glazedlist table? 将jtable中的第一行保留为默认值 - keep first row in jtable selected as default 在primefaces数据表中选择“行” - Select Row in primefaces data table 再次选择表格的一行 - Select a row of a Table for second time 如何 select 数据库中的第一行/行 - How to select the first row/line from database 春季形式：选择-多个默认情况下不选择第一个选项 - Spring form:select - multiple does not select first option by default
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM