Rico Strydom Rico Strydom - 4 days ago 5
CSS Question

Extracting content in :after using XPath

I am trying to get the value of a CSS attribute "content" with:

WebElement plusOrMinusSign = currentEntityTypeLevel1.findElement(
By.xpath("i[@class='tree-branch-head']::after"));
System.out.println(plusOrMinusSign.getCssValue("content"));


However, I get an error:
The string 'i[@class='tree-branch-head']::after' is not a valid XPath expression.


It seem the "
::after
" is not recognised.

Html:

<i class="tree-branch-head" ng-class="iBranchClass()" ng-click="selectNodeHead(node)">::after
</i>


Css:

i:after {
content: "-";
}


Any idea how to get the value of "content"?

Answer

You are using By.xpath but i[@class='tree-branch-head']::after is not a valid XPath, it is a mixture of XPath notation (i[@class='tree-branch-head']) and CSS (:after).

You should use By.cssSelector and a valid CSS selector, for example i.tree-branch-head:after. This would work if Selenium accepted pseudo elements, which it does not.

To work around this problem, you can either use Chromium, that generates extra fake elements ::after and ::before, or use a Javascript extractor as described in http://stackoverflow.com/a/28265738/449288.

Comments