Alternative to nth-child()

[xman1999]

CSS Guru’s…I am working on finding an element on a webpage based on a multiSelectButton. Currently I’m selecting the elements by nth-child(n) but this is going to be real difficult later on managing my tests.

My code:
var elemId = helpers.getSelectElementId(selectName); var elem = browser.findElement(By.id(elemId));
elem.findElement(By.css(‘.multiSelectButton’)).click();

var locator = By.css(“.multiSelectItem:nth-child(1)”);
var locator2 = By.css(“.multiSelectItem:nth-child(2)”);

elem.findElement(locator).click();
elem.findElement(locator2).click();
// to close
elem.findElement(By.css(‘.multiSelectButton’)).click()
.then(callback);

Using chrome, the css looks like:
advertiser-select > div > form > div.checkBoxContainer > div:nth-child(2) > div > label > span > span.none

I’d like to pass to this code a value, “First Element” and make selection on that. Way to convoluted to set up a slew of scenarios based on ordinal values of where the item are in list. Also, Every page now has this multi-select option which make for more complex tests.

Robert

[Paulie_D]

Frankly, this doesn’t look like a CSS issue…more like javascript but it’s not clear what you are trying to do.

Also, if your selector in CSS looks anything like this

.advertiser-select > div > form > div.checkBoxContainer > div:nth-child(2) > div > label > span > span.none

You need to get a lot more specific in adding classes to your child elements to make your selectors simpler.

[Author]

Posts