HTMLのセマンティクスを意識して、壊れにくいテストコードを書こう - ICS MEDIAAIがアプリケーションコードもテストコードも書く時代、UIを操作するE2Eテストは「通るか」だけでなく、「何を操作しているかが読み取れるか」という視点も重要です。 AIが生成したUIのテストコードは一見それらしく動いても、順番や見た目のテキストに依存していて、あとから読むと意図がわからないことがあります。 // 0番目の「削除する」をクリックする await page.getByText('削除する').nth(0).click(); たとえば、上のテストコードは、nth(0)で0番目の「削除する」を順番で決め打ちしています。今は通っていても、ボタンが増えたり順番が変わったりすると意図しない要素を操作する可能性があります。 本記事では、Playwrightで要素を取得する方法（ロケーター）を、「順番」や「文字列だけ」ではなく、ユーザーが認識する役割・名前・領域に沿って指定する方法を紹介しま
