Question 135053 in Visual Studio Code Question posted in
View the official documentation.

Visual Studio Code – How can I watch the content of Locator objects in the debugger?

Consider the following code:

test("homepage has title and links to intro page", async ({ page }) => {
  await page.goto("https://playwright.dev/");

  const links = page.getByRole("link");
  const count = await links.count();
  console.log("count is " + count);
});

I know from my count variable that there are 31 links on the page. But shouldn’t I also be able to get this information in the debugger via the
links variable? How would I "browse" the links variable to see all links and their count?

There are many "properties" in the links variable on the left side, but I can’t see how to find something useful there:
enter image description here

Tags:

2

Answers


  1. 0

    It’s not possible because the links variable does not contain that data: the counts are queried when you call .count(). The only way is to "browse" the links is to evaluate the await links.count() expression in the debugger and view the result or step over the links.count() call and see the value of the counts variable.

    Login or Signup to reply.
  2. 0

    From what I understood you want to access the DOM element, and read it’s properties. If that’s what you need you can use the locator.elementHandles(), which will return Promise<Array<ElementHandle>>

    and you can then get an Element attribute

    
test("homepage has title and links to intro page", async ({ page }) => {
  await page.goto("https://playwright.dev/");

  const links = page.getByRole("link");
  const count = await links.count();

  const handles = await links.elementHandles()

  const attributePromises = handles.map(handle => handle.getAttribute('href'));

  console.log(await Promise.all(attributePromises))
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search