I'm currently in the process of automating a web application built with HTML5 using Selenium Webdriver. I need help figuring out how to highlight the exact coordinates where I have clicked on the Canvas element. For example, if I click on the Canvas at coordinates 200,500, I want to be able to highlight just that point.
If I use JavaScript to highlight the element, it will highlight the entire Canvas element rather than the specific point I clicked on. Can anyone provide a solution for this? Thank you in advance.
My automation setup involves using specflow with C#.
Here is the code snippet for clicking on the Canvas at specific coordinates:
public void ClickCanvasElement(IWebDriver driver, By locator, int offsetX, int offsetY)
{
try
{
IWebElement element = FindElement(driver, locator);
Actions actions = new Actions(driver);
for (int i = 0; i < 10; i++)
{
if ((element.Displayed == true && element.Enabled == true) || element == null)
{
actions.MoveToElement(element, offsetX, offsetY).Click().Perform();
break;
}
System.Threading.Thread.Sleep(500);
}
}
catch (Exception e)
{
Console.WriteLine(e.Message);
}
}