Rayrun
← Back to Discord Forum

Find All Links Using Locators

asdfhjalgdhalsaslkdfhposted in #help-playwright
Open in Discord
asdfhjalgdhalsaslkdfh
asdfhjalgdhalsaslkdfh

Guys I really need help.. I’ve been trying to read docs and I can’t find what I’m looking for.

I’m trying to locate all links on a page page.locator(“a”) isn’t working as its only returning one link

This thread is trying to answer question "How can I locate all links on a webpage using locators?"

9 replies
ibrahim.bektas
ibrahim.bektas

Can you post the html as well? without the all() method PW assume that your locator is uniqe. 🙂

asdfhjalgdhalsaslkdfh
asdfhjalgdhalsaslkdfh

no sorry can’t post the html

asdfhjalgdhalsaslkdfh
asdfhjalgdhalsaslkdfh

weird i completely just pass the all method

asdfhjalgdhalsaslkdfh
asdfhjalgdhalsaslkdfh

I just thought that it was something needed before calling locator

asdfhjalgdhalsaslkdfh
asdfhjalgdhalsaslkdfh

not locator.all()

asdfhjalgdhalsaslkdfh
asdfhjalgdhalsaslkdfh

locator().all() *

ibrahim.bektas
ibrahim.bektas

I would recomment to write an xpath which locates every elements with href init and use the .all() method you will get all the elements and if you want you can extract also the link from them

asdfhjalgdhalsaslkdfh
asdfhjalgdhalsaslkdfh

i’m writing web crawler so I’m just searching for every link

getByRole("link")

Answer

Locating Links with Playwright

You can easily find all links on a webpage using Playwright's locators. Let's use the page.locator() function with a CSS selector or XPath expression that targets the <a> elements.

Here's how you can do it with a CSS selector:

const links = await page.locator('a').elements();

This code will give you an array of ElementHandles for all the link elements on the page. You can then interact with these elements, like clicking them or extracting their attributes.

If you prefer XPath over CSS selectors, you can modify the locator like this:

const links = await page.locator('//a').elements();

This will also give you an array of ElementHandles for all the link elements found using XPath.

Remember, both CSS selectors and XPath expressions are tied to the DOM structure. If the DOM changes, these locators might break. So, try to create locators that are closer to how users see the page or use test ids.

Playwright also supports locating elements within Shadow DOM. But, there might be cases where certain locators don't work within Shadow DOM.

So, to sum up:

  1. Use page.locator() with a CSS selector ('a') or an XPath expression ('//a').
  2. Interact with the returned ElementHandles.
  3. Use resilient locators based on user perception or test ids.
  4. Be aware of potential limitations with Shadow DOM.

For more insights on Playwright, check out this blog post.

Related Discord Threads

TwitterGitHubLinkedIn
AboutQuestionsDiscord ForumBrowser ExtensionTagsQA Jobs

Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.