1

Selenium Web Driver (Java). How to click waypoint inside the map which is canvas in HTML5 page

Currently, I am facing challenging a problem to drag and drop on a map which is canvas in html5 page.

enter image description here

The source code of waypoint on the map is as below:

 <div id-"tool-tip" class="tool-tip-target" sytle="left 25.2597px;top:-13.085.px">

How actually I can locate the web element on canvas map and click it as well since later I need drop destination on one of waypoint on the map.

The Selenium Web Driver I am using is 2.48.2 and programming language is Java.

Here is the solution I try to do but neither of them works.

driver.findElement(By.cssSelector("div#tool-tip.tool-tip-target")).click();
WebElement To = driver.findElement(By.cssSelector("div[id='tool-tip'][class='tool-tip-target'][style='left:292.769px; top: 72.815px;']"))
maazza
  • 7,016
  • 15
  • 63
  • 96
jack zhang
  • 11
  • 2

1 Answers1

0

As of my knowledge you can't directly identify the elements designed under canvas in DOM. Hence you can't provide any locator of element to perform click action.

The one way of automating this scenario is by using Action class by providing locator of canvas element and x, y coordinates of your clickable element.

Actions clickAt = new Actions(getDriver()); clickAt.moveToElement(getDriver().findElement(By.id("$zObj_717")), 100, 400).click(); clickAt.build().perform();

However can't guarantee that it works perfect in all machines.

MamathaMacherla
  • 1,106
  • 7
  • 8