[QA] nested elements in Flow tests

[Chris McMahon]

Dan pointed this out to me this week:
https://github.com/cheezy/page-object/wiki/Nested-Elements

It turns out we really need this feature for Flow tests.

On a Flow page (or "Flow board") you have a set elements within a of
"Topic" element that repeat, and that are identifiable only in relation to
the "Topic" in which they are nested.

For example, if a test Unwatches a Topic and then tries to check that the
state is correctly "Unwatched", it becomes impossible to distinguish the
watch button in the second topic from the one in the first, or the third,
etc.

So we need nested elements from time to time.  They look like this:

div(:first_topic_watchlist_container, css: ".flow-topic-watchlist", index:0)
  a(:first_topic_watch_link) do |page|
    page.first_topic_watchlist_container_element.link_element( css:
".flow-watch-link-watch" )
  end
  a(:first_topic_unwatch_link) do |page|
    page.first_topic_watchlist_container_element.link_element( css:
".flow-watch-link-unwatch" )
  end

This makes it possible to distinguish the "Watch" and "Unwatch" links in
the first Topic from those in every other Topic on the page.

So a note on usage: after talking it over with Dan, we decided that the
convention of passing |page| for the nested elements is the most correct
name for that object. (As opposed to say passing the same object but named
|first_topic_watchlist|.  Dan persuaded me that |page| is more correct.)
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.wikimedia.org/pipermail/qa/attachments/20141025/74d4c63b/attachment.html>