How to use a nested element to represent a sub layout/ header

[jameshirka]

I would like to have a nested element on a page that references the header that each page shares and click on an item in that header.

I am currently doing it by subclassing the header class like: [PageNavigation("/")] public class HomePage : Header

But, other pages share other layouts or tables and I would like to separate them so that each page only has the elements that they require and not copy and paste the elements through the page classes as we have lots.

I have been trying to get it working as a subelement like: [PageNavigation("/")] public class HomePage { [ElementLocator(Class = "userPanel")] public Header Header { get; set; } }

And in my specflow: And I chose Header.Login (which doesn't work)

Is there something simple I am missing or do I need to do it as a subclass?

[scottcowan]

Maybe we could do something where the gherkin looks like

When I see in the Header
| Field | Rule   | Value |
| Login | Equals | Login |

but that eliminates nesting that you could have with

When I choose Header.Search.Submit

I'd use it if we had it. It could add to the complexity in the Page classes but I think it would reduce it in the feature files

[jameshirka]

I like the way the first bit of gherkin looks, it's extremely readable and doesnt reveal the technical implementation or understanding of nesting to the person writing the script like Header.Search.Submit would.

[icnocop]

I think it will be easier if you just do something like this:

[ElementLocator(Id = "header-search-submit")]
public HtmlButton HeaderSearchSubmit { get; set; }

And then in your Gherkin file:

When I choose HeaderSearchSubmit

Or this will work too:

When I choose Header Search Submit