🔠Want to automate and scale your Playwright end-to-end tests?
Head over to Better Stack and start monitoring in 5 minutes.
Ensuring an element's presence is a fundamental task in Playwright, crucial for actions like clicking on the element or determining the test outcome based on its existence.
Below are several strategies for this purpose:
Head over to Better Stack and start monitoring in 5 minutes.
To ascertain an element's visibility, apply the isVisible()
method to a
locator:
const visible = await page.getByRole('button').isVisible();
if (visible) {
// do something
}
For direct visibility assertions, utilize toBeVisible()
:
await expect(page.getByRole('button')).toBeVisible();
To assert the inverse, that an element is hidden, use the not
property:
await expect(page.getByRole('button')).not.toBeVisible();
To check if an element is present in the DOM, regardless of its visibility, use
the count()
method:
const count = await page.getByRole('button').count();
if (count > 1) {
// do something
}
For precise assertions on an element's presence, toHaveCount()
is recommended:
// Exactly one element matching the locator is present
await expect(page.getByRole('button')).toHaveCount(1);
To verify the absence of an element, proceed as follows:
await expect(page.getByRole('button')).toHaveCount(0);
Thanks for reading, and happy coding!
Playwright is a powerful, open-source, front-end monitoring tool, but it's not right for everyone. Check out these Playwright alternatives.
Learn to learn to develop and execute Playwright test scripts, utilize its time travel debugging capabilities, and proactively identify visual regressions in this hands-on guide
Explore the basics of Playwright in this guide covering its key features and setup, with examples demonstrating end-to-end web app testing