Handling Dynamic Content
Best Playwright Testing Training Institute in Hyderabad
In the fast-evolving field of software testing, tools like Playwright and Selenium are essential for automation testers. If you are a graduate, postgraduate, or someone looking to switch your career from a different domain to IT, it’s crucial to receive professional guidance and hands-on experience in automation tools. That’s where I Hub Talent excels. I Hub Talent is widely recognized as the best Playwright Testing Training Institute in Hyderabad. It offers a live, intensive internship program conducted by industry experts and specifically tailored for:
What is Dynamic Content?
Dynamic content means elements on a webpage change frequently — either after an event, or due to asynchronous calls (like AJAX, JavaScript rendering, or delayed ads).
Examples:
News feeds refreshing
Elements loading after API calls
Auto-updating prices or stock tickers
Dynamic IDs or attributes
🔹 Challenges with Dynamic Content
Elements may not be present immediately.
IDs or classes change on every reload.
Page loads asynchronously, causing NoSuchElementException.
Timing issues → flaky tests.
🔹 Techniques to Handle Dynamic Content
1. Use Explicit Waits
Wait until the condition is true (instead of using Thread.sleep()).
Selenium (Java):
WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10));
WebElement element = wait.until(ExpectedConditions.visibilityOfElementLocated(By.id("dynamicElementId")));
Cypress:
cy.get('#dynamicElementId', { timeout: 10000 }).should('be.visible')
2. Stable Locators (Avoid Dynamic IDs)
Instead of IDs that change (like id=user_12345), use:
CSS selectors
driver.findElement(By.cssSelector("button[class*='submit-btn']"));
XPath with contains / starts-with
driver.findElement(By.xpath("//div[contains(@id,'user_')]"));
3. Wait for AJAX or Page Loads
Selenium (JS ready state check):
new WebDriverWait(driver, Duration.ofSeconds(10)).until(
webDriver -> ((JavascriptExecutor) webDriver)
.executeScript("return document.readyState").equals("complete"));
Cypress (auto wait with intercept):
cy.intercept('GET', '/api/users').as('getUsers')
cy.visit('/dashboard')
cy.wait('@getUsers')
4. Retry Mechanism (Resilient Tests)
Cypress retries commands automatically.
In Selenium, wrap actions in loops or use libraries like FluentWait:
Wait<WebDriver> wait = new FluentWait<>(driver)
.withTimeout(Duration.ofSeconds(30))
.pollingEvery(Duration.ofSeconds(2))
.ignoring(NoSuchElementException.class);
WebElement dynamicElement = wait.until(driver -> driver.findElement(By.id("dynamicElement")));
5. Synchronize with UI States
Wait for:
Loading spinners to disappear
Element text/value to change
DOM mutation (attribute/class changes)
Selenium example:
wait.until(ExpectedConditions.invisibilityOfElementLocated(By.id("loadingSpinner")));
Cypress example:
cy.get('#loadingSpinner').should('not.exist')
Read more:
Working with Page Waits and Timeouts
Running Tests in Different Browsers
Configuring playwright.config.ts
Headless vs Headed Browsers in Playwright
Comments
Post a Comment