Click Traps
Practice clicking elements that are covered, moving, stacked under other layers or not yet enabled.
1. Overlapped Element
Challenge Tasks (1)
Tick a task when your script passes it. Tasks with a pass/fail box tick themselves.
2. Moving Button
Challenge Tasks (1)
Tick a task when your script passes it. Tasks with a pass/fail box tick themselves.
3. Hidden Layers
Challenge Tasks (1)
Tick a task when your script passes it. Tasks with a pass/fail box tick themselves.
4. Disabled → Enabled
Challenge Tasks (1)
Tick a task when your script passes it. Tasks with a pass/fail box tick themselves.
5. Solutions
Try the challenges yourself first. Reference solutions are hidden until you ask for them.
About this Click Traps page
A click trap is an element that is visible but cannot receive a click, because another element covers it, it is still moving, or it is not enabled yet. Selenium reports this as ElementClickInterceptedException and Playwright retries until it times out. You practice by reproducing each trap, then fixing it with actionability waits, scrolling, or closing the overlay instead of forcing the click.
Frequently asked questions
What does ElementClickInterceptedException mean in Selenium?
It means the browser found the element, but another element would receive the click at that point, such as a modal, sticky header or cookie banner. Selenium 4 names the intercepting element in the message. Wait for the overlay to go away, scroll the target into view, or close the overlay.
How does Playwright handle a covered element?
Playwright runs actionability checks before click: visible, stable, enabled, and receives events. If another element intercepts pointer events, it retries until the timeout, then fails with a log naming the blocker. Dismiss the overlay or wait for it to detach rather than using force: true.
Should I use a JavaScript click to get around a click trap?
Usually not. A JavaScript click skips the checks a real user hits, so it can pass while the button is unusable. Use it only when the element is genuinely clickable but the driver misreports it, and say why in a comment.
How do I click an element that is moving?
Wait until the element is stable. Playwright does this automatically by checking that the bounding box is unchanged across two animation frames. In Selenium and Cypress, wait for the animation to finish or for a class or position change, then click.
How do I test a button that is disabled or delayed?
Assert or wait for the enabled state before clicking. Use expect(button).toBeEnabled() in Playwright, an ExpectedConditions.elementToBeClickable wait in Selenium, or should('not.be.disabled') in Cypress. Avoid fixed sleeps, which are slow and still flaky.
Free developer tools on Randomly.online
QA Playground is part of Randomly.online. These tools help while you write and debug tests: