第 Object Gem 页。为没有 id 的元素创建访问器
Page Object Gem. Making accessors for elements without ids
假设我有一个简单的页面,其 ID 少于我想要的测试
<div class="__panel_body">
<div class="__panel_header">Real Estate Rating</div>
<div class="__panel_body">
<div class="__panel_header">Property Rating Info</div>
<a class="icon.edit"></a>
<a class="icon.edit"></a>
</div>
<div class="__panel_body">
<div class="__panel_header">General Risks</div>
<a class="icon.edit"></a>
<a class="icon.edit"></a>
</div>
<div class="__panel_body">
<div class="__panel_header">Amenities</div>
<a class="icon.edit"></a>
<a class="icon.edit"></a>
</div>
</div>
我正在使用 Jeff Morgan 的页面 Object gem,我想为任何给定部分中的编辑链接创建访问器。
挑战在于面板 header 可以区分 body 我想要选择的内容。然后我需要访问 parent 并获取所有带有 class "icon.edit"
的链接。假设我无法更改 HTML 来解决这个问题。
这是一个开始
module RealEstateRatingPageFields
div(:general_risks_section, ....)
def general_risks_edit_links
general_risks_section_element.links(class: "icon.edit")
end
end
如何让 general_risks_section
访问器工作?
我想要用文本 'General Risks'...
向面板 header 表示 parent div
有多种方法可以获得一般风险部分。
使用块
访问器可以使用一个块,您可以在其中以更编程的方式描述如何定位元素。这允许您定位一个有区别的元素,然后遍历 DOM 到您真正想要的元素。在这种情况下,您可以找到具有匹配文本的 header 并导航到其 parent.
div(:general_risks_section) { div_element(class: '__panel_header', text: 'General Risks').parent }
使用 XPath
虽然难以读写,但您也可以使用 XPath 定位器。概念和思维过程与使用积木相同。唯一的好处是它减少了元素调用的次数,从而稍微提高了性能。
div(:general_risks_section, xpath: './/div[@class="__panel_body"][./div[@class="__panel_header" and text() = "General Risks"]]')
XPath 表示:
.//div # Find a div element that
[@class="__panel_body"] # Has the class "__panel_body" and
[./div[ # Contains a div element that
@class="__panel_header" and # Has the class "__panel_header" and
text() = "General Risks" # Has the text "General Risks"
]]
使用Body文本
鉴于 HTML,您也可以直接根据其文本定位该部分。
div(:general_risks_section, class: '__panel_body', text: 'General Risks')
请注意,这假定给定的 HTML 没有被简化。如果实际上还有其他文本节点,这可能不是最佳选择。
假设我有一个简单的页面,其 ID 少于我想要的测试
<div class="__panel_body">
<div class="__panel_header">Real Estate Rating</div>
<div class="__panel_body">
<div class="__panel_header">Property Rating Info</div>
<a class="icon.edit"></a>
<a class="icon.edit"></a>
</div>
<div class="__panel_body">
<div class="__panel_header">General Risks</div>
<a class="icon.edit"></a>
<a class="icon.edit"></a>
</div>
<div class="__panel_body">
<div class="__panel_header">Amenities</div>
<a class="icon.edit"></a>
<a class="icon.edit"></a>
</div>
</div>
我正在使用 Jeff Morgan 的页面 Object gem,我想为任何给定部分中的编辑链接创建访问器。
挑战在于面板 header 可以区分 body 我想要选择的内容。然后我需要访问 parent 并获取所有带有 class "icon.edit"
的链接。假设我无法更改 HTML 来解决这个问题。
这是一个开始
module RealEstateRatingPageFields
div(:general_risks_section, ....)
def general_risks_edit_links
general_risks_section_element.links(class: "icon.edit")
end
end
如何让 general_risks_section
访问器工作?
我想要用文本 'General Risks'...
向面板 header 表示 parent div有多种方法可以获得一般风险部分。
使用块
访问器可以使用一个块,您可以在其中以更编程的方式描述如何定位元素。这允许您定位一个有区别的元素,然后遍历 DOM 到您真正想要的元素。在这种情况下,您可以找到具有匹配文本的 header 并导航到其 parent.
div(:general_risks_section) { div_element(class: '__panel_header', text: 'General Risks').parent }
使用 XPath
虽然难以读写,但您也可以使用 XPath 定位器。概念和思维过程与使用积木相同。唯一的好处是它减少了元素调用的次数,从而稍微提高了性能。
div(:general_risks_section, xpath: './/div[@class="__panel_body"][./div[@class="__panel_header" and text() = "General Risks"]]')
XPath 表示:
.//div # Find a div element that
[@class="__panel_body"] # Has the class "__panel_body" and
[./div[ # Contains a div element that
@class="__panel_header" and # Has the class "__panel_header" and
text() = "General Risks" # Has the text "General Risks"
]]
使用Body文本
鉴于 HTML,您也可以直接根据其文本定位该部分。
div(:general_risks_section, class: '__panel_body', text: 'General Risks')
请注意,这假定给定的 HTML 没有被简化。如果实际上还有其他文本节点,这可能不是最佳选择。