QA practice environment / 04demo-only fixture

Test Exceptions

This page reproduces common Selenium exceptions in a small, predictable fixture. Practice locating elements, respecting their state, waiting for delayed content, and recovering when the DOM changes underneath your test.

Interactive fixture / list mutation

Create list of your favorite foods

Each control exposes a state worth observing. Start with the locked value, then create a delayed DOM change.

Disabled first

Row 1 needs Edit.

Delayed Add

Five-second wait.

Food list fixture

stateful / client-side only

ready
Observe the DOM state before acting.The input is disabled until Edit is selected. Add creates a new row after a deterministic delay.

Push Add button to add another row

no network · deterministic fixture

Application checks / 05

Test Cases

Read each path first, then run the fixture above by hand or translate the steps into your Selenium suite.

test case / 01

Add the second row

Confirm that the first new row appears after the intentional delay.

  1. 01Open the page.
  2. 02Click Add beside Row 1.
  3. 03Wait about five seconds.

Expected result: Row 2 appears with Save, Add, and Remove controls. The green message reads “Row 2 was added” and remains visible for five seconds.

test case / 02

ElementNotInteractableException

This page contains two elements with the attribute name=”Save”. The first one is invisible, so trying to click it throws ElementNotInteractableException.

  1. 01Open page.
  2. 02Click Add button.
  3. 03Wait for the second row to load.
  4. 04Type text into the second input field.
  5. 05Push Save button using locator By.name(“Save”).
  6. 06Verify text saved.

Expected result: The same action used to throw ElementNotVisibleException, but now it throws a different exception. This may be a Selenium bug or an intentional behavior change.

test case / 03

InvalidElementStateException

The input field is disabled. Trying to clear the disabled field throws InvalidElementStateException. Enable editing first by clicking the Edit button.

  1. 01Open page.
  2. 02Clear input field.
  3. 03Type text into the input field.
  4. 04Verify text changed.

Expected result: Trying to type text into the disabled input field throws ElementNotInteractableException, as in Test case 2.

test case / 04

StaleElementReferenceException

The instructions element is removed from the page when the second row is added, so it can no longer be interacted with.

  1. 01Open page.
  2. 02Find the instructions text element.
  3. 03Push Add button.
  4. 04Verify instructions text element is no longer displayed.

Expected result: Trying to interact with the removed instructions element throws StaleElementReferenceException.

test case / 05

TimeoutException

The second row appears after about five seconds, so a three-second timeout is not long enough.

  1. 01Open page.
  2. 02Click Add button.
  3. 03Wait for 3 seconds for the second input field to be displayed.
  4. 04Verify second input field is displayed.

Expected result: Executing these steps with a three-second wait throws TimeoutException because the second row does not appear until about five seconds have passed.

A safe place to make the failure useful.

Nothing here talks to a server or stores input. Reset by refreshing the route, then inspect the states again with your own selectors and waits.

delayed

Add resolves after 5 seconds.

disabled

Row 1 starts locked.

removed

The original instruction leaves the DOM.