User interface tests
Automating a test that drives the interface like a user with Selenium or Playwright: locating an element, acting, waiting, checking, structuring with the Page Object pattern and hunting fragile tests.
- 25 cards
- 4 topics
- Free
The outline, topic by topic
Each topic is weighted the way the exam weighs it.
- Concepts
- Questions
- Sort and link
- Scenarios
A few cards from the deck
UI test: what is it?
Show the answer
An automated test that drives a browser or an application the way a user would: it clicks, types text and reads what is displayed.
It checks the real journey, interface included. In exchange, it is slow and sensitive to any change of the screen.
What does the last line of this Playwright test do?
```javascript
await page.goto('/connexion');
await page.getByLabel('E-mail').fill('ada@example.org');
await page.getByLabel('Mot de passe').fill('secret');
await page.getByRole('button', { name: 'Connexion' }).click();
await expect(page.getByRole('heading', { name: 'Tableau de bord' })).toBeVisible();`- Retries up to the maximum delay, until the heading is visible
- Checks only once, right after the click, that the heading is already displayed
- Always waits a fixed 2 seconds, then checks that the heading is displayed
- Clicks on the Dashboard heading to open the matching page
Show the answer
Retries up to the maximum delay, until the heading is visible
Playwright's
expectchecks retry automatically up to a maximum delay: a built-in explicit wait. There is neither an immediate check nor a fixed pause.In Selenium, an explicit wait is written with the … class: it re-evaluates a condition until it is true or the maximum delay is exceeded.
Show the answer
In Selenium, an explicit wait is written with the WebDriverWait class: it re-evaluates a condition until it is true or the maximum delay is exceeded.
WebDriverWait(driver, 10).until(...)waits at most 10 seconds and moves on as soon as the condition is met, whereas a fixed pause always waits the same time, whether the page is ready or not.Locator: what is it?
Show the answer
An expression that designates an element of the page to work with: identifier, CSS selector, role and accessible name, text.
It is the weak point of these tests: a locator that depends on the layout breaks at the slightest style change, whereas a role and a name survive.
A UI test passes on the developer's machine and fails one time in five in continuous integration. It contains a fixed pause before the check. What is the fix?
- Lengthen the pause to 10 seconds to be safe in all cases
- Replace the pause with an explicit wait for the expected element
- Automatically rerun the test until it passes once
- Disable the test in continuous integration and run it only locally
Show the answer
Replace the pause with an explicit wait for the expected element
The continuous integration server, shared and loaded, is often slower than the local machine: there the fixed pause is sometimes too short. Lengthening slows everything and eventually fails on a busy day; rerunning hides the flaw. Waiting for the element adapts to real speed.