toBeHidden() is a method in the Playwright library that can be used to check if an element is hidden or not. It is used in conjunction with Playwright's built-in assertion library.
For example, Let's assert that an element with the ID "my-element" is hidden:
expect(page).toHaveSelector('#my-element');
expect(page).toBeHidden('#my-element');- This method can be used to check whether an element is hidden and returns true if the element is hidden and false otherwise.
- It can help test UI elements, such as modals or drop-down menus, that are hidden by default and then shown when a user interacts with the page.
- It also can be used in conjunction with other methods like toBeVisible() to check the visibility of an element.
Example:
- We will use this programsbuzz page to hide the section and expect the topics present to be hidden.
await page.goto('https://www.programsbuzz.com/course/appium-tutorial')
const hide = await page.locator('div[class="paragraph paragraph--type--chapter paragraph--view-mode--default active"] div[class="field field--name-field-topic-name field--type-entity-reference field--label-hidden field__items"]')
await expect(hide).toBeVisible()
const hideTab = await page.locator('div[class="paragraph paragraph--type--chapter paragraph--view-mode--default active"] div[class="field field--name-field-chapter-name field--type-string field--label-hidden field__item"]');
hideTab.click()
await expect(hide).toBeHidden()
- So first, we navigated to the respected page.
- We stored the section topics in a variable hide.
- Expected to be visible, which will return true.
- Then when we hide the tab after a click on the up arrow of the main topic bar.
- We should expect the whole sub-section to be hidden.
- Which is what we did, and it was successful.
- Log in to post comments