Handle custom tags using WebDriver

Sometime while doing automation we have to identify the element which have custom tags like <g> <svg> etc. For this we normally use * that will identify all elements tags in case we have to identify only specified custom tag then we can use below example for this.

<svg height="600" width="910" xmlns:xlink="http://www.w3.org/1999/xlink"  
   id="svgcontent" overflow="visible" x="910" y="600" viewBox="0 0 910 600">
    <g style="pointer-events:all">
      <text fill="rgb(0,0,0)" font-family="Sans-Serif" font-size="13" id="80-155-126" 
        transform="rotate(-90, 168, 126)" y="126" x="168" style="pointer-
         events:inherit">A100A</text>
   </g>
  </svg>

Following Xpath will work here

By.xpath("//*[local-name()='svg']")

By.xpath("//*[local-name()='text']")

By.xpath("//*[local-name()='g']")

EXTRACT CSS PROPERTY VLAUE OF PSEUDO ELEMENTS CONTAINING :after/:before CSS TAG USING JAVASCRIPT IN WEBDRIVER :

We cannot extract css properties of pseudo elements using web driver commands such as ‘.getPropertyValue’ . For this, we need to use JavaScript and execute a js script in selenium web driver.

A CSS pseudo-element is used to style specified parts of an element.
   For example, it can be used to:
   Style the first letter, or line, of an element
   Insert content before, or after, the content of an element

ISSUE:

In above scenario, we need to get the text “Internal Use Only” from UI which is associated with an Anchor (a) tag in DOM with :after CSS tag. The text is present in “content” Style Property as shown in right highlighted box.

The :after CSS tag cannot be located directly using web driver and thus required text cannot be retrieved simply by using .getPropertyValue() function in selenium.

To achieve this, a javascript needs to be executed in our selenium code :

WebElement elementObj = driver.findElement(By.xpath("<YourXpath>"));

String pseudoElementText = ((JavascriptExecutor)driver).executeScript("return window.getComputedStyle(arguments[0],':after').getPropertyValue(content');", elementObj).toString();

System.out.println(pseudoElementText);

In same way we can extract another properties values as well.

Thanks