Playwrightでキャプチャを撮ったら、通常のブラウザでは出ているスクロールバーが写っておらず、見た目が実機と違う状態になっていました。原因はheadless起動時にPlaywrightが付けるChromiumの--hide-scrollbars引数で、ignoreDefaultArgsで外すと表示されるようになったので、設定方法と注意点をまとめます。

Playwrightで`page.context().pages()`から開いている全タブを取得し、URLまたはtitleに特定文字列を含む画面が存在するかをbooleanで返すヘルパー関数の実装方法を解説します。BrowserContextの基本とfor...ofで逐次awaitする理由も合わせて紹介します。

Playwrightで`page.locator('input[name="status"]')`のように一度取得した複数要素のLocatorから、特定のvalueを持つ1要素だけを絞り込む方法を解説します。`.filter({ has: ... })`が動かない理由と、`.and()`を使った正しい絞り込みパターンを最小コードで紹介します。

Playwrightで複数ビューポート（PC/タブレット/スマホ）を一括E2Eテストする方法を解説します。projects設定で3画面サイズを直列実行し、各操作のスクリーンショットを連番で自動収集する構成、カスタムフィクスチャによる命名規則、globalTeardownでの横並びレスポンシブ比較HTML生成まで実装例付きで紹介します。