TargetQA
TypeScript
Lesson 4 of 4 · 6 min

2.1 Web-First Assertions: toBeVisible & toHaveText

AI

Lesson Audio Narration

### What are Web-First Assertions? Web-first assertions continuously poll the element until the expected state is reached: ```typescript // ✅ Web-first assertion (waits up to 5s for the banner to appear) await expect(page.getByText('Login successful')).toBeVisible(); // Checks exact or regex text content await expect(page.locator('.welcome-msg')).toHaveText(/Welcome, Alex/); // Asserts input field value await expect(page.getByLabel('Username')).toHaveValue('alex99'); ``` ### Common Assertions Cheatsheet: - `expect(locator).toBeVisible()` - `expect(locator).toBeHidden()` - `expect(locator).toBeEnabled()` - `expect(locator).toBeChecked()` - `expect(locator).toHaveCount(expectedCount)`
Your Task

Assert that the alert banner located by `.success-banner` is visible and has text `'Profile updated successfully'`.

Common doubts
Did you find this lesson helpful?
solution.ts
Loading code editor…
Execution Console

Click "Run Code" to test your implementation.