Generally, no, there is no easier way to deal with nested elements. Though 
if you don't need to access :wishlist_remove_all, you could just do:

span(:remove_all_link){ div(class: "wishlist-removal-all").span }

I don't think Page-Object is making it any harder than pure Watir.

Page-Object does provide some "convenience" for elements in frames, which 
we could extend to other elements:

iframe(id: 'frame_id') do |iframe|
  span(:something, class: 'class', frame: iframe)
end

Justin


On Tuesday, March 26, 2019 at 3:05:55 PM UTC-4, Titus Fortner wrote:
>
> The other reason to perhaps prefer css is that Page Object gem makes using 
> nested elements harder.
>
> span(:remove_all_link, :css=> ".wishlist-remove-all span")
> I think would need to look like:
>
> element(:wishlist_remove_all, :class => "wishlist-remove-all") 
> span(:remove_all_link){ wishlist_remove_all_element.span } 
>
> Justin is there an easier way to do this in PO gem?
>
>
>
>
>
> On Tuesday, March 26, 2019 at 11:39:39 AM UTC-5, Justin Ko wrote:
>>
>> In most cases, it is simply a matter of personal preference. There is 
>> usually no technical difference between between using CSS/XPath vs 
>> attributes. To me, the most important thing is to be consistent as an 
>> organization so that code is consistent, which makes the code easier to 
>> read/maintain. I would push using attributes as easier to read and less 
>> error prone. However, I have worked with people coming from Capybara that 
>> feel that CSS expressions are easier to read/use.
>>
>> That said, there is one place where using CSS/XPath is the better 
>> solution - creating a collection of nested elements without the same 
>> ancestors.
>>
>> For example, let's say you have the following HTML:
>>
>>
>> <body>
>>   <div class="price-and-quick-add-button-wrapper">
>>     <a class="name-link">link A</a>
>>   </div>
>>   <div class="price-and-quick-add-button-wrapper">
>>     <a class="name-link">link B</a>
>>   </div>
>> </body>
>>
>> Your current accessor, will match *2* links:
>>
>> links(:product_names, :css => ".price-and-quick-add-button-wrapper 
>> a.name-link")
>>
>> Unlike the CSS-locator, nesting Watir's element calls only looks in the 
>> first matching element. Therefore, you would only get *1* match if you 
>> tried:
>>
>> links(:product_names) { div(class: "price-and-quick-add-button-wrapper").
>> links(class: "name-link") }
>>
>> To get the *2* links without CSS/XPath you would need to make some ugly 
>> iteration of elements, which is harder to read/write and worse with more 
>> levels of nesting:
>>
>> links(:product_names) { divs(class: "price-and-quick-add-button-wrapper"
>> ).map { |div| div.links(class: "name-link") }.flatten }
>>
>> Of course, this assumes you're stuck with the HTML you have. The better 
>> answer would be to add more attributes so that you can locate the links 
>> directly (ie not deal with nesting).
>>
>> - Justin
>>
>>
>> On Tuesday, March 26, 2019 at 5:19:06 AM UTC-4, NaviHan wrote:
>>>
>>> Hi Titus
>>>
>>> Today I saw a team member defining elements like this
>>>
>>> +  a(:start_shopping_link, :css => "a.start-shopping")
>>>
>>>
>>> <https://bitbucket.org/CottonOnGroupEComm/cog-ui-auto/pull-requests/228/co-3896-automation-wishlist/diff#add-comment>
>>>  
>>> <https://bitbucket.org/CottonOnGroupEComm/cog-ui-auto/pull-requests/228/co-3896-automation-wishlist/diff#Lcuke-tests/features/support/pages/Frontend/Cotton_On/Wishlist_Page.rbT12>
>>>
>>> +  links(:product_names, :css => ".price-and-quick-add-button-wrapper 
>>> a.name-link")
>>>
>>>
>>> <https://bitbucket.org/CottonOnGroupEComm/cog-ui-auto/pull-requests/228/co-3896-automation-wishlist/diff#add-comment>
>>>  
>>> <https://bitbucket.org/CottonOnGroupEComm/cog-ui-auto/pull-requests/228/co-3896-automation-wishlist/diff#Lcuke-tests/features/support/pages/Frontend/Cotton_On/Wishlist_Page.rbT13>
>>>
>>> +  links(:product_thumbnails, :css => "a.thumb-link")
>>>
>>>
>>> <https://bitbucket.org/CottonOnGroupEComm/cog-ui-auto/pull-requests/228/co-3896-automation-wishlist/diff#add-comment>
>>>  
>>> <https://bitbucket.org/CottonOnGroupEComm/cog-ui-auto/pull-requests/228/co-3896-automation-wishlist/diff#Lcuke-tests/features/support/pages/Frontend/Cotton_On/Wishlist_Page.rbT14>
>>>
>>> +  span(:remove_all_link, :css=> ".wishlist-remove-all span")
>>>
>>>
>>> Heavy use of css.
>>> I cant tell them why they should use css :-)
>>>
>>> Could you please let me know the disadvantage here?
>>>
>>> On Sunday, 24 March 2019 17:15:53 UTC+11, NaviHan wrote:
>>>>
>>>> I have seen in my project using css to identify elements using 
>>>> PageObject.
>>>> I always use attributes like id, class and name to identify elements.
>>>>
>>>> Which is the better way and why?
>>>>
>>>

-- 
-- 
Before posting, please read 
https://github.com/watir/watir_meta/wiki/Guidelines-for-Posting-to-Watir-General-Google-Group.
 
In short: search before you ask, be nice.

watir-general@googlegroups.com
http://groups.google.com/group/watir-general
watir-general+unsubscr...@googlegroups.com
--- 
You received this message because you are subscribed to the Google Groups 
"Watir General" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to watir-general+unsubscr...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to