Reading Pie Chart Tool Tip Value In Selenium WebDriver Test

Many web applications contains charts to show different data In chart view. One of the chart they are using Is Pie chart. It Is very Important for us to know how to automate these pie charts In selenium WebDriver test. Few of the charts are very easy to automate but It Is very hard to automate some charts as we are unable to locate parts of pie chart.

Here Is simple example to get tool tip value from pie chart. It will click on different parts of pie chart and get the tool tip values.
package Testing_Pack;

import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.annotations.BeforeTest;
import org.testng.annotations.Test;

public class pieChart {
 
 WebDriver driver;
 
 @BeforeTest
 public void setup() throws Exception {
  driver = new FirefoxDriver();
  driver.manage().window().maximize();
  driver.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);
  driver.get("http://yuilibrary.com/yui/docs/charts/charts-pie.html");
 }
 
 @Test
 public void pieChart(){
  //Locate pie chart elements based on different colors.
  WebElement VioleteColor = driver.findElement(By.xpath("//*[contains(@class,'yui3-svgSvgPieSlice')][@fill='#66007f']"));
  WebElement GreenColor = driver.findElement(By.xpath("//*[contains(@class,'yui3-svgSvgPieSlice')][@fill='#295454']"));
  WebElement GreyColor = driver.findElement(By.xpath("//*[contains(@class,'yui3-svgSvgPieSlice')][@fill='#e8cdb7']"));
  WebElement LightVioleteColor = driver.findElement(By.xpath("//*[contains(@class,'yui3-svgSvgPieSlice')][@fill='#996ab2']"));
  WebElement BrownColor = driver.findElement(By.xpath("//*[contains(@class,'yui3-svgSvgPieSlice')][@fill='#a86f41']"));
  
  //locate tooltip pie chart.
  WebElement ToolTip = driver.findElement(By.xpath("//div[contains(@id,'_tooltip')]"));

  //Click on pie chart parts and get tooltip values.
  System.out.println("-X-X-X-X-X-X-X-X- Violete Part -X-X-X-X-X-X-X-X-");
  VioleteColor.click();  
  System.out.println(ToolTip.getText());
  System.out.println();  
  
  System.out.println("-X-X-X-X-X-X-X-X- Grey Part -X-X-X-X-X-X-X-X-");
  GreyColor.click();
  System.out.println(ToolTip.getText());
  System.out.println();
  
  System.out.println("-X-X-X-X-X-X-X-X- Light Violete Part -X-X-X-X-X-X-X-X-");
  LightVioleteColor.click();
  System.out.println(ToolTip.getText());
  System.out.println();
  
  System.out.println("-X-X-X-X-X-X-X-X- Green Part -X-X-X-X-X-X-X-X-");
  GreenColor.click();
  System.out.println(ToolTip.getText());
  System.out.println();
  
  System.out.println("-X-X-X-X-X-X-X-X- Brown Part -X-X-X-X-X-X-X-X-");
  BrownColor.click();
  System.out.println(ToolTip.getText());  
 }
}

Run above example In eclipse and verify console result on test execution completion. It will print pie chart tool tip values In console.

11 thoughts on “Reading Pie Chart Tool Tip Value In Selenium WebDriver Test

  1. What is ToolTip locater? how did you get this. Please reply

    How did you get the xpath of below tool tip?

    WebElement ToolTip = driver.findElement(By.xpath("//div[contains(@id,'_tooltip')]"));

  2. WebElement element = driver.findElement(By.cssSelector("#header>h1 a"));//here use your code
    // Get tooltip text
    String toolTipText = element.getAttribute("title");
    System.out.println("Tool tip text present :- " + toolTipText);

  3. Hi I want to automate the follwoing google chart how can i automate this..

    https://developers.google.com/chart/interactive/docs/gallery/piechart

    please check and let me know how to find the element for above..

    Check my below script :

    String sleep= driver.findElement(By.xpath(".//*[@id='piechart']/div/div[1]/div/svg/g[4]/path[1]")).getText(); System.out.println("sleep :" +sleep);

    String work= driver.findElement(By.xpath(".//*[@id='piechart']/div/div[1]/div/svg/g[3]/path[1]")).getText(); System.out.println("work :" +work);

    String Eat= driver.findElement(By.xpath("..//*[@id='piechart']/div/div[1]/div/svg/g[7]/path[1]")).getText(); System.out.println("Eat :" +Eat);

    String Commute= driver.findElement(By.xpath(".//*[@id='piechart']/div/div[1]/div/svg/g[6]/path[1]")).getText(); System.out.println("Commute :" +Commute);

    String WatchTV= driver.findElement(By.xpath(".//*[@id='piechart']/div/div[1]/div/svg/g[5]/text")).getText(); System.out.println("WatchTV :" +WatchTV);

  4. Hi, for
    System.out.println("-X-X-X-X-X-X-X-X- XXXX Part -X-X-X-X-X-X-X-X-");
    GreyColor.click();
    System.out.println(ToolTip.getText());
    System.out.println();
    the last two print nothings. If I am right, it should print the text under the mouse arrow when mouse hover one of the colors.
    I will try and back if I get through.

    Mak

Leave a Reply

Your email address will not be published. Required fields are marked *