PlaywrightでHTML要素を取得する

はじめに

Playwrightを使用する中で、画面上のテキストボックス・ラジオボタン・チェックボックスなど操作対象の要素を特定する必要があります。
今回はHTML要素を特定し、取得する方法を記載します。

開発環境

言語：C#
IDE：Visual Studio2022

Locatorを使用して要素を取得する

CSSやXPathを指定して要素を特定する場合に使用します。

idで要素を特定する

HTML要素に指定されているid属性を使用して要素を特定します。
idはページ内で一意となるため信頼性が高い特定方法となります。

ILocator textElement = page.Locator("#textbox");

classで要素を特定する

class属性を使用して要素を特定する方法となります。
※同じクラス名を持つ要素が複数存在する場合があります。

ILocator textElement = page.Locator(".text-control");

複数要素が見つかった場合

class属性を使用して要素を特定する場合、同じクラス名を持つ要素が
複数見つかる可能性があります。
その場合には、FirstやNthを使い特定の要素を取得する事が可能です。

//最初に見つけた要素を指定する
ILocator textElement = page.Locator(".text-control").First;

//n番目の要素を指定する
ILocator textElement = page.Locator(".text-control").Nth(n);

さいごに

他にも役割を指定した要素へのアクセス、テキストから要素を検索する方法などもあります。
要素を取得した後の操作方法なども、今後記事にしていきたいと思います。