ピタリウムでマウスホイールとマウスドラッグのイベント実行方法

[ota.hir...@gmail.com]

バグ報告・環境依存の問題と思われる場合は、以下の項目をご記入ください。

 

--------------------------------------------------------------------

【hifiveのバージョン】 1.2.0

【ブラウザおよびバージョン】Chrome 48.0.2564.109 m

【ブラウザの動作OS】windows7

--------------------------------------------------------------------

 お世話になります、太田です。

画面テストにピタリウムを使用しようとしているのですが、
マウスホイールのイベント実行とマウスドラッグのイベント実行がうまくいっておりません。

マウスドラッグについては以下のようなコードを書いております。
    driver.get("http://cdn.liginc.co.jp/demo/2014/07/zuya/dd/index4.html");//ドラッグのサンプルデモページ
    assertionView.assertView("before");
    WebElement targetWebElement = driver.findElementByCssSelector("#div1");
    Actions action = new Actions(driver);
    action.clickAndHold(targetWebElement).moveByOffset(50, 50).release().build();
    action.perform();
    assertionView.assertView("after");

マウスホイールについてはどのように書けばよいかさっぱりです。

イベント実行の方法をご教授下さい。

以上、よろしくお願いいたします。

[Takuya Kashimura]

太田さん

Pitaliumの利用、およびお問い合わせありがとうございます。

・マウスドラッグについて

そもそもChromeを実行するためのchromedriverが対応していないため、動作していないようです。

https://bugs.chromium.org/p/chromedriver/issues/detail?id=841

そのため、回避策としては他のブラウザで行うか、

JavaScriptで実行するための以下のworkaroundを採用するかになります。

HTML5のdraggable/droppableを使い、jQuery対応であれば、以下のサイトの方法が参考になると思います。

http://elementalselenium.com/tips/39-drag-and-drop

それ以外の場合は、下記のサイトで方法が紹介されています。

https://ynot408.wordpress.com/2011/09/22/drag-and-drop-using-selenium-webdriver/

2つめについては、以下の環境でで動作を確認できました。

--------------------------------------------------------------------

Pitalium：1.1.0

Chrome： 48.0.2564.116 m

chromedriver：2.21

--------------------------------------------------------------------

コード例：

 private void dragdrop(By ByFrom, By ByTo) {
   WebElement LocatorFrom = driver.findElement(ByFrom);
   WebElement LocatorTo = driver.findElement(ByTo);
   String xto = Integer.toString(LocatorTo.getLocation().x);
   String yto = Integer.toString(LocatorTo.getLocation().y);
   driver.executeScript(
   "function simulate(f,c,d,e){var b,a=null;for(b in eventMatchers)if(eventMatchers[b].test(c)){a=b;break}if(!a)return!1;document.createEvent?(b=document.createEvent(a),a==\"HTMLEvents\"?b.initEvent(c,!0,!0):b.initMouseEvent(c,!0,!0,document.defaultView,0,d,e,d,e,!1,!1,!1,!1,0,null),f.dispatchEvent(b)):(a=document.createEventObject(),a.detail=0,a.screenX=d,a.screenY=e,a.clientX=d,a.clientY=e,a.ctrlKey=!1,a.altKey=!1,a.shiftKey=!1,a.metaKey=!1,a.button=1,f.fireEvent(\"on\"+c,a));return!0} var eventMatchers={HTMLEvents:/^(?:load|unload|abort|error|select|change|submit|reset|focus|blur|resize|scroll)$/,MouseEvents:/^(?:click|dblclick|mouse(?:down|up|over|move|out))$/}; "
 + "simulate(arguments[0],\"mousedown\",0,0); simulate(arguments[0],\"mousemove\",arguments[1],arguments[2]); simulate(arguments[0],\"mouseup\",arguments[1],arguments[2]); ",
   LocatorFrom, xto, yto);
 }


 @Test
 public void mouseDragTest() throws InterruptedException {

   driver.get("http://cdn.liginc.co.jp/demo/2014/07/zuya/dd/index4.html");//ドラッグのサンプルデモページ

   dragdrop(By.cssSelector("#div1"), By.cssSelector("#div3"));
 }

・マウスホイールについて

こちらもSeleniumでは対応していません。

マウスホイールでのスクロールなどであれば、PtlWebDriver#scrollToを使用できますが、通常のwheelイベントを起こすためにはJavaScriptで実行する必要があります。

JavaScriptでwheelイベントを実行するためには、ｊQueryを使用している場合は、以下のコードで実行できます。

$( "#selector" ).trigger( $.Event( "wheel",{originalEvent:{deltaY: -200}} ));

したがって、Pitaliumを使用する場合は以下のようにして実現できます。

driver.executeScript("$( '#selector').trigger($.Event('wheel',{originalEvent:{deltaY: -200}} ));");

よろしくお願いいたします。

[ota.hir...@gmail.com]

太田です。

ありがとうございます。
chromeでは出来ないものだったのですね。
教えていただいた情報でマウスホイール、マウスドラッグともに
イベント実行させることが出来ました！

今後ともよろしくお願いいたします。