自動待機（auto-waiting）とタイムアウト制御

Playwrightにおける「自動待機（auto-waiting）とタイムアウト制御」は、テストや自動操作を安定して実行するための重要な仕組みです。以下にその詳細を説明します。

---

1. 自動待機（Auto-Waiting）の概要

Playwrightでは、多くの操作（例：click(), fill(), type(), waitForSelector() など）が自動的に待機処理を内包しており、対象の要素が使用可能になるまで待つように設計されています。

自動待機の対象となる状態

Playwrightは以下の条件が満たされるまで、自動で待機します：

• 要素がDOM上に存在する（attached）

• 要素が表示されている（visible）

• 要素が操作可能である（enabled, stable）

例：click() の自動待機

ts
await page.click('#submit-button');

このコードは、#submit-button が表示され、クリック可能になるまで自動で待機します。

---

2. タイムアウト制御（Timeouts）

自動待機は便利ですが、永遠に待機し続けることはありません。Playwrightは各操作に**タイムアウト時間（timeout）**を設けており、それを超えるとエラーが発生します。

デフォルトのタイムアウト

• 一般的な操作：30秒（30,000ミリ秒）

• page.waitForSelector()などの明示的待機：30秒

• expect() を使ったアサーション：5秒（Playwright Test）

タイムアウトのカスタマイズ方法

個別操作に対するタイムアウト

ts
await page.click('#submit-button', { timeout: 5000 });

ページ全体のデフォルトタイムアウト設定

ts
page.setDefaultTimeout(10000); // すべての操作のデフォルトを10秒に設定

ナビゲーション専用のタイムアウト設定

ts
page.setDefaultNavigationTimeout(20000); // ページ遷移のみ20秒

---

3. 自動待機と手動待機の併用

自動待機だけでは対応できない状況では、明示的な待機（waitForSelector, waitForTimeout）を併用することで柔軟に対応できます。

ts
await page.waitForSelector('#loading-spinner', { state: 'hidden' });

このコードは、ローディングスピナーが消えるまで明示的に待機します。

---

まとめ

Playwrightの自動待機とタイムアウト制御を理解・活用することで、安定したブラウザ操作の自動化が実現できます。