一尘不染

如何为与Selenium一起使用的ExtJS查找页面上元素的唯一选择器?

selenium

我在Firefox Webdriver上使用Selenium来处理具有唯一CSS
ID(在每次加载页面时)的页面上的元素,但是ID每次都会更改,因此无法使用它们来查找元素。这是因为该页面是使用ExtJS构建的Web应用程序。

我正在尝试使用Firebug获取元素信息。

我需要找到一个唯一的xPath或选择器,以便可以使用Selenium分别选择每个元素。

当我使用Firebug复制xPath时,得到的值是这样的:

//*[@id="ext-gen1302"]

但是,下次加载页面时,它看起来像这样:

//*[@id="ext-gen1595"]

在该页面上,每个元素都具有此ID格式,因此无法使用CSS ID查找该元素。

我想获得xPath,即它在DOM中的位置,但是Firebug将仅返回ID xPath,因为它对于该页面实例是唯一的。

/html/body/div[4]/div[3]/div[4]/div/div/div/span[2]/span

我如何获得Firebug(或其他可以以类似速度运行的工具)给我一个唯一的选择器,即使在外部ID更改后,该选择器仍可用于使用Selenium查找元素?


阅读 235

收藏
2020-06-26

共1个答案

一尘不染

ExtJS UI自动化测试的另一个受害者,这是我专门用于测试ExtJS的技巧。(但是,这不会回答您标题中描述的问题)

提示1: 永远不要使用像这样的不可读的XPath
/div[4]/div[3]/div[4]/div/div/div/span[2]/span。源代码的微小更改可能会导致DOM结构更改。这将导致巨大的维护成本。

提示2: 利用有意义的自动生成的部分ID和类名。

例如,
ExtJS的电网例如:By.cssSelector(".x-grid-view .x-grid- table")将方便。如果有多个网格,请尝试为它们建立索引或找到可识别的祖先,例如By.cssSelector("#something- meaningful .x-grid-view .x-grid-table")

提示3: 在源代码中创建有意义的类名。ExtJS提供cls并提供tdCls了自定义类名,因此您可以添加cls:'testing-btn- cancel'源代码,并通过进行获取By.cssSelector(".testing-btn-cancel")

Tip3 是最好的也是最后一个。如果您没有源代码,请与您的经理联系,Selenium
UI自动化对于那些可以修改源代码的人确实应该是开发人员的工作,而不是像最终用户那样的测试人员。

2020-06-26