Day 23 of 100: Promises — The Contract Behind Every await

Day 23 of 100 — 100 Days of Playwright with TypeScript Challenge. Phase: JavaScript Fundamentals. JavaScript (Days 1-33) → TypeScript (Days 34-63) → Playwright (Days 64-96) → AI Framework Capstone (Days 97-100).

🎭 Want to master this with real projects? Join the Playwright Automation Mastery course at The Testing Academy.

---

Every Playwright action returns a promise. Today: what a promise actually is.

Three States

// pending → fulfilled (with value) OR rejected (with error)

const willPass = new Promise((resolve, reject) => {
  setTimeout(() => resolve('data ready'), 100);
});

willPass
  .then(value => console.log('got: ' + value))
  .catch(err => console.log('err: ' + err.message))
  .finally(() => console.log('done either way'));

Promise Utilities for Tests

const p1 = Promise.resolve('users-seeded');
const p2 = Promise.resolve('cache-warmed');

// all — parallel setup, fails fast if any reject
Promise.all([p1, p2]).then(([a, b]) => console.log(a, b));

// allSettled — gather every outcome (cleanup steps)
Promise.allSettled([p1, Promise.reject(new Error('x'))])
  .then(results => results.forEach(r => console.log(r.status)));
// 'fulfilled', 'rejected'

// race — first to settle wins (timeout pattern)
const timeout = new Promise((_, rej) =>
  setTimeout(() => rej(new Error('timed out')), 5000));
// Promise.race([apiCall, timeout])

Why This Matters for Playwright

• page.goto(), locator.click(), expect() — all return promises
• Forgetting await = unhandled promise = flaky chaos (Day 24)
• Promise.all parallelizes independent API setup calls — big speed win

Tomorrow (Day 24): async/await — the syntax of every Playwright test.