> Какой опыт работы с асинхронностью и TypeScript в Playwright? (TypeScript)

Короткий ответ

В Playwright асинхронность реализована через async/await и Promise API. TypeScript добавляет строгую типизацию, что критично для работы с локаторами, ожиданиями и Page Object Model. Основные паттерны: параллельный запуск тестов через browser contexts, ожидание состояний элементов с auto-waiting, обработка race conditions через Promise.all. TypeScript позволяет типизировать fixtures, custom commands и моки API, снижая количество runtime-ошибок.

Подробное объяснение

Playwright построен на асинхронной модели Node.js. Каждое взаимодействие с браузером - асинхронная операция: открытие страницы, клик, ввод текста, проверка состояния. Playwright автоматически ожидает стабильности элементов (auto-waiting), но для сложных сценариев требуется явное управление асинхронностью.

TypeScript в Playwright используется для:

• типизации локаторов (Locator, Page, BrowserContext)
• описания контрактов Page Object классов
• типизации fixtures в Playwright Test
• строгой типизации моков и интерсепторов запросов

Ключевые асинхронные паттерны:

• последовательное выполнение через await
• параллельное выполнение через Promise.all для независимых действий
• обработка таймаутов и retry-логика
• управление browser contexts для изоляции тестов

На практике

В реальных проектах асинхронность проявляется в:

• ожидании загрузки страницы после навигации
• последовательном заполнении форм с проверками
• параллельной работе с несколькими вкладками или окнами
• обработке сетевых запросов через page.waitForResponse
• использовании page.waitForFunction для кастомных условий

TypeScript помогает избежать ошибок типов при передаче локаторов между методами, при работе с complex selectors и при создании общих утилит для тестов.

Пример кода

TYPESCRIPT
import { test, expect, Page } from '@playwright/test';

// Типизированный Page Object
class LoginPage {
  constructor(private page: Page) {}

  async login(username: string, password: string): Promise<void> {
    await this.page.fill('[data-test="username"]', username);
    await this.page.fill('[data-test="password"]', password);
    await this.page.click('[data-test="login-button"]');
  }
}

// Асинхронный тест с параллельным выполнением
test('user can login and see dashboard', async ({ page }) => {
  const loginPage = new LoginPage(page);
  
  // Параллельная загрузка данных
  const [response] = await Promise.all([
    page.waitForResponse('**/api/user/profile'),
    loginPage.login('user', 'pass')
  ]);

  const profile = await response.json();
  expect(profile.name).toBe('John');
  await expect(page.locator('.dashboard')).toBeVisible();
});

// Обработка race condition
test('handle concurrent requests', async ({ page }) => {
  await page.goto('/search');
  
  const searchResults = page.locator('.result');
  const searchInput = page.locator('#search');
  
  // Быстрый ввод с ожиданием стабильности
  await searchInput.fill('playwright');
  await page.waitForTimeout(300); // debounce
  
  // Асинхронная проверка количества результатов
  await expect(searchResults).toHaveCount(10);
});

Как отвечать на собеседовании

Начни с конкретных примеров из опыта: как ты использовал async/await для управления последовательностью тестов, как типизировал Page Object классы. Упомяни работу с browser contexts для параллельных тестов и обработку race conditions через Promise.all. Покажи понимание trade-off между auto-waiting и явными ожиданиями. Если спрашивают про сложные кейсы - расскажи про типизацию fixtures и кастомных matchers.

Что проверяет интервьюер

• Понимание event loop и асинхронной модели Node.js
• Умение проектировать типизированные Page Object с TypeScript
• Знание паттернов параллельного выполнения тестов
• Опыт обработки таймаутов и нестабильных селекторов
• Способность типизировать моки и интерсепторы запросов

Типичные ошибки

• Использование await внутри циклов без необходимости (замедляет тесты)
• Игнорирование типов для локаторов (any вместо Locator)
• Отсутствие обработки rejected promises в параллельных операциях
• Смешивание синхронного и асинхронного кода в Page Object методах
• Неправильная типизация callback-функций в waitForFunction