Tutorial 9 – Click a text link and Hover-over an element in Playwright Python
What you will Learn in this blog:
Click the text link
Hover over an element
Code snippet
Click the text link
Let us see how to click a link based on its text.
Go to https://the-internet.herokuapp.com/ and let us say we want to click ‘A/B Testing’ link
On clicking the link, the below page should come up
We have to simply use the below syntax
Execute the test 
Notice below that the link gets clicked
Similarly
So this is how we can use the locator() method to click a link based on its text.
Hover over an element
Launch https://the-internet.herokuapp.com/hovers
Hover over any of the 3 elements. Notice below that we see user profile details
Click ‘View profile’, the below page comes up showing ‘1’ in the url address
Similarly, when we hover over for user2 and user3
Now, let us see how to hover these elements and click ‘View Profile’ using playwright.
Let us first inspect the 3 images. One thing we notice here is that, all the 3 images have the same property
alt=”User Avatar”
Now, there is a ‘hover’ method in Playwright
So we can now use the image property that we inspected above
Save and run, notice below hover operation is success and we can see ‘name: user1’
Before we click ‘View profile’ for user1, let us inspect ‘View profile’
Now we can locate and click this element
Save and run the script
The playwright throws above error. The reason being, all the 3 images have the same text ‘View profile’ and playwright is confused as to which one should it click
So to resolve this, we have to explicitly tell playwright to click the first image. We can use the ‘first’ method to achieve this, see below
Save an run, notice below that ‘View profile’ of first image has been clicked successfully
So this is how we work with hover operation.
Code snippet (click a link)
import time
from playwright.sync_api import Playwright, sync_playwright, expect
def run(playwright: Playwright) -> None:
browser = playwright.chromium.launch(headless=False, slow_mo=3000)
context = browser.new_context()
page = context.new_page()
page.goto("https://the-internet.herokuapp.com/")
page.locator("text = A/B Testing").click()
# ---------------------
context.close()
browser.close()
with sync_playwright() as playwright:
run(playwright)
Code snippet (hover)
import time
from playwright.sync_api import Playwright, sync_playwright, expect
def run(playwright: Playwright) -> None:
browser = playwright.chromium.launch(headless=False, slow_mo=3000)
context = browser.new_context()
page = context.new_page()
page.goto("https://the-internet.herokuapp.com/hovers")
page.hover("[alt=\"User Avatar\"]")
page.locator("text=View Profile").first.click()
# ---------------------
context.close()
browser.close()
with sync_playwright() as playwright:
run(playwright)
Thank you for reading!
