用硒在画布上作画

Question

我正在使用硒与Java（最新的两个）。试图在我们的WebApp中的一个模式内的一个小画布区域上进行绘制。我们用来画布的库是'Signature pad JS'。我已经确认了它不是在iframe或任何可能出现问题的棘手的东西（它只是一个带有div.signature-input canvas元素的常规div.modal-body）。

但它什么也没做。我在这里看了很多stackoverflow的帖子，大多数看起来都很相同，只有很少的变化可以尝试（我一直都在尝试它们）。

下面是我尝试的最新代码：//绘制某种类型的签名

WebElement元素=driver.findElement（使用.locator(SIGNATURE_AREA))；//画布元素

Actions builder=新操作（驱动程序）；Builder.ClickAndHold（元素）.MoveByOffset（10,50）.moveByOffset（50,10）。moveByOffset（-10,-50）。moveByOffset（-50,-10）。释放（）。执行（）；

我试过各种补偿方法，但都没有效果。如果有人有这方面的经验，真的会很乐意帮忙。

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为你做同样的事情，它的工作很好，它画出了预期的两条线。诀窍是moveby后面不应该点击，否则它会分散焦点。下面的代码在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();

    }

}

如果成功了就告诉我！