How select an area on the element: drag while holding the left mouse button?

I guess that the “area” you are looking at is implemented by Scalable Vactor Graphics; something like: https://www.highcharts.com/demo/line-basic . Please find the <svg> element in the attached screenshot. That is an instance of SVG.

The problem is that Selenium Webdriver does not support interacting with the nodes INSIDE the <svg> element at all. SVG is out of the scope of WebDriver. As you know, Katalon Studio works on top of the WebDriver which can work with HTML DOM only. WebDriver is not designed to work with SVG at all. Therefore Katalon Studio can not interact with the the SVG node inside the <svg> element.

I suppose, if you are able to write JavaScript code that interact with the target SVG instance via the API provided by the software vendor (e.g. HIGHCHARTs), then you can execute the script using https://docs.katalon.com/docs/author/keywords/keyword-description-in-katalon-studio/web-ui-keywords/webui-execute-javascript from your Katalon test script. That would be the easiest way for your Test Case script to interact with the SVG instance.

I think, you should abandone the idea of “select an are on the element: drag wh…”.


Just for your interest, have a look at the following old post:

This post describes how to select a single SVG text node by XPath. It is this complicated. But I do not know how to simulate “drag from one point to other on SVG instance” using WebDriver API.

1 Like