使用硒在画布上绘制

Question

我在Java中使用硒（两者均为最新）。尝试在我们的Web应用程序中的模态内的小画布区域上绘制。我们用于画布的库是“ signature pad js”。我已经确认它不在iframe内，也不是任何棘手的问题（它只是带有div.signature-input canvas元素的常规div.modal-body）。

但是它什么也没做。在这里有很多关于stackoverflow的文章，其中大多数看起来都差不多，只有很少的尝试（我一直都在尝试）。

这是我尝试过的最新代码： //绘制某种签名

WebElement元素= driver.findElement（Using.locator（SIGNATURE_AREA））; //画布元素

动作构建器=新的动作（驱动程序）； builder.clickAndHold（element）.moveByOffset（10，50）。       moveByOffset（50,10）。       moveByOffset（-10，-50）。       moveByOffset（-50，-10）.release（）。perform（）;

我尝试了各种补偿，但都无济于事。 如果有人对此有经验，真的会很乐意。

Answer 1

我认为您的问题出在代码中，我已经用ruby完成了它，并且工作正常。.下面的Ruby中的代码（在FireFox中工作）

driver.find_element(:xpath, "html/body/div[1]/div[5]/div[2]/canvas").click
  element = driver.find_element(:xpath, "html/body/div[1]/div[5]/div[2]/canvas");
  driver.action.move_to(element).perform
  driver.action.click_and_hold(element).perform
  driver.action.move_by(150, 50).click.perform
  driver.action.move_to(element).perform
  driver.action.click_and_hold(element).perform
  driver.action.move_by(100, 50).click.perform
  driver.action.move_to(element).perform
  driver.action.click_and_hold(element).perform
  driver.action.move_by(300, 10).click.perform
sleep (5)

因此，我为您尝试了使用Java的相同操作，并且工作正常，按预期绘制了两行。诀窍在于，不要在单击动动键之后单击，否则会失去焦点。下面的代码在java和chrome中可以正常工作。我用https://sketchtoy.com/在画布上绘画

public class BrowserTesting {
    WebDriver driver;
    @Test
    public void test1() throws InterruptedException {
        //WebDriverManager.chromedriver().setup();
        System.setProperty("webdriver.chrome.driver","C:\\Users\\pathtyourchrome\\chromedriver.exe");
        ChromeOptions options = new ChromeOptions();
        options.setExperimentalOption("useAutomationExtension", false);
        //disable automation info bar
        options.addArguments("disable-infobars");
        driver = new ChromeDriver(options);
        driver.get("https://sketchtoy.com/");

        WebElement element = driver.findElement(By.xpath("//div[@class='sketch-canvas-container']/canvas"));//canvas element
        Actions builder = new Actions(driver);
        builder.moveToElement(element).perform();
        builder.clickAndHold(element).perform();
        builder.moveByOffset(150, 50).perform();
        builder.moveToElement(element).perform();
        builder.clickAndHold(element).perform();
        builder.moveByOffset(100, 50).perform();
        builder.moveToElement(element).perform();




        Thread.sleep(5000);
        //driver.quit();

    }

}

请参见以下屏幕截图以获取图形：

让我知道这是否有效！