自动化框架 FluentLenium 在全球化测试场景中的应用（3）定位页面元素

look_w

定位页面元素 FluentLenium 框架默认的元素定位方法是 CSS Selector，它能解决大多数的元素定位问题。如果想使用 Xpath                方法对元素进行定位，你也可以用 getDriver()方法来取得 Selenium webdriver instance，例如:                captureElement(getCapturePath("searchBox"), getDriver().find(By.xpath(..)                ) ) 如何获得元素的 CSS 和 Xpath 呢? 网络上这样的工具有很多，常见的有 Firebug 和 Chrome 自带的 Inspect,                大概的步骤是:
先用 chrome Inspect / firebug 去审查一下该元素
Firebug 工具 1然后看一下元素及其上层节点是否有可用的属性(具有唯一性)，在 Firebug 上你也可以通过 Inspect 按钮辅助找到元素在 html                里的位置，点击后通过把鼠标焦点移动到你想要定位的元素上面，将出现一个蓝色的线框，单击鼠标即可。
Firebug 工具 2当你在 Firebug 的 html 视图内移动鼠标，鼠标焦点所到的位置对应的页面元素同样会在页面中标记出蓝色线框。
Firebug 工具 3 假如元素具有唯一的属性，例如 id=”username”, 你可以通过 Firebug 里的 Console 工具测试一下，点击 Console                标签,在下面的命令行输入框中输入$$('#username')，看是否能得到唯一的元素信息。
Firebug 工具 4
如:[input#username property value = "" attribute value =                "null"]，鼠标点一下获取到的元素信息，Firebug 将会跳转到 html 视图并高亮显示定位到的元素的 html 代码段，如图：
Firebug 工具 5 当你通过 Firebug/Chrome Inspect 确认元素唯一定位信息后，你可以在代码里测试你的定位信息是否正确。如:                “fill("input[id=username]").with("tester@cn.ibm.com");”，运行代码看是否能正确执行输入动作。                通过这种方法，我们就可以一个接一个的添加动作了。在实际的脚本开发中，我们常会遇到一些没有 id                或者唯一属性的元素，我们可以通过他们上层的唯一关系来获得这个元素的定位信息，例如: "#wchecklist:nth-of-type(3)                h2"，即页面中第三 id 为 wchecklist 元素里面带有 h2 标签的元素。
标签示例