1

After any changes made to the web service in our project we test the Web Service by providing data to the web services and then check if accurate data has come to the application by checking the graph on the web portals.

I am facing a problem in getting the data from the tool tip so that I can assert.

I am using Selenium. I have to first mouse-hover on the bar (graph) and then a tooltip item appears having the value.

How can I get the value so that I can compare it with my actual data. enter image description here

Please find the code :

    act.moveToElement(driver.findElement(By.xpath(".//*[@id='chart']/svg/g/g[1]/g[4]/g[1]/path[3]")));

    act.moveToElement(driver.findElement(By.xpath("html/body/div[14]/text()")));

Here is the HTML

`div class="k-tooltip k-chart-tooltip" style="position: absolute; font: 12px Arial,Helvetica,sans-serif; border: 1px solid rgb(0, 0, 255); opacity: 1; background-color: rgb(0, 0, 255); top: 212px; left: 1068px;">16,042</div>`
  • Can you post the HTML of the tooltip? – FDM Aug 12 '15 at 6:27
  • Are the graphs rendered on the back-end or the front-end? Most of the time you feed a data call to a front-end graph library. Personally I would trust the supplier of the graphs to test the data is displayed correctly. Just check you get the correct data from the back-end in the web-service call. – Niels van Reijmersdal Aug 28 '15 at 14:27
1

The chart looks like an SVG chart. So you would need to go to the particular bar and then get the tool tip using the .text attribute - if you're using Python or using the getText( ) -in case you're using Java.

Here is an example of such a chart (it's a pie chart)

SVG Pie Chart

Here is how I got the tool tip text for the Violet portion of the pie chart :

def setUp(self):
    self.driver = webdriver.Firefox()
    self.driver.maximize_window()
    self.driver.get('http://yuilibrary.com/yui/docs/charts/charts-pie.html')

def test_tootltip(self):
    driver = self.driver

    """getting the xpath for the violet portion"""
    violetcolor= driver.find_element_by_xpath("//*[contains(@class,'yui3-svgSvgPieSlice')][@fill='#66007f']")


    """tooltip xpath

       tooltipactual=driver.find_element_by_xpath("//div[contains(@id,'_tooltip')]")



    print('for violet part')

    """click on the violet part so that the tooltip appears on the DOM"""

    violetcolor.click()

    """get the tooltip text"""
    e = tooltipactual.text

    print(e)


def tearDown(self):
    self.driver.quit()

I get the tool tip text in the console out put as

  day: Monday
  taxes: 2000
  24.24%` 

which can then be used to assert the values.

  • The tool tip appears only on hovering the mouse on the bar. The chart is a kendo chart. And i have used java for the same. – Fazaikh Aug 13 '15 at 1:31
  • Can you post the HTML. I think your xpath is not correct. You need to modify your xpath in this way //*[local-name()=’svg’ and namespace-uri()=’w3.org/2000/svg’. I would be able to get a correct xpath only if I have the correct HTML. – demouser123 Aug 13 '15 at 4:13
0

If the Graph is inside a frame then probably you need to switchTo Frame and perform the action.

If that is not the case, then if possible can you provide the sample for the barchart.

0

Maybe this question was already resolved, but here's an example that I use in my test project. I use C# and the web application uses kendo charts too. I created a method just to capture the tooltips values and return a string.

 public string GetTooltipValue()
    {
        Thread.Sleep(400);
        IWebElement waitToolTip = Wait.Until(ExpectedConditions.ElementIsVisible(By.CssSelector("div.k-tooltip.k-chart-tooltip")));
        String tooltipText = Driver.FindElement(By.CssSelector("div.k-tooltip.k-chart-tooltip")).Text;
        return tooltipText;
    }

It uses a Thread.Sleep on the first line because sometimes there is a delay between click on the chart and the tooltip be shown.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.