In Magellan / Nightwatch, how do we assert that an element comes before another element?

Question

For example, if the user has a gift card, we want to assert that gift card section comes first:

<section id="gift-card-section"> ... </section>
<section id="credit-card-section"> ... </section>

Otherwise, we want to assert that the credit card section comes first. How can this be done in Magellan / Nightwatch?

My thinking is just to get the N in the N-th child... and assert that N1 < N2 or the other way around. How is this done in Magellan / Nightwatch?

Answer 1

This is a great case for using XPATH. Explicit, if you know that these should be the first and second section elements.

browser
.useXpath().assert.attributeContains('(//section)[1]', 'id', 'gift-card-section');
.useXpath().assert.attributeContains('(//section)[2]', 'id', 'credit-card-section');

or, if they need not be ordered, and they are at the same level in the DOM (if they are siblings) you could use attribute equals:

browser
.useXpath().assert.attributeEquals("//section[@id='credit-card-section']/following-sibling:://section[@id='gift-card-section']", "id", "credit-card-section");

This second option is a bit redundant, but there are plenty of other options if you are using XPATH in Nightwatch.