In this blog, we will see how to perform a hover action on an element using Playwright Java. We will also see a different approach to click on the text hyperlink.<\/em><\/p>\n

\n

\n<\/ins>\n<\/div>\n
Topics that we will cover:<\/strong><\/p>\n
\n
Alternate approach to click the link<\/li>\n
Hover an element<\/li>\n
Source code (click)<\/li>\n
Source code (hover)<\/li>\n<\/ul>\n
Alternate approach to click the link\u00a0<\/strong><\/p>\n
We will now see an alternative approach to clicking on a link.<\/p>\n
In one of our previous blog, we have observed how the locator()<\/em> method can be used to click<\/em> on a link by its text \u00a0<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
There is also an alternative method to click on a link without using the locator method.<\/p>\n
The ‘locator<\/em>‘ needs to be simply replaced with ‘click<\/em>‘ as demonstrated below<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0Execute the code.<\/p>\n
Observe that the link is being clicked<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0In the same way<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0Execute<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0So this is how the click() method can be utilized as a substitute for the locator() method.<\/p>\n
Hover an element<\/strong><\/p>\n
Navigate to
https:\/\/the-internet.herokuapp.com\/hovers<\/a>\u00a0<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0Hover over any image, you will see corresponding name<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0When we click \u2018View profile\u2019, we can see \u2018users\/2\u2019 in the address<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0Let us automate the hover operation over the first user image and click \u2018View Profile\u2019.\u00a0<\/p>\n
Inspect the first image.\u00a0<\/p>\n
The image can be identified using \u2018alt\u2019 attribute \u00a0<\/em><\/strong><\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
We can now make use of the \u2018hover\u2019 method to hover over the element<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
So basically we are locating the element using its xpath and than hovering over it (see below to quickly find xpath)<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0So let us comment line#27 and uncomment line#26 as shown below<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0Execute.\u00a0<\/p>\n
The first image gets hovered, see below\u00a0<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
Inspect \u2018View profile\u2019<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0Let us now click the element \u2018View profile\u2019\u00a0<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0We have used the \u201cfirst()\u201d method since we are tlling playwright to click the first image.<\/p>\n
Execute the code.<\/p>\n
\u2018View profile\u2019 element gets clicked<\/p>\n<\/div>\n
$\"\"$ <\/span><\/div>\n
\n
\u00a0<\/p>\n
This is how \u2018hover\u2019 method can be used in playwright java.<\/p>\n
Source code (click)<\/strong><\/p>\n
package<\/strong> com.rsa.playwrightjava;<\/p>\n
<\/p>\n
import<\/strong> org.junit.jupiter.api.Test;<\/p>\n
import<\/strong> com.microsoft.playwright.Browser;<\/p>\n
import<\/strong> com.microsoft.playwright.BrowserType;<\/p>\n
import<\/strong> com.microsoft.playwright.BrowserType.LaunchOptions;<\/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> Blog12_clicklink {<\/p>\n
@Test<\/p>\n
public<\/strong>
\nvoid<\/strong> PlaywrightJTest() {<\/p>\n
Playwright pt = Playwright.create<\/em>();<\/p>\n
LaunchOptions lo = new<\/strong> LaunchOptions();<\/p>\n
lo.setChannel(“msedge”);<\/p>\n
lo.setHeadless(false<\/strong>);<\/p>\n
BrowserType btype = pt.chromium();<\/p>\n
Browser b = btype.launch((new<\/strong> BrowserType.LaunchOptions().setHeadless(false<\/strong>)));<\/p>\n
Page pg = b.newPage();<\/p>\n
pg.navigate(“https:\/\/the-internet.herokuapp.com\/”);<\/p>\n
\/\/pg.click(“text = Context Menu”);<\/p>\n
pg.click(“text = dropdown”);<\/p>\n
pg.pause();<\/p>\n
}<\/p>\n
}<\/p>\n

Source code (hover)<\/strong><\/p>\n
package<\/strong> com.rsa.playwrightjava;<\/p>\n
<\/p>\n
import<\/strong> org.junit.jupiter.api.Test;<\/p>\n
import<\/strong> com.microsoft.playwright.Browser;<\/p>\n
import<\/strong> com.microsoft.playwright.BrowserType;<\/p>\n
import<\/strong> com.microsoft.playwright.BrowserType.LaunchOptions;<\/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> Blog12_hover {<\/p>\n
@Test<\/p>\n
public<\/strong>
\nvoid<\/strong> PlaywrightJTest() {<\/p>\n
Playwright pt = Playwright.create<\/em>();<\/p>\n
LaunchOptions lo = new<\/strong> LaunchOptions();<\/p>\n
lo.setChannel(“msedge”);<\/p>\n
lo.setHeadless(false<\/strong>);<\/p>\n
BrowserType btype = pt.chromium();<\/p>\n
Browser b = btype.launch((new<\/strong> BrowserType.LaunchOptions().setHeadless(false<\/strong>)));<\/p>\n
Page pg = b.newPage();<\/p>\n
pg.navigate(“https:\/\/the-internet.herokuapp.com\/hovers”);<\/p>\n
pg.hover(“[alt=”User Avatar”]”);<\/p>\n
\/\/pg.locator(“\/\/div[@class=’example’]\/\/div[1]\/\/img[1]”).hover(); \/\/even this works<\/p>\n
pg.locator(“text=View Profile”).first().click();<\/p>\n
pg.pause();<\/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 see how to perform a hover action on an element using Playwright Java. We will also see a different approach to click on the text hyperlink. Topics that we will cover: Alternate approach to click the link Hover an element Source code (click) Source code (hover) Alternate approach to click […]<\/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-3194","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\/3194","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=3194"}],"version-history":[{"count":0,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/3194\/revisions"}],"wp:attachment":[{"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/media?parent=3194"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/categories?post=3194"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rahulshettyacademy.com\/blog\/index.php\/wp-json\/wp\/v2\/tags?post=3194"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}