无法使用javascript执行HTML5拖放以进行Selenium WebDriver测试 [英] Unable to perform HTML5 drag and drop using javascript for Selenium WebDriver test

问题描述

为了实现Selenium测试的拖放，我提到了 http：// elementalselenium.com/tips/39-drag-and-drop 有人提到使用javascript（来自 https://gist.github.com/rcorreia/2362544 ）处理拖放。

In order to implement drag and drop for Selenium tests, I referred to http://elementalselenium.com/tips/39-drag-and-drop There it's mentioned to use javascript(from https://gist.github.com/rcorreia/2362544) to handle drag and drop.

我按原样实现了它并且工作正常。但就我而言，我为源和目标元素提供了动态xpath。为了达到这个目的，我尝试使用以下代码：

I implemented it as it is and it worked. But in my case, I've dynamic xpaths for source and target element. In order to achieve that, I tried with following code:

package org.test.selenium;

import java.io.BufferedReader;
import java.io.File;
import java.io.FileReader;
import java.io.IOException;

import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.AfterClass;
import org.testng.annotations.BeforeClass;
import org.testng.annotations.Test;

public class HTML5DragAndDrop {
    WebDriver driver = null;

    @BeforeClass
    public void setUp(){
        System.out.println(System.getProperty("user.dir"));
        String chromeDriver = System.getProperty("user.dir")+ File.separator + "drivers" + File.separator + "chromedriver.exe";

        System.setProperty("webdriver.chrome.driver", chromeDriver);

        driver = new ChromeDriver();
        driver.get("http://the-internet.herokuapp.com/drag_and_drop");
    }

    @AfterClass
    public void tearDown(){
        driver.quit();
    }
  @Test
  public void testDragAndDrop() throws IOException, InterruptedException {
      String filePath = "C://dnd.js";
      String source = "//div[@id='column-a']";
      String target = "//div[@id='column-b']";
      StringBuffer buffer = new StringBuffer();
      String line;
      BufferedReader br = new BufferedReader(new FileReader(filePath));
      while((line = br.readLine())!=null)
          buffer.append(line);

      String javaScript = buffer.toString();

      javaScript = javaScript + "$('" + source + "').simulateDragDrop({ dropTarget: '" + target + "'});";
      ((JavascriptExecutor)driver).executeScript(javaScript);
  }
}

但它会出错：

org.openqa.selenium.WebDriverException: unknown error: Runtime.evaluate threw exception: SyntaxError: Unexpected identifier

（会话信息：chrome = 35.0.1916.153）

(Session info: chrome=35.0.1916.153)

但是，如果使用源和目标如下面的css，它完全正常：

However, if use source and target as css like following, it works perfectly fine:

String source = "#column-a";
String target = "#column-b";

有人可以建议我需要做的更改，以便上面的内容适用于源元素和目标元素用xpaths？在我的情况下，我被限制使用xpath，我只用xpath做这个。

Can someone please suggest me changes that need to be done so that above will work with source and target elements with xpaths? In my case, I'm constrained to use xpath that's I've to do this with xpath only.

推荐答案

你的问题是JQuery使用类似CSS的语法。在这种情况下，Xpath不起作用。

Your problem is that JQuery uses CSS-like syntax. Xpath won't work in this case.

如果你必须使用Xpath，你必须在追加之前将Xpath字符串转换为CSS它进入这个JQuery字符串：

If you must use Xpath, you will have to convert the Xpath string to CSS before you append it into this JQuery string:

javaScript = javaScript + "$('" + source + "').simulateDragDrop({ dropTarget: '" + target + "'});";

如果您只使用Xpath来识别 div s使用ID，然后你可以在Java中尝试：

If you are only using Xpath to identify divs using IDs, then you can try this in Java:

Pattern pattern = Pattern.compile("'(.*?)'");
Matcher matcherSource = pattern.matcher(source);
Matcher matcherTarget = pattern.matcher(target);
String cssSource = "#" + matcherSource.group(1);
String cssTarget = "#" + matcherTarget.group(1);
javaScript = javaScript + "$('" + cssSource + "').simulateDragDrop({ dropTarget: '" + cssTarget + "'});";

这篇关于无法使用javascript执行HTML5拖放以进行Selenium WebDriver测试的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！