{"flag":true,"single":true,"pageTitle":"Locators | Find elements and get there data","post":{"id":295,"user_id":"1","slug":"locators-find-elements-and-get-there-data-luao","title":"Locators | Find elements and get there data","body":"

Locators are the central piece of Playwright's auto-waiting and retry-ability. https:\/\/playwright.dev\/python\/docs\/locators<\/a><\/p>\r\n

FIND ELEMENTS <\/strong><\/span><\/p>\r\n

1. FIND BY ROLE<\/span><\/span><\/strong><\/p>\r\n

Locate by role <\/span> only use when you know clear roles ie don't use it for div finding<\/strong>
When locating by role, you should usually pass the accessible name as well, so that the locator pinpoints the exact element.<\/p>\r\n

page.getByRole(role{string}, options{object})<\/code><\/pre>\r\n
ie<\/p>\r\n<\/colgroup>\r\n\r\n\r\n
\r\n
<h3>Sign up<\/h3>\r\n<label>\r\n  <input type=\"checkbox\" \/> Subscribe\r\n<\/label>\r\n<br\/>\r\n<button>Submit<\/button><\/code><\/pre>\r\n<\/td>\r\n
\r\n
await expect(page.getByRole('heading', { name: 'Sign up' })).toBeVisible();\r\nawait page.getByRole('checkbox', { name: 'Subscribe' }).check();\r\nawait page.getByRole('button', { name: \/submit\/i }).click();<\/code><\/pre>\r\n<\/td>\r\n<\/tr>\r\n<\/tbody>\r\n<\/table>\r\n
 <\/p>\r\n<\/colgroup>\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n
Role<\/strong><\/td>\r\nie<\/td>\r\nRole<\/strong><\/td>\r\nie<\/td>\r\n<\/tr>\r\n
button<\/strong><\/td>\r\nClickable button<\/td>\r\ncombobox<\/strong><\/td>\r\nDropdown<\/td>\r\n<\/tr>\r\n
link    <\/strong><\/td>\r\n<a> link<\/td>\r\nlist<\/strong><\/td>\r\n<ul> \/ <ol><\/td>\r\n<\/tr>\r\n
heading    <\/strong><\/td>\r\n<h1> to <h6><\/td>\r\nlistitem<\/strong><\/td>\r\n<li><\/td>\r\n<\/tr>\r\n
textbox<\/strong><\/td>\r\nInput field<\/td>\r\ndialog<\/strong><\/td>\r\nModal<\/td>\r\n<\/tr>\r\n
checkbox<\/strong><\/td>\r\nCheckbox<\/td>\r\nimg<\/strong><\/td>\r\nImage<\/td>\r\n<\/tr>\r\n
radio<\/strong><\/td>\r\nRadio button<\/td>\r\ntable<\/strong><\/td>\r\nTable<\/td>\r\n<\/tr>\r\n
row<\/strong><\/td>\r\nTable row<\/td>\r\ncell<\/strong><\/td>\r\nTable cell<\/td>\r\n<\/tr>\r\n<\/tbody>\r\n<\/table>\r\n
OPTIONS<\/strong><\/p>\r\n<\/colgroup>\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n
name<\/td>\r\nText visible to users 
Visible text
aria-label
aria-labelledby
associated <label><\/td>\r\n		\r\n
<button>Submit<\/button>\r\n<button aria-label=\"Submit\"><\/button><\/code><\/pre>\r\n<\/td>\r\n<\/tr>\r\n
exact<\/td>\r\nMatch exact text (no partial match), ??? Matches: Submit
??? Not match: Submit Form<\/td>\r\n		\r\n
{ name: 'Submit', exact: true }<\/code><\/pre>\r\n<\/td>\r\n<\/tr>\r\n
level<\/td>\r\n\r\n
Specifies heading level (h1 → 1, h2 → 2)<\/p>\r\n
Only level works for headings,
page.getByRole('heading', { name: 'Dashboard' })<\/p>\r\n<\/td>\r\n
\r\n
await page.getByRole('heading', { level: 1 })<\/code><\/pre>\r\n
It finds h1 only not h2<\/p>\r\n
<h1>Welcome<\/h1><\/code><\/pre>\r\n<\/td>\r\n<\/tr>\r\n
checked<\/td>\r\n\r\n
Filters checked checkbox\/radio<\/p>\r\n<\/td>\r\n
\r\n
page.getByRole('checkbox', { checked: true })<\/code><\/pre>\r\n<\/td>\r\n<\/tr>\r\n
selected<\/td>\r\n\r\n
For selected option in dropdown\/list<\/p>\r\n<\/td>\r\n
\r\n
page.getByRole('option', { selected: true })<\/code><\/pre>\r\n<\/td>\r\n<\/tr>\r\n
disabled<\/td>\r\n\r\n
Finds disabled elements<\/p>\r\n<\/td>\r\n
\r\n
page.getByRole('button', { disabled: true })<\/code><\/pre>\r\n<\/td>\r\n<\/tr>\r\n<\/tbody>\r\n<\/table>\r\n

EXAMPLE: <\/strong><\/p>\r\n
heading → role , level: 1 → <h1> ,checking text = Welcome<\/strong><\/p>\r\n
await expect(page.getByRole('heading', { level: 1 })).toHaveText('Welcome');<\/code><\/pre>\r\n
Buttons:
<\/strong><\/p>\r\n
page.getByRole('button', { name: 'Login' })\r\npage.getByRole('button', { name: \/login\/i }) \/\/ regex (case insensitive)\r\npage.getByRole('button', { name: 'Save', exact: true })<\/code><\/pre>\r\n
Inputs:<\/strong><\/p>\r\n
page.getByRole('textbox', { name: 'Email' })\r\npage.getByRole('textbox', { name: 'Search' })\r\npage.getByRole('textbox').nth(0) \/\/ if no label<\/code><\/pre>\r\n
1. FIND BY LOCATOR<\/span><\/span><\/strong><\/p>\r\n
 It creates a Locator <\/strong>object that targets elements using a selector. <\/p>\r\n
locator = page.locator(\"CSS selector, text selector, XPath\")<\/code><\/pre>\r\n<\/colgroup>\r\n\r\n\r\n\r\n
CSS LOCATOR<\/td>\r\nTEXT<\/td>\r\nXPATH<\/td>\r\n<\/tr>\r\n
\r\n
page.locator(\"button\")\r\npage.locator(\"#login\")\r\npage.locator(\".card\")\r\npage.locator(\"div > span\")\r\npage.locator(\"input[type='text']\")<\/code><\/pre>\r\n<\/td>\r\n
\r\n
page.locator(\"text=Submit\")<\/code><\/pre>\r\n<\/td>\r\n
\r\n
page.locator(\"\/\/button[text()='Submit']\")<\/code><\/pre>\r\n<\/td>\r\n<\/tr>\r\n<\/tbody>\r\n<\/table>\r\n
Advance locators : <\/p>\r\n
page.locator(\"div:has-text('Hello')\")\r\npage.locator(\"div:has(button)\")\r\npage.locator(\"button:visible\")\r\npage.locator(\"button\").nth(0)<\/code><\/pre>\r\n
Locator is LAZY (VERY IMPORTANT) <\/strong><\/p>\r\n
locator = page.locator(\"button\") #??? No DOM query yet, ??? No error even if element doesn’t exist\r\nlocator.click() #Only runs when<\/code><\/pre>\r\n
Locator is Strict Mode ??? Error if multiple elements <\/strong><\/p>\r\n
page.locator(\"button\").click() #WRONG\r\npage.locator(\"button\").first.click()\r\npage.locator(\"button\").nth(1).click()<\/code><\/pre>\r\n
Chaining Locators (VERY POWERFUL) means, Find all div => Inside them find button<\/strong><\/p>\r\n
page.locator(\"div\").locator(\"button\")<\/code><\/pre>\r\n
Multiple Elements Handling<\/strong><\/p>\r\n
locator.count()\r\nlocator.nth(0)\r\nlocator.first\r\nlocator.last<\/code><\/pre>\r\n
profile_link = question_box.locator('a[href*=\"\/profile\/\"]').first \r\nawait profile_link.wait_for(state=\"visible\", timeout=3000) #MAX WAIT<\/code><\/pre>\r\n
Locator Actions:<\/strong><\/p>\r\n
locator.click()\r\nlocator.fill(\"text\")\r\nlocator.type(\"text\")\r\nlocator.hover()\r\nlocator.press(\"Enter\")\r\nlocator.check()\r\nlocator.uncheck()\r\n\r\nlocator.wait_for(state=\"visible\") #attached , detached , visible , hidden<\/code><\/pre>\r\n
Find single element: <\/strong><\/p>\r\n
locater = page.get_by_placeholder(\"e.g Cheetos\")\r\nlocater = page.get_by_text(\"Bitcoin in Islam\")  # working for all page text any where, or inside any element<\/code><\/pre>\r\n
Find Multiple Elements:<\/strong><\/p>\r\n
articles = page.get_by_role(\"article\") # all articles \r\nfor i in range(articles.count()):\r\n    article = articles.nth(i)\r\n    text = article.text_content()[:100]  # First 100 chars for brevity\r\n    print(f\"Article {i}: {text}...\")<\/code><\/pre>\r\n
By Place Holder:<\/strong><\/p>\r\n
locater = page.get_by_placeholder(\"e.g Cheetos\")<\/code><\/pre>\r\n
Find element by text:
<\/strong># working for all page text any where, or inside any element
<\/strong><\/p>\r\n
locater = page.get_by_text(\"Bitcoin in Islam\")  <\/code><\/pre>\r\n
Find By alt text:<\/strong><\/p>\r\n
page.get_by_alt_text(\"My image 1\")<\/code><\/pre>\r\n
Locate By CSS\/xpath:<\/strong><\/p>\r\n
page.locator(\"css=button\").click()\r\npage.locator(\"xpath=\/\/button\").click()<\/code><\/pre>\r\n
page.locator(\r\n    \"#tsf > div:nth-child(2) > div.A8SBwf > div.RNNXgb > div > div.a4bIc > input\"\r\n).click()<\/code><\/pre>\r\n
If multiple items, First find it and then use it Filter<\/strong><\/p>\r\n
page.get_by_role(\"listitem\").filter(has_text=\"Product 2\").get_by_role(\r\n    \"button\", name=\"Add to cart\"\r\n).click()<\/code><\/pre>\r\n
Wait for locaters<\/strong><\/p>\r\n
order_sent = page.locator(\"#order-sent\")\r\norder_sent.wait_for() #\"attached\" present in DOM| \"detached\" not present| \"visible\" (default) | \"hidden\" (optional)<\/code><\/pre>\r\n
Find Element with multiple conditions<\/strong><\/p>\r\n
button = page.get_by_role(\"button\").and_(page.getByTitle(\"Subscribe\")) #Locator, <\/code><\/pre>\r\n
 <\/p>\r\n
# 1. profile link (VERY specific)
#FIND
profile_link = question_box.locator('a[href*=\"\/profile\/\"]').first <\/p>\r\n
#ASSERT
await profile_link.wait_for(state=\"visible\", timeout=3000)
#get attribute
profile_url = await profile_link.get_attribute('href')
print(\"Profile URL:\", profile_url)
#get text of element
profile_name = await profile_name_el.inner_text()<\/p>\r\n
await profile_link.click()<\/p>\r\n
Play with Finded Elements<\/strong><\/span><\/p>\r\n
 <\/p>\r\n
For Multiple Items loop<\/strong><\/p>\r\n
for row in page.get_by_role(\"listitem\").all():\r\n    print(row.text_content())<\/code><\/pre>\r\n
Inner Text : # <\/strong>Returns an array of node.innerText<\/strong> list values<\/p>\r\n
texts = page.get_by_role(\"link\").all_inner_texts() <\/code><\/pre>\r\n
All Text Contents: #<\/strong>Returns an array of node.textContent<\/strong><\/p>\r\n
texts = page.get_by_role(\"link\").all_text_contents() <\/code><\/pre>\r\n
Get Attribute:<\/strong><\/p>\r\n
locator.get_attribute(name)<\/code><\/pre>\r\n
Highlight the element: #################<\/strong><\/p>\r\n
page.get_by_role(\"button\").highlight()<\/code><\/pre>\r\n
Inner Html<\/strong><\/p>\r\n
locator.inner_html()<\/code><\/pre>\r\n
Only Visible text: return string<\/strong><\/p>\r\n
locator.inner_text()<\/code><\/pre>\r\n
Outer HTML<\/strong><\/p>\r\n
 outer_html = su.evaluate(\"element => element.outerHTML\") <\/code><\/pre>\r\n
First Element find<\/strong><\/p>\r\n
banana = page.get_by_role(\"listitem\").nth(0)<\/code><\/pre>\r\n
banana = page.get_by_role(\"listitem\").last\r\napple = page.get_by_role(\"listitem\").first<\/code><\/pre>\r\n
Screenshoot<\/strong><\/p>\r\n
page.get_by_role(\"link\").screenshot()<\/code><\/pre>\r\n
Text Of Element<\/strong><\/p>\r\n
locator.text_content()<\/code><\/pre>\r\n
 <\/p>","category_id":"37","is_private":"0","created_at":"2025-03-06T00:19:43.000000Z","updated_at":"2026-04-06T00:05:29.000000Z","category":{"id":37,"user_id":"1","name":"Playwright","slug":"playwright-c2zf","parent_id":null,"created_at":"2025-03-05T22:35:12.000000Z","updated_at":"2025-03-05T22:35:12.000000Z"},"user":{"id":1,"name":"R GONDAL","email":"rizikmw@gmail.com","email_verified_at":null,"two_factor_confirmed_at":null,"current_team_id":"1","profile_photo_path":null,"created_at":"2023-03-12T10:49:33.000000Z","updated_at":"2025-01-10T12:59:00.000000Z","profile_photo_url":"https:\/\/ui-avatars.com\/api\/?name=R+G&color=7F9CF5&background=EBF4FF"}},"pageDesc":"Locators are the central piece of Playwright's auto-waiting and retry-ability. https:\/\/playwright.dev\/python\/docs\/locators FIND ELEMENTS&nbs - Locators | Find elements and get there data (Updated: April 6, 2026) - Read more about Locators | Find elements and get there data at my programming site [SITE]","categories":[]}