In this blog we will be utilizing Playwright Java to handle double click, drag and drop.<\/em><\/p>\n

\n

\n<\/ins>\n<\/div>\n
Topics that we will cover:<\/strong><\/p>\n
\n
Handle double click<\/li>\n
Handle drag and drop<\/li>\n
Source code (double click)<\/li>\n
Source code (drag and drop)<\/li>\n<\/ul>\n
Handle \u2018double click\u2019<\/strong><\/p>\n
To understand double click, go to https:\/\/api.jquery.com\/dblclick\/\u00a0<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0As can be seen above, there is a blue color block that we can double click.<\/p>\n
When we double click, the color changes to yellow<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0When we double click again, the color changes back to blue<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0Let us see how to automate this event.\u00a0<\/p>\n
Let us inspect the block and copy the xpath<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0So we can locate this block using below xpath:<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0The next action is to double click this box.<\/p>\n
The below code snippet will do the needful<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
The color changes to yellow (due to first double click)<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
Handle \u2018drag and drop\u2019<\/strong><\/p>\n
Let us now navigate to https:\/\/jqueryui.com\/resources\/demos\/droppable\/default.html\u00a0<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0Let us see how to automate this event.
The small box that needs to be dragged has a horizontal x-axis and vertical y-axis.
Let us inspect this box that we need to drag and copy the css selector\u00a0<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0So we can write<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
The next action is to move mouse to middle of the smaller box so that we can drag it<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
The below code snippet will move mouse to the middle of drop box<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0We will than fire an event to move the mouse down<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
So logic will be<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0Execute.<\/p>\n
Notice below the drag and drop operation is success<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0This is how we can handle double click and drag\/drop events using playwright java.<\/p>\n
Source code (double click)<\/strong><\/p>\n
package<\/strong> com.rsa.playwrightjava;<\/p>\n
<\/p>\n
import<\/strong> com.microsoft.playwright.Browser;<\/p>\n
import<\/strong> com.microsoft.playwright.BrowserType;<\/p>\n
import<\/strong> com.microsoft.playwright.Page;<\/p>\n
import<\/strong> com.microsoft.playwright.Playwright;<\/p>\n
<\/p>\n
public<\/strong>
\nclass<\/strong> Blog30_DblClick_PWJava {<\/p>\n
public<\/strong>
\nstatic<\/strong>
\nvoid<\/strong> main(String[] args) {<\/p>\n
Playwright playwright = Playwright.create<\/em>();<\/p>\n
Browser browser = playwright.chromium().launch(new<\/strong> BrowserType.LaunchOptions().setHeadless(false<\/strong>));<\/p>\n
Page page = browser.newPage();<\/p>\n
page.navigate(“https:\/\/api.jquery.com\/dblclick\/”);<\/p>\n
\/\/dbl click to change color from blue to yellow<\/p>\n
page.frameLocator(“\/\/iframe”).locator(“\/\/html\/body\/div”).dblclick();<\/p>\n
try<\/strong> {<\/p>\n
Thread.sleep<\/em>(1000);<\/p>\n
} catch<\/strong> (InterruptedException e) {<\/p>\n
e.printStackTrace();<\/p>\n
}<\/p>\n
\/\/dbl click to change color from yellow to blue\u00a0<\/p>\n
page.frameLocator(“\/\/iframe”).locator(“\/\/html\/body\/div”).dblclick();<\/p>\n
page.pause();<\/p>\n
}<\/p>\n
<\/p>\n
}<\/p>\n
<\/p>\n
Source code (drag and drop)<\/strong><\/p>\n
package<\/strong> com.rsa.playwrightjava;<\/p>\n
<\/p>\n
import<\/strong> com.microsoft.playwright.Browser;<\/p>\n
import<\/strong> com.microsoft.playwright.BrowserType;<\/p>\n
import<\/strong> com.microsoft.playwright.Locator;<\/p>\n
import<\/strong> com.microsoft.playwright.Page;<\/p>\n
import<\/strong> com.microsoft.playwright.Playwright;<\/p>\n
<\/p>\n
public<\/strong>
\nclass<\/strong> Blog30_DragDrop_PWJava {<\/p>\n
public<\/strong>
\nstatic<\/strong>
\nvoid<\/strong> main(String[] args) {<\/p>\n
<\/p>\n
Playwright playwright = Playwright.create<\/em>();<\/p>\n
Browser browser = playwright.chromium().launch(new<\/strong> BrowserType.LaunchOptions().setHeadless(false<\/strong>));<\/p>\n
<\/p>\n
Page page = browser.newPage();<\/p>\n
page.navigate(“https:\/\/jqueryui.com\/resources\/demos\/droppable\/default.html”);<\/p>\n
Locator draggable = page.locator(“#draggable”);<\/p>\n
Locator droppable = page.locator(“#droppable”);<\/p>\n
page.mouse().move(draggable.boundingBox().x + draggable.boundingBox().width\/2, draggable.boundingBox().y + draggable.boundingBox().height\/2);<\/p>\n
page.mouse().down();<\/p>\n
page.mouse().move(droppable.boundingBox().x+ droppable.boundingBox().width\/2, droppable.boundingBox().y + droppable.boundingBox().height\/2);<\/p>\n
page.mouse().up();<\/p>\n
try<\/strong> {<\/p>\n
Thread.sleep<\/em>(1000);<\/p>\n
} catch<\/strong> (InterruptedException e) {<\/p>\n
e.printStackTrace();<\/p>\n
}<\/p>\n
page.pause();<\/p>\n
\/\/page.close();<\/p>\n
\/\/playwright.close();<\/p>\n
<\/p>\n
}<\/p>\n
<\/p>\n
}<\/p>\n
<\/p>\n
Thanks.<\/p>\n<\/div>\n<\/div>\n<\/div>\n
<\/div>\n<\/section>\n
<\/body><\/html><\/p>\n","protected":false},"excerpt":{"rendered":"
In this blog we will be utilizing Playwright Java to handle double click, drag and drop. Topics that we will cover: Handle double click Handle drag and drop Source code (double click) Source code (drag and drop) Handle \u2018double click\u2019 To understand double click, go to https:\/\/api.jquery.com\/dblclick\/\u00a0 \u00a0As can be seen above, there is a […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5,9],"tags":[],"class_list":["post-3517","post","type-post","status-publish","format-standard","hentry","category-java","category-playwright","post-wrapper","thrv_wrapper"],"_links":{"self":[{"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/3517","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/comments?post=3517"}],"version-history":[{"count":0,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/3517\/revisions"}],"wp:attachment":[{"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/media?parent=3517"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/categories?post=3517"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/tags?post=3517"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}