Not waiting for hidden state
foreach (var instruction in HomePageImInstructionStrings)
{
await this.Participant.Page.Locator(HomePageOption).Locator($"text={instruction}").WaitForAsync(new LocatorWaitForOptions { State = WaitForSelectorState.Hidden });
}```
Trying to wait until these elements are hidden on the page, of course if they aren't hidden this should throw after the timeout is reached however for some reason even if the elements are NOT hidden, this is still passing. The elements are within an Iframe, does this have an affect? They are using display: none; to hide them from the user.This thread is trying to answer question "Why is the code passing even if the elements are not hidden and does being within an Iframe affect this?"
Related Ask AI answer for "What is the role of Playwright's auto-waiting feature in interacting with elements within an iframe?".
Answer
Understanding Playwright's Auto-Waiting Feature
When you're working with @playwright/test, you might wonder why your code is passing even if some elements are not hidden. This is due to Playwright's auto-waiting feature.
Auto-Waiting in Action
Playwright waits for elements to be attached, visible, stable, and ready to receive events before interacting with them. This ensures that actions are performed only when elements are ready.
import { test } from '@playwright/test';
test('auto-waiting example', async ({ page }) => {
await page.goto('https://ray.run/');
const element = await page.$('selector');
await element.click(); // Playwright waits for the element to be ready
});Dealing with Iframes
Iframes can complicate things. They're essentially separate HTML documents embedded within your main document. Playwright treats each frame as a separate entity and checks elements within each frame individually.
import { test } from '@playwright/test';
test('iframe example', async ({ page }) => {
await page.goto('https://ray.run/');
const frame = await page.frame('frameName');
const element = await frame.$('selector');
await element.click(); // Playwright waits for the element in the iframe to be ready
});The Bottom Line
Even if elements are not initially hidden within an iframe, they still need to meet certain conditions before being interacted with. Playwright's auto-waiting feature ensures that actions are performed only when elements are ready and able to receive those actions.
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 [email protected].