如何使用 JavaScript 为测试自动化查找具有相同属性的两个 Web 对象

Question

我有这段HTML码

我需要使用 JavaScript 找到这 2 个对象，这样我就可以单击 () 它并编写一些文本（测试自动化）。

问题是 id 是动态生成的，因此无法使用，因为每次加载页面时它都会不断变化。现在因为不能使用 id，这 2 个对象在没有任何唯一标识符的情况下看起来是一样的。

如果我用这个

document.querySelector("input.value-restored[type='text']");

然后它会只找到第一个。

知道如何击中两个物体吗？

谢谢。

Answer 1

试试这个方法。

完成 xpath 后使用索引。 xpath [2] 下方的内部表示第二个 input 网络元素。如果有多个输入标签可用，那么您应该使用索引。

//input[@class='ui-calendar-display widget has-change-tracker value-restored'][2]

如果您想定位第一个网络元素，请使用下面的 xpath。

//input[@class='ui-calendar-display widget has-change-tracker value-restored'][1]

Answer 2

您可以使用 [contains()] 为这些元素构造一个 xpath。如我所见，父 span 有一个稳定的 class 名称，您可以使用它。

在JAVA

WebElement firstElement = driver.findelements(By.xpath("//span[contains(@class,'form-row-ui-calender-row')]/input[@type='text']")).get(0);
WebElement secondElement = driver.findelements(By.xpath("//span[contains(@class,'form-row-ui-calender-row')]/input[@type='text']")).get(1);

或者在您的 xpath 中使用索引。

WebElement firstElement = driver.findelements(By.xpath("//span[contains(@class,'form-row-ui-calender-row')]/input[@type='text'][1]"));
WebElement secondElement = driver.findelements(By.xpath("//span[contains(@class,'form-row-ui-calender-row')]/input[@type='text'][2]"));

希望对您有所帮助。

Answer 3

在 TestComplete 中，您可以通过以下方式（在脚本中）执行此操作：

  let obj = page.FindChildByXPath('//span[text()="Date to:"]/following-sibling::span/input[contains(@class, "ui-calendar-display")]', false);
  obj.Click();

如果您正在使用名称映射，则可以使用必需的子项功能非常可靠地映射此对象，并通过映射树中的名称直接访问该对象。如果您需要有关如何创建此类映射的更多详细信息，请告诉我。

如何使用 JavaScript 为测试自动化查找具有相同属性的两个 Web 对象

How to find two web objects with the same properties using JavaScript for Test Automation

javascript

html

selenium

testcomplete