48

いくつかの円と長方形の要素を持つ SVG オブジェクトがあります。webdriver を使用すると、メインの svg オブジェクトをクリックできますが、その中のどの要素もクリックできません。getAttribute() を使用して幅、ID、x/y、テキストなどの値を返すことができるため、問題はクリック (またはマウス操作) にのみあるようです。

HTML の例を次に示します。

    <div id="canvas">
        <svg height="840" version="1.1" width="757" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative;">
            <image x="0" y="0" width="757" height="840" preserveAspectRatio="none">
            <circle cx="272.34" cy="132.14">
            <rect x="241.47" y="139.23">
            <text style="text-anchor: middle; x="272.47" y="144.11">
        </svg>
    </div>

WebDriver が四角形要素を右クリックしようとしている (そして失敗している) 例:

    WebElement mapObject = driver.findElement(By.xpath("//*[name()='svg']/*[name()='rect']"));
    Actions builder = new Actions(driver);
    builder.contextClick(mapObject).perform();

しかし、これは機能し、値を返します:

    driver.findElement(By.xpath("//*[name()='svg']/*[name()='rect']")).getAttribute("x");

WebDriver エラーの場合、通常は次のようになります。

    org.openqa.selenium.WebDriverException: '[JavaScript Error: "a.scrollIntoView is not a function" {file: "file:///var/folders/sm/jngvd6s97ldb916b7h25d57r0000gn/T/anonymous490577185394048506webdriver-profile/extensions/fxdriver@googlecode.com/components/synthetic_mouse.js" line: 8544}]' when calling method: [wdIMouse::move]

私はこれを調査するのに時間を費やしましたが、Selenium と SVG ではやや一般的な問題のようですが、回避策があるかどうか疑問に思っています。私が見つけた唯一の解決策は、SVG 自体と対話することであり、これは既に実行できます。

Java + Firefox 17でSelenium 2.28を使用しています（2.29を試しました）。

どんなアイデアでも大歓迎です。

4

8 に答える 8

31

興味のある人は、次の方法でこれを解決しました。

1) 私はもともとこれを Firefox 17 と Selenium 2.28/29 を搭載した OSX でテストしていましたが、(少なくとも私にとっては) Firefox 18 と Selenium 2.29 を搭載した Windows でのみ動作することがわかりました。

2) 標準で SVG とやり取りする:

driver.findElement(By.xpath(YOUR XPATH)).click();

動作しません。アクションを使用する必要があります。

3) SVG オブジェクトと対話するには、次の XPath が機能します。

"/*[name()='svg']/*[name()='SVG OBJECT']";

SVG オブジェクトは、SVG 要素の下にあるもの (たとえば、円、四角形、テキストなど) です。

SVG オブジェクトをクリックする例:

WebElement svgObject = driver.findElement(By.xpath(YOUR XPATH));
Actions builder = new Actions(driver);
builder.click(svgObject).build().perform();

注: click() 関数内でパスを呼び出す必要があります。使用:

moveToElement(YOUR XPATH).click().build().perform();

動作しません。

于 2013-02-07T22:00:21.110 に答える
4

これら2つのことを行うことで、奇妙なxpath選択を回避できました

WebElement mapObject = (WebElement) driver.executeScript('return document.querySelector(arguments[0])', "svg rect")

((JavascriptExecutor) driver).executeScript("arguments[0].dispatchEvent(new MouseEvent('click', {view: window, bubbles:true, cancelable: true}))", mapObject);

これは osx と phantomjs で機能しましたが、最新のブラウザーでは問題ないと思います。

(js ドライバーを使用したので、コンパイル エラーがあれば自由に修正してください)

于 2014-01-28T19:06:42.070 に答える
3

どうぞ：

driver.findElement(By.cssSelector("#canvas > svg > rect")).getAttribute("x") 
driver.findElement(By.cssSelector("#canvas > svg > rect")).getAttribute("y")

このようにすればできます。

于 2014-04-03T10:29:37.553 に答える