In this blog we will be utilizing Playwright Java to handle gestures.<\/em><\/p>\n

\n

\n<\/ins>\n<\/div>\n
Topics that we will cover:<\/strong><\/p>\n
\n
Handle sliders<\/li>\n
Handle resizable element<\/li>\n
Source code (slider)<\/li>\n
Source code (resizable)<\/li>\n<\/ul>\n
Handle sliders<\/strong><\/p>\n
To understand sliders, go to https:\/\/jqueryui.com\/resources\/demos\/slider\/default.html<\/a>\u00a0<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0 As can be seen above, there is a slider that we can move to right and left on the horizontal x-axis.<\/p>\n
Let us inspect the slider and copy the xpath<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0Thus we can locate this element as shown below<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
$\"\"$ <\/span><\/div>\n
\n
We will than fire an event called as ‘mouse down’ to move the mouse<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0We will than move the slider to 600 pixels on the x-axis. However y-axis will always be 0. So we can simply copy the slider.boundingBox() code for y-axis as is<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0Finally we will release the mouse<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
Handle resizable element<\/strong><\/p>\n
Let us now go to https:\/\/jqueryui.com\/resources\/demos\/resizable\/default.html<\/a>\u00a0<\/p>\n
We see a re-sizable element that we can drag horizontally (x-axis) and vertically as well (y-axis)<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
Since we can resize vertically as well, let us add 300 pixels to y-axis<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0So we have made changes to only 3 lines, see below<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0Execute.\u00a0<\/p>\n
Notice below that resizable element moves the desired number of pixels to x and y-axis<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0So this is how we can handle slider and resizable elements using playwright java.<\/p>\n
Source code (sliders)<\/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> Blog29_Slider {<\/p>\n
<\/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\/slider\/default.html”);<\/p>\n
try<\/strong> {<\/p>\n
Thread.sleep<\/em>(3000);<\/p>\n
} catch<\/strong> (InterruptedException e) {<\/p>\n
e.printStackTrace();<\/p>\n
}<\/p>\n
Locator slider = page.locator(“\/\/*[@id=”slider”]\/span”);<\/p>\n
page.mouse().move(slider.boundingBox().x + slider.boundingBox().width\/2, slider.boundingBox().y+slider.boundingBox().height\/2); \/\/to move mouse to middle of this element<\/p>\n
page.mouse().down(); \/\/to move the mouse<\/p>\n
page.mouse().move(slider.boundingBox().x+ 600, slider.boundingBox().y+slider.boundingBox().height\/2);<\/p>\n
page.mouse().up(); \/\/release the mouse<\/p>\n
page.pause();<\/p>\n
page.close();<\/p>\n
playwright.close();<\/p>\n
<\/p>\n
}<\/p>\n
<\/p>\n
}<\/p>\n
<\/p>\n
Source code (resizable)<\/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> Blog29_Resizable {<\/p>\n
<\/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\/resizable\/default.html”);<\/p>\n
try<\/strong> {<\/p>\n
Thread.sleep<\/em>(3000);<\/p>\n
} catch<\/strong> (InterruptedException e) {<\/p>\n
e.printStackTrace();<\/p>\n
}<\/p>\n
\/\/locate slider element<\/p>\n
Locator slider = page.locator(“\/\/*[@id=”resizable”]\/div[3]”);\u00a0<\/p>\n
\/\/to move mouse to middle of slider element<\/p>\n
page.mouse().move(slider.boundingBox().x + slider.boundingBox().width\/2, slider.boundingBox().y+slider.boundingBox().height\/2);\u00a0<\/p>\n
\/\/to move the mouse<\/p>\n
page.mouse().down();\u00a0<\/p>\n
\/\/move mouse to 300 pixels horizontal and vertical\u00a0<\/p>\n
page.mouse().move(slider.boundingBox().x + 300, slider.boundingBox().y + 300);<\/p>\n
\/\/release the mouse<\/p>\n
page.mouse().up();\u00a0<\/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 gestures. Topics that we will cover: Handle sliders Handle resizable element Source code (slider) Source code (resizable) Handle sliders To understand sliders, go to https:\/\/jqueryui.com\/resources\/demos\/slider\/default.html\u00a0 \u00a0 As can be seen above, there is a slider that we can move to right and left on […]<\/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-3501","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\/3501","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=3501"}],"version-history":[{"count":0,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/3501\/revisions"}],"wp:attachment":[{"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/media?parent=3501"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/categories?post=3501"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/tags?post=3501"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}