使用Selenium识别相同的Web元素

Question

我是自动化工程师，我目前正在尝试为可持续（我可以在以后运行并且仍然通过）的网页创建测试用例

这是我的问题：

我正在尝试选择具有相同确切类名的多个Web按钮。现在我可以“选择”这些按钮，但这些只是临时 x路径可能会发生变化。

对于相同的Web元素，我需要UNIQUE ID（或某些区分它们的方法）。 x路径的唯一区别是：

• 我可以找到每个按钮的HTML格式代码，但如果移动一个按钮，我的测试将会失败。

• HTML代码，即类名+按钮的第n个。但是，如果从网页中取出按钮，我的测试将再次失败。

//*[@id="tenant-details-accordion"]/div[1]/div[2]/div/div[2]/div[1]/div/a/div //*[@id="tenant-details-accordion"]/div[1]/div[2]/div/div[2]/div[2]/div/a/div //*[@id="tenant-details-accordion"]/div[1]/div[2]/div/div[2]/div[3]/div/a/div

^^以上代码是我目前使用Selenium

找到每个按钮的方式

如果我复制每个类x路径，这就是我得到的

<div class="src-js-components-DateControl-___DateControl__dateControl___2nYAL"><a tabindex="0"><div class="src-js-components-DateControl-___DateControl__icon___2z6Ak null"></div><!-- react-text: 392 -->Set +<!-- /react-text --></a></div>

 <div class="src-js-components-DateControl-___DateControl__dateControl___2nYAL"><a tabindex="0"><div class="src-js-components-DateControl-___DateControl__icon___2z6Ak null"></div><!-- react-text: 386 -->Set +<!-- /react-text --></a></div>

 <div class="src-js-components-DateControl-___DateControl__dateControl___2nYAL"><a tabindex="0"><div class="src-js-components-DateControl-___DateControl__icon___2z6Ak null"></div><!-- react-text: 398 -->Set +<!-- /react-text --></a></div>

我已经与开发团队讨论了这个问题，但他们告诉我，为这些网络元素分配唯一ID是一个很大的禁忌。 （当我们去生产时与项目的全球化有关）即使他们确实分配了唯一ID，他们告诉我他们必须在将项目发送到生产之前剥离它们。这最终会使我的测试最终无用......

我现在来Stack Overflow寻求帮助，我在网上查找的所有内容都无法给出答案，但这似乎是QA和开发部门之间的有效问题。

有没有办法将Id分配给Web元素，以便使用selenium的测试人员可以识别它们但是它不会影响开发人员在整个项目中使用该元素的能力？

修改     使用我公司使用的框架，我实际上并没有在selenium中编写任何代码。我将Xpath保存到一个对象，然后在手动测试中使用预先存在的方法调用该对象。我只能选择要保存在对象中的Xpath。

我稍后会和Dev谈谈，让他们解释一下大的“禁忌”，以便我能够与你们所有人进行沟通。谢谢你的时间和投入

例如：

BirthDateSet= someXpath

Click() using {BirthDateSet}

以下是一些图片，以帮助您提供视觉

Answer 1

您可以简化XPath，使其对DOM中可能发生的变化不那么敏感：

//div[@class="src-js-components-DateControl-___DateControl__icon___2z6Ak null"][N] # Where N is button index

如果类名的这个部分2z6Ak是动态生成的，请尝试：

//div[starts-with(@class, "src-js-components-DateControl-___DateControl__icon___")][N] # Where N is button index

Answer 2

使用xpath到达所需按钮的另一种方法如下：

//*[@id='tenant-details-accordion']/descendant::div[contains(@class, 'DateControl__icon')][1]

上面的xpath应该能够选择第一个出现的按钮。同样，对于第二个出现的按钮，xpath将变为：

//*[@id='tenant-details-accordion']/descendant::div[contains(@class, 'DateControl__icon')][2]

因此，您可以根据页面上所需按钮的出现级别继续替换谓词（[ 2 ]）。

Answer 3

编辑： 感谢您的代码..因此，如果您查看代码，您可以看到，虽然您之后的内容具有相似的属性，但页面中有一些元素可以让您识别您所追求的内容。所以，让我们说你想要在出生日期之后的SET链接，然后使用： //div[contains(text(),'Birth Date')]/div/a/div

因此，要重用此xpath，只需替换文本String.format("//div[contains(text(),'%s')]/div/a/div", labelName);

即可

OLD：如果你想暂时为元素分配一个属性，我相信你可以通过javascript element.setAttribute（）来实现，你可以通过executeScript（）函数运行它。

按钮没有文字？你是说按钮互相交换位置吗？或者你不想使用按钮的索引？

Answer 4

你可以让开发者为这些按钮添加属性 所以代替：

<button class="common_class_name"> 
<button class="common_class_name"> 
<button class="common_class_name"> 

对于您将看到的每个按钮

<button class="common_class_name" test-id="uniqueAttributeForButton1">
<button class="common_class_name" test-id="uniqueAttributeForButton2">
<button class="common_class_name" test-id="uniqueAttributeForButton3">

等

在测试中，您可以使用css选择器找到这些按钮 例如C＃代码：

  

var buttonLocator =“[test-id = \”uniqueAttributeForButton1 \“]”;

     

WebElement button = driver.FindElement（By.CssSelector（buttonLocator））;

Answer 5

如果开发人员不想添加唯一的ID或属性（他们不想这么做就很奇怪）你可以尝试这样的事情：

        //return div class 'col-sm-4' which contain text 'Activation Date'
        var parentDiv = driver.FindElement(By.XPath("//div[contains(@class, 'col-sm-4') and contains(., 'Activation Date')]"));

        //should return div with icon you want e.g. Click
        var childElement = parentDiv.FindElement(By.CssSelector(".DateControl__icon")); 
        childElement.Click();

Answer 6

您可以使用nth方法查找您的独特元素，也可以使用其他方法来解决真正的问题，而您的同事开发人员不会与您合作。自动化测试应该是（除其他事项外）一项服务，让开发人员知道他们没有尽快破坏任何东西，但如果他们没有付出任何努力，那么为什么你应该投资吗？？

他们可能甚至不会看结果。特别是当您的定位器采用div[2]/div[3]...形式时会经常中断并且您将在自动化中丢失 信任 。

我不是前端专家，但我看到生产中使用G10N和L10N以及其他长词的企业产品，它们的HTML中有id，所以如果我是你，我会深入了解为什么？那个大禁忌，对我来说听起来很奇怪......

所以你问了一个错误的问题，它应该是〜 如何在全球网络应用程序中使用React将唯一ID添加到HTML中？ 以及那些应该问它是开发者。

作为旁注，正如许多人倾向于认为的那样，自动化不主要是关于将手动测试移动到自动化，它也会在公司内部的通信中发现“错误”。引用关于此主题的精彩blog post：

  

与直觉相反，开发自动化时遇到的障碍更大   要么是低优先级的错误，要么是不是错误的东西   任何。这些障碍可能是设计糟糕，不好的症状   发展实践甚至低效沟通的症状   组织中的模式（通常由组织引起）   组织结构！康威定律就是一个典型的例子。

祝你好运！

Answer 7

我知道您要选择＆＃34; Set +＆＃34;按钮，对吗？

如果是这样，你可以尝试找到@id =＆＃34; tenant-details-accordion＆＃34;下的所有按钮。具有特定文本的元素：

//*[@id="tenant-details-accordion"]//*[text()='Set +']