Locator

ロケーターはPlaywrightの自動待機と再試行の中心的な機能です。簡単に言えば、ロケーターはページ上の要素をいつでも見つける方法を表します。ロケーターはpage.locator()メソッドで作成できます。

ロケーターの詳細.

メソッド

all

追加: v1.29

locator.all

ロケーターが要素のリストを指している場合、これはそれぞれの要素を指すロケーターの配列を返します。

注

locator.all()はロケーターに一致する要素を待たずに、ページ内に存在するものを即座に返します。

要素のリストが動的に変化する場合、locator.all()は予測不能で不安定な結果を生成します。

要素のリストが安定しているが動的にロードされる場合、locator.all()を呼び出す前に完全なリストのロードが完了するのを待ちます。

使用法

for (const li of await page.getByRole('listitem').all())
  await li.click();

戻り値

Promise<Array<Locator>>#

allInnerTexts

追加されたバージョン: v1.14

locator.allInnerTexts

すべての一致するノードの node.innerText 値の配列を返します。

テキストのアサート

ページ上のテキストをアサートする必要がある場合は、不安定さを避けるためにexpect(locator).toHaveText()とuseInnerTextオプションを使用することをお勧めします。詳細については、アサーションガイドを参照してください。

使用法

const texts = await page.getByRole('link').allInnerTexts();

戻り値

Promise<Array<string>>#

allTextContents

追加されたバージョン: v1.14

locator.allTextContents

すべての一致するノードの node.textContent 値の配列を返します。

テキストのアサート

ページ上のテキストをアサートする必要がある場合は、不安定さを避けるためにexpect(locator).toHaveText()を使用することをお勧めします。詳細については、アサーションガイドを参照してください。

使用法

const texts = await page.getByRole('link').allTextContents();

戻り値

Promise<Array<string>>#

and

追加バージョン: v1.34

locator.and

このロケーターと引数ロケーターの両方に一致するロケーターを作成します。

使用法

次の例は、特定のタイトルを持つボタンを検索します。

const button = page.getByRole('button').and(page.getByTitle('Subscribe'));

引数

locator Locator #

一致する追加のロケーター。

戻り値

Locator #

ariaSnapshot

追加バージョン: v1.49

locator.ariaSnapshot

指定された要素のARIAスナップショットをキャプチャします。ARIAスナップショットと対応するアサーションexpect(locator).toMatchAriaSnapshot()について詳しく読んでください。

使用法

await page.getByRole('link').ariaSnapshot();

引数

options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<string>#

詳細

このメソッドは、指定された要素の aria スナップショットをキャプチャします。スナップショットは、要素とその子孫の状態を表す文字列です。スナップショットは、テストで要素の状態をアサートしたり、将来の状態と比較したりするために使用できます。

ARIA スナップショットは、YAML マークアップ言語を使用して表現されます。

オブジェクトのキーは、要素の役割とオプションのアクセシブル名です。
値は、テキストコンテンツまたは子要素の配列です。
汎用的な静的テキストは、text キーで表現できます。

以下は HTML マークアップとそれぞれの ARIA スナップショットです。

<ul aria-label="Links">
  <li><a href="/">Home</a></li>
  <li><a href="/about">About</a></li>
<ul>

- list "Links":
  - listitem:
    - link "Home"
  - listitem:
    - link "About"

blur

追加バージョン: v1.28

locator.blur

要素上で blur を呼び出します。

使用法

await locator.blur();
await locator.blur(options);

引数

options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<void>#

boundingBox

追加されたバージョン: v1.14

locator.boundingBox

このメソッドは、ロケーターに一致する要素の境界ボックスを返します。要素が可視でない場合は null を返します。境界ボックスは、メインフレームのビューポート (通常はブラウザーウィンドウと同じ) を基準に計算されます。

使用法

const box = await page.getByRole('button').boundingBox();
await page.mouse.click(box.x + box.width / 2, box.y + box.height / 2);

引数

options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<null | Object>#
- x number
  
  要素の x 座標 (ピクセル単位)。
- y number
  
  要素の y 座標 (ピクセル単位)。
- width number
  
  要素の幅 (ピクセル単位)。
- height number
  
  要素の高さ (ピクセル単位)。

詳細

スクロールは、Element.getBoundingClientRect と同様に、返される境界ボックスに影響を与えます。つまり、x および/または y が負になる可能性があります。

子フレームの要素は、Element.getBoundingClientRect とは異なり、メインフレームを基準とした境界ボックスを返します。

ページが静的であると仮定すると、境界ボックスの座標を使用して入力を実行するのは安全です。たとえば、次のスニペットは要素の中心をクリックするはずです。

check

追加されたバージョン: v1.14

locator.check

チェックボックスまたはラジオ要素がチェックされていることを確認します。

使用法

await page.getByRole('checkbox').check();

引数

options Object (optional)
- force boolean (optional)#
  
  アクション可能性チェックをバイパスするかどうか。デフォルトはfalseです。
- noWaitAfter boolean (optional)#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- position Object (optional)#
  - x number
  - y number
  要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
- trial boolean (optional)#
  
  設定すると、このメソッドはアクション可能性チェックのみを実行し、アクションはスキップします。デフォルトはfalseです。アクションを実行せずに要素がアクションの準備が整うまで待機するのに役立ちます。

戻り値

Promise<void>#

詳細

次のステップを実行します。

要素がチェックボックスまたはラジオ入力であることを確認します。そうでない場合、このメソッドはスローします。要素がすでにチェックされている場合、このメソッドはすぐに返します。
forceオプションが設定されていない限り、要素のアクション可能性チェックを待ちます。
必要に応じて要素を表示するためにスクロールします。
page.mouseを使用して要素の中央をクリックします。
要素が現在チェックされていることを確認します。そうでない場合、このメソッドはスローします。

アクション中に要素が DOM から分離された場合、このメソッドはスローします。

指定されたtimeout内にすべてのステップが完了しなかった場合、このメソッドはTimeoutErrorをスローします。タイムアウトをゼロにすると、これは無効になります。

clear

追加バージョン: v1.28

locator.clear

入力フィールドをクリアします。

使用法

await page.getByRole('textbox').clear();

引数

options Object (optional)
- force boolean (optional)#
  
  アクション可能性チェックをバイパスするかどうか。デフォルトはfalseです。
- noWaitAfter boolean (optional)#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<void>#

詳細

このメソッドはアクション可能性チェックを待ち、要素にフォーカスし、クリアし、クリア後にinputイベントをトリガーします。

ターゲット要素が <input>、<textarea>、または [contenteditable] 要素でない場合、このメソッドはエラーをスローします。ただし、要素が関連付けられたコントロールを持つ <label> 要素内にある場合、代わりにコントロールがクリアされます。

click

追加されたバージョン: v1.14

locator.click

要素をクリックします。

使用法

ボタンをクリックする

await page.getByRole('button').click();

キャンバスの特定の位置で Shift キーを押しながら右クリックする

await page.locator('canvas').click({
  button: 'right',
  modifiers: ['Shift'],
  position: { x: 23, y: 32 },
});

引数

options Object (optional)
- button "left" | "right" | "middle" (optional)#
  
  デフォルトは left です。
- clickCount number (optional)#
  
  デフォルトは 1 です。UIEvent.detail を参照してください。
- delay number (optional)#
  
  mousedown と mouseup の間の待機時間 (ミリ秒単位)。デフォルトは 0 です。
- force boolean (optional)#
  
  アクション可能性チェックをバイパスするかどうか。デフォルトはfalseです。
- modifiers Array<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (optional)#
  
  押す修飾キー。操作中にこれらの修飾キーのみが押されていることを保証し、現在の修飾キーを元に戻します。指定しない場合、現在押されている修飾キーが使用されます。"ControlOrMeta" は、Windows と Linux では "Control" に、macOS では "Meta" に解決されます。
- noWaitAfter boolean (optional)#
  
  非推奨
  このオプションは将来 true になります。
  
  ナビゲーションを開始するアクションは、これらのナビゲーションが発生し、ページがロードを開始するのを待機します。このフラグを設定することで、待機をオプトアウトできます。これは、アクセスできないページにナビゲートするなどの例外的な場合にのみ必要です。デフォルトは false です。
- position Object (optional)#
  - x number
  - y number
  要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
- trial boolean (optional)#
  
  設定すると、このメソッドはアクション可能性チェックのみを実行し、アクションはスキップします。デフォルトはfalseです。アクションを実行せずに要素がアクションの準備が整うまで待機するのに役立ちます。キーボードのmodifiersは、それらのキーが押されたときにのみ表示される要素をテストできるように、trialに関係なく押されます。

戻り値

Promise<void>#

詳細

このメソッドは、次の手順を実行して要素をクリックします。

forceオプションが設定されていない限り、要素のアクション可能性チェックを待ちます。
必要に応じて要素を表示するためにスクロールします。
page.mouseを使用して要素の中央、または指定されたpositionをクリックします。
noWaitAfterオプションが設定されていない限り、開始されたナビゲーションが成功または失敗するのを待ちます。

アクション中に要素が DOM から分離された場合、このメソッドはスローします。

contentFrame

追加バージョン: v1.43

locator.contentFrame

このロケーターと同じiframeを指すFrameLocatorオブジェクトを返します。

Locatorオブジェクトをどこかで取得し、後でフレーム内のコンテンツと対話したい場合に便利です。

逆操作には、frameLocator.owner()を使用します。

使用法

const locator = page.locator('iframe[name="embedded"]');
// ...
const frameLocator = locator.contentFrame();
await frameLocator.getByRole('button').click();

戻り値

FrameLocator #

count

追加されたバージョン: v1.14

locator.count

ロケーターに一致する要素の数を返します。

カウントのアサート

ページ上の要素の数をアサートする必要がある場合は、不安定さを避けるためにexpect(locator).toHaveCount()を使用することをお勧めします。詳細については、アサーションガイドを参照してください。

使用法

const count = await page.getByRole('listitem').count();

戻り値

Promise<number>#

dblclick

追加されたバージョン: v1.14

locator.dblclick

要素をダブルクリックします。

使用法

await locator.dblclick();
await locator.dblclick(options);

引数

options Object (optional)
- button "left" | "right" | "middle" (optional)#
  
  デフォルトは left です。
- delay number (optional)#
  
  mousedown と mouseup の間の待機時間 (ミリ秒単位)。デフォルトは 0 です。
- force boolean (optional)#
  
  アクション可能性チェックをバイパスするかどうか。デフォルトはfalseです。
- modifiers Array<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (optional)#
  
  押す修飾キー。操作中にこれらの修飾キーのみが押されていることを保証し、現在の修飾キーを元に戻します。指定しない場合、現在押されている修飾キーが使用されます。"ControlOrMeta" は、Windows と Linux では "Control" に、macOS では "Meta" に解決されます。
- noWaitAfter boolean (optional)#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- position Object (optional)#
  - x number
  - y number
  要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
- trial boolean (optional)#
  
  設定すると、このメソッドはアクション可能性チェックのみを実行し、アクションはスキップします。デフォルトはfalseです。アクションを実行せずに要素がアクションの準備が整うまで待機するのに役立ちます。キーボードのmodifiersは、それらのキーが押されたときにのみ表示される要素をテストできるように、trialに関係なく押されます。

戻り値

Promise<void>#

詳細

このメソッドは、次の手順を実行して要素をダブルクリックします。

forceオプションが設定されていない限り、要素のアクション可能性チェックを待ちます。
必要に応じて要素を表示するためにスクロールします。
page.mouseを使用して要素の中央、または指定されたpositionをダブルクリックします。

アクション中に要素が DOM から分離された場合、このメソッドはスローします。

注

element.dblclick() は、2 つの click イベントと 1 つの dblclick イベントをディスパッチします。

describe

追加: v1.53

locator.describe

ロケーターを記述します。記述はトレースビューアーとレポートで使用されます。同じ要素を指すロケーターを返します。

使用法

const button = page.getByTestId('btn-sub').describe('Subscribe button');
await button.click();

引数

description string #

ロケーターの説明。

戻り値

Locator #

dispatchEvent

追加されたバージョン: v1.14

locator.dispatchEvent

一致する要素に対してイベントをプログラム的にディスパッチします。

使用法

await locator.dispatchEvent('click');

引数

type string #

DOM イベントタイプ: "click"、"dragstart" など。
eventInit EvaluationArgument (optional)#

オプションのイベント固有の初期化プロパティ。
options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<void>#

詳細

上記のスニペットは、要素に対して click イベントをディスパッチします。要素の可視状態に関係なく、click がディスパッチされます。これは element.click() を呼び出すのと同等です。

内部的には、指定されたtypeに基づいてイベントのインスタンスを作成し、eventInitプロパティで初期化し、要素にディスパッチします。イベントはデフォルトでcomposed、cancelable、バブルします。

eventInitはイベント固有であるため、初期プロパティのリストについてはイベントのドキュメントを参照してください

ライブオブジェクトをイベントに渡したい場合は、JSHandleをプロパティ値として指定することもできます

const dataTransfer = await page.evaluateHandle(() => new DataTransfer());
await locator.dispatchEvent('dragstart', { dataTransfer });

dragTo

追加: v1.18

locator.dragTo

ソース要素をターゲット要素にドラッグしてドロップします。

使用法

const source = page.locator('#source');
const target = page.locator('#target');

await source.dragTo(target);
// or specify exact positions relative to the top-left corners of the elements:
await source.dragTo(target, {
  sourcePosition: { x: 34, y: 7 },
  targetPosition: { x: 10, y: 20 },
});

引数

target Locator #

ドラッグ先の要素のロケーター。
options Object (optional)
- force boolean (optional)#
  
  アクション可能性チェックをバイパスするかどうか。デフォルトはfalseです。
- noWaitAfter boolean (optional)#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- sourcePosition Object (optional)#
  - x number
  - y number
  要素のパディングボックスの左上隅を基準としたこの点でソース要素をクリックします。指定しない場合、要素のいくつかの可視点が使用されます。
- targetPosition Object (optional)#
  - x number
  - y number
  要素のパディングボックスの左上隅を基準としたこの点でターゲット要素にドロップします。指定しない場合、要素のいくつかの可視点が使用されます。
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
- trial boolean (optional)#
  
  設定すると、このメソッドはアクション可能性チェックのみを実行し、アクションはスキップします。デフォルトはfalseです。アクションを実行せずに要素がアクションの準備が整うまで待機するのに役立ちます。

戻り値

Promise<void>#

詳細

このメソッドは、ロケーターを別のターゲットロケーターまたはターゲット位置にドラッグします。まずソース要素に移動し、mousedown を実行し、次にターゲット要素または位置に移動し、mouseup を実行します。

evaluate

追加されたバージョン: v1.14

locator.evaluate

一致する要素を引数として、ページ内で JavaScript コードを実行します。

使用法

pageFunctionへの引数渡し

const result = await page.getByTestId('myId').evaluate((element, [x, y]) => {
  return element.textContent + ' ' + x * y;
}, [7, 8]);
console.log(result); // prints "myId text 56"

引数

pageFunction function | string #

ページコンテキストで評価される関数。
arg EvaluationArgument (optional)#

pageFunctionに渡すオプション引数。
options Object (optional)
- timeout number (optional)#
  
  評価する前にロケーターを待つ最大ミリ秒数。ロケーターが解決された後、評価自体はタイムアウトによって制限されないことに注意してください。デフォルトは0で、タイムアウトなしです。

戻り値

Promise<Serializable>#

詳細

pageFunctionの戻り値を返します。これは、一致する要素を最初の引数として、argを2番目の引数として呼び出されます。

pageFunctionがPromiseを返す場合、このメソッドはPromiseが解決されるのを待ち、その値を返します。

pageFunctionがスローまたは拒否した場合、このメソッドはスローします。

evaluateAll

追加されたバージョン: v1.14

locator.evaluateAll

すべての一致する要素を引数として、ページ内で JavaScript コードを実行します。

使用法

const locator = page.locator('div');
const moreThanTen = await locator.evaluateAll((divs, min) => divs.length > min, 10);

引数

pageFunction function | string #

ページコンテキストで評価される関数。
arg EvaluationArgument (optional)#

pageFunctionに渡すオプション引数。

戻り値

Promise<Serializable>#

詳細

pageFunctionの戻り値を返します。これは、すべての一致する要素の配列を最初の引数として、argを2番目の引数として呼び出されます。

pageFunctionがPromiseを返す場合、このメソッドはPromiseが解決されるのを待ち、その値を返します。

pageFunctionがスローまたは拒否した場合、このメソッドはスローします。

evaluateHandle

追加されたバージョン: v1.14

locator.evaluateHandle

一致する要素を引数として受け取り、結果をJSHandleで返すJavaScriptコードをページ内で実行します。

使用法

await locator.evaluateHandle(pageFunction);
await locator.evaluateHandle(pageFunction, arg, options);

引数

pageFunction function | string #

ページコンテキストで評価される関数。
arg EvaluationArgument (optional)#

pageFunctionに渡すオプション引数。
options Object (optional)
- timeout number (optional)#
  
  評価する前にロケーターを待つ最大ミリ秒数。ロケーターが解決された後、評価自体はタイムアウトによって制限されないことに注意してください。デフォルトは0で、タイムアウトなしです。

戻り値

Promise<JSHandle>#

詳細

pageFunctionの戻り値をJSHandleとして返します。これは、一致する要素を最初の引数として、argを2番目の引数として呼び出されます。

locator.evaluate()とlocator.evaluateHandle()の唯一の違いは、locator.evaluateHandle()がJSHandleを返すことです。

pageFunctionがPromiseを返す場合、このメソッドはPromiseが解決されるのを待ち、その値を返します。

pageFunctionがスローまたは拒否した場合、このメソッドはスローします。

詳細については、page.evaluateHandle()を参照してください。

fill

追加されたバージョン: v1.14

locator.fill

入力フィールドに値を設定します。

使用法

await page.getByRole('textbox').fill('example value');

引数

value string #

<input>、<textarea>、または [contenteditable] 要素に設定する値。
options Object (optional)
- force boolean (optional)#
  
  アクション可能性チェックをバイパスするかどうか。デフォルトはfalseです。
- noWaitAfter boolean (optional)#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<void>#

詳細

このメソッドはアクション可能性チェックを待ち、要素にフォーカスし、入力し、入力後にinputイベントをトリガーします。入力フィールドをクリアするために空の文字列を渡すことができることに注意してください。

ターゲット要素が <input>、<textarea>、または [contenteditable] 要素でない場合、このメソッドはエラーをスローします。ただし、要素が関連付けられたコントロールを持つ <label> 要素内にある場合、代わりにコントロールが入力されます。

きめ細かなキーボードイベントを送信するには、locator.pressSequentially()を使用します。

filter

追加: v1.22

locator.filter

このメソッドは、オプションに応じて既存のロケーターを絞り込みます (例: テキストでフィルタリングします)。複数回フィルタリングするために連結できます。

使用法

const rowLocator = page.locator('tr');
// ...
await rowLocator
    .filter({ hasText: 'text in column 1' })
    .filter({ has: page.getByRole('button', { name: 'column 2 button' }) })
    .screenshot();

引数

options Object (optional)
- has Locator (optional)#
  
  この相対ロケーターに一致する要素を含む結果にメソッドの結果を絞り込みます。例えば、text=Playwrightを持つarticleは<article><div>Playwright</div></article>に一致します。
  
  内部ロケーターは**外部ロケーターに対して相対的**でなければならず、ドキュメントルートではなく外部ロケーターの一致からクエリが開始されます。例えば、<article><content><div>Playwright</div></content></article>でdivを持つcontentを見つけることができます。しかし、article divを持つcontentを探すと、内部ロケーターは相対的でなければならず、contentの外部の要素を使用すべきではないため、失敗します。
  
  外部ロケーターと内部ロケーターは同じフレームに属している必要があります。内部ロケーターにはFrameLocatorを含めることはできません。
- hasNot Locator (オプション)追加バージョン: v1.33#
  
  内部ロケーターに一致する要素を含まない要素に一致します。内部ロケーターは外部ロケーターに対してクエリされます。例えば、divを持たないarticleは<article><span>Playwright</span></article>に一致します。
  
  外部ロケーターと内部ロケーターは同じフレームに属している必要があります。内部ロケーターにはFrameLocatorを含めることはできません。
- hasNotText string | RegExp (オプション)追加バージョン: v1.33#
  
  指定されたテキストを内部のどこか（子または子孫要素内も含む）に含まない要素に一致します。stringが渡された場合、大文字小文字を区別せず、部分文字列を検索します。
- hasText string | RegExp (optional)#
  
  指定されたテキストを内部のどこか（子または子孫要素内も含む）に含む要素に一致します。stringが渡された場合、大文字小文字を区別せず、部分文字列を検索します。例えば、"Playwright"は<article><div>Playwright</div></article>に一致します。
- visible boolean (optional)追加バージョン: v1.51#
  
  可視または不可視の要素のみと一致します。

戻り値

Locator #

first

追加されたバージョン: v1.14

locator.first

最初の一致要素のロケーターを返します。

使用法

locator.first();

戻り値

Locator #

focus

追加されたバージョン: v1.14

locator.focus

一致する要素で focus を呼び出します。

使用法

await locator.focus();
await locator.focus(options);

引数

options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<void>#

frameLocator

追加バージョン: v1.17

locator.frameLocator

iframe を操作する場合、iframe に入り、その iframe 内の要素を特定できるフレームロケーターを作成できます。

使用法

const locator = page.frameLocator('iframe').getByText('Submit');
await locator.click();

引数

selector string #

DOM要素を解決するときに使用するセレクター。

戻り値

FrameLocator #

getAttribute

追加されたバージョン: v1.14

locator.getAttribute

一致する要素の属性値を返します。

属性のアサート

要素の属性をアサートする必要がある場合は、不安定さを避けるためにexpect(locator).toHaveAttribute()を使用することをお勧めします。詳細については、アサーションガイドを参照してください。

使用法

await locator.getAttribute(name);
await locator.getAttribute(name, options);

引数

name string #

値を取得する属性名。
options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<null | string>#

getByAltText

追加バージョン: v1.27

locator.getByAltText

要素をそのaltテキストで特定できます。

使用法

例えば、このメソッドはaltテキスト「Playwright logo」で画像を見つけます。

<img alt='Playwright logo'>

await page.getByAltText('Playwright logo').click();

引数

text string | RegExp #

要素を特定するためのテキスト。
options Object (optional)
- exact boolean (optional)#
  
  完全一致（大文字小文字を区別し、文字列全体）を見つけるかどうか。デフォルトはfalse。正規表現で特定する場合は無視されます。正確な一致でも空白はトリムされることに注意してください。

戻り値

Locator #

getByLabel

追加バージョン: v1.27

locator.getByLabel

関連する<label>またはaria-labelledby要素のテキスト、またはaria-label属性によって入力要素を特定できます。

使用法

例えば、このメソッドは以下のDOMでラベル「Username」と「Password」を持つ入力を見つけます。

<input aria-label="Username">
<label for="password-input">Password:</label>
<input id="password-input">

await page.getByLabel('Username').fill('john');
await page.getByLabel('Password').fill('secret');

引数

text string | RegExp #

要素を特定するためのテキスト。
options Object (optional)
- exact boolean (optional)#
  
  完全一致（大文字小文字を区別し、文字列全体）を見つけるかどうか。デフォルトはfalse。正規表現で特定する場合は無視されます。正確な一致でも空白はトリムされることに注意してください。

戻り値

Locator #

getByPlaceholder

追加バージョン: v1.27

locator.getByPlaceholder

プレースホルダーテキストによって入力要素を特定できます。

使用法

例えば、以下のDOM構造を考えてみましょう。

<input type="email" placeholder="name@example.com" />

プレースホルダーテキストで入力を見つけてから、入力できます。

await page
    .getByPlaceholder('name@example.com')
    .fill('playwright@microsoft.com');

引数

text string | RegExp #

要素を特定するためのテキスト。
options Object (optional)
- exact boolean (optional)#
  
  完全一致（大文字小文字を区別し、文字列全体）を見つけるかどうか。デフォルトはfalse。正規表現で特定する場合は無視されます。正確な一致でも空白はトリムされることに注意してください。

戻り値

Locator #

getByRole

追加バージョン: v1.27

locator.getByRole

要素をそのARIAロール、ARIA属性、およびアクセシブルネームで特定できます。

使用法

以下のDOM構造を考えてみましょう。

<h3>Sign up</h3>
<label>
  <input type="checkbox" /> Subscribe
</label>
<br/>
<button>Submit</button>

各要素をその暗黙的なロールで特定できます。

await expect(page.getByRole('heading', { name: 'Sign up' })).toBeVisible();

await page.getByRole('checkbox', { name: 'Subscribe' }).check();

await page.getByRole('button', { name: /submit/i }).click();

引数

role "alert" | "alertdialog" | "application" | "article" | "banner" | "blockquote" | "button" | "caption" | "cell" | "checkbox" | "code" | "columnheader" | "combobox" | "complementary" | "contentinfo" | "definition" | "deletion" | "dialog" | "directory" | "document" | "emphasis" | "feed" | "figure" | "form" | "generic" | "grid" | "gridcell" | "group" | "heading" | "img" | "insertion" | "link" | "list" | "listbox" | "listitem" | "log" | "main" | "marquee" | "math" | "meter" | "menu" | "menubar" | "menuitem" | "menuitemcheckbox" | "menuitemradio" | "navigation" | "none" | "note" | "option" | "paragraph" | "presentation" | "progressbar" | "radio" | "radiogroup" | "region" | "row" | "rowgroup" | "rowheader" | "scrollbar" | "search" | "searchbox" | "separator" | "slider" | "spinbutton" | "status" | "strong" | "subscript" | "superscript" | "switch" | "tab" | "table" | "tablist" | "tabpanel" | "term" | "textbox" | "time" | "timer" | "toolbar" | "tooltip" | "tree" | "treegrid" | "treeitem"#

必須のariaロール。
options Object (optional)
- checked boolean (optional)#
  
  通常、aria-checkedまたはネイティブの<input type=checkbox>コントロールによって設定される属性。
  
  aria-checkedの詳細。
- disabled boolean (optional)#
  
  通常、aria-disabledまたはdisabledによって設定される属性。
  
  注
  他のほとんどの属性とは異なり、disabledはDOM階層を介して継承されます。aria-disabledの詳細。
- exact boolean (オプション)追加バージョン: v1.28#
  
  nameが完全に一致するかどうか: 大文字小文字を区別し、文字列全体が一致します。デフォルトはfalseです。nameが正規表現の場合は無視されます。完全一致でも空白はトリミングされることに注意してください。
- expanded boolean (optional)#
  
  通常、aria-expandedによって設定される属性。
  
  aria-expandedの詳細。
- includeHidden boolean (optional)#
  
  非表示要素が一致するかどうかを制御するオプション。デフォルトでは、ARIAで定義されているように、非表示でない要素のみがロールセレクターによって一致します。
  
  aria-hiddenの詳細。
- level number (optional)#
  
  通常、heading、listitem、row、treeitemのロールに存在する数値属性で、<h1>-<h6>要素のデフォルト値があります。
  
  aria-levelの詳細。
- name string | RegExp (optional)#
  
  アクセシブル名を照合するオプション。デフォルトでは、大文字小文字を区別せず部分文字列を検索します。exactを使用してこの動作を制御します。
  
  アクセシブルネームの詳細。
- pressed boolean (optional)#
  
  通常、aria-pressedによって設定される属性。
  
  aria-pressedの詳細。
- selected boolean (optional)#
  
  通常、aria-selectedによって設定される属性。
  
  aria-selectedの詳細。

戻り値

Locator #

詳細

ロールセレクターは、アクセシビリティ監査や適合性テストを**置き換えるものではなく**、ARIAガイドラインに関する早期のフィードバックを提供します。

多くのHTML要素には、ロールセレクターによって認識される暗黙的に定義されたロールがあります。サポートされているすべてのロールはこちらで確認できます。ARIAガイドラインは、roleおよび/またはaria-*属性をデフォルト値に設定して暗黙的なロールと属性を重複させることを**推奨しません**。

getByTestId

追加バージョン: v1.27

locator.getByTestId

テストIDによって要素を特定します。

使用法

以下のDOM構造を考えてみましょう。

<button data-testid="directions">Itinéraire</button>

テストIDによって要素を特定できます。

await page.getByTestId('directions').click();

引数

testId string | RegExp #

要素を特定するID。

戻り値

Locator #

詳細

デフォルトでは、data-testid属性がテストIDとして使用されます。必要に応じて、selectors.setTestIdAttribute()を使用して別のテストID属性を設定できます。

// Set custom test id attribute from @playwright/test config:
import { defineConfig } from '@playwright/test';

export default defineConfig({
  use: {
    testIdAttribute: 'data-pw'
  },
});

getByText

追加バージョン: v1.27

locator.getByText

指定されたテキストを含む要素を特定できます。

アクセシブルロールなどの他の基準で一致させ、その後テキストコンテンツでフィルターできるlocator.filter()も参照してください。

使用法

以下のDOM構造を考えてみましょう。

<div>Hello <span>world</span></div>
<div>Hello</div>

テキストの部分文字列、完全な文字列、または正規表現で特定できます。

// Matches <span>
page.getByText('world');

// Matches first <div>
page.getByText('Hello world');

// Matches second <div>
page.getByText('Hello', { exact: true });

// Matches both <div>s
page.getByText(/Hello/);

// Matches second <div>
page.getByText(/^hello$/i);

引数

text string | RegExp #

要素を特定するためのテキスト。
options Object (optional)
- exact boolean (optional)#
  
  完全一致（大文字小文字を区別し、文字列全体）を見つけるかどうか。デフォルトはfalse。正規表現で特定する場合は無視されます。正確な一致でも空白はトリムされることに注意してください。

戻り値

Locator #

詳細

テキストによる一致は、厳密な一致であっても常に空白を正規化します。例えば、複数のスペースを1つにまとめ、改行をスペースに変換し、先頭と末尾の空白を無視します。

buttonおよびsubmit型の入力要素は、テキストコンテンツの代わりにそのvalueによって一致します。例えば、テキスト"Log in"で特定すると、<input type=button value="Log in">が一致します。

getByTitle

追加バージョン: v1.27

locator.getByTitle

要素をそのタイトル属性で特定できます。

使用法

以下のDOM構造を考えてみましょう。

<span title='Issues count'>25 issues</span>

タイトルテキストで問題数を特定した後、確認できます。

await expect(page.getByTitle('Issues count')).toHaveText('25 issues');

引数

text string | RegExp #

要素を特定するためのテキスト。
options Object (optional)
- exact boolean (optional)#
  
  完全一致（大文字小文字を区別し、文字列全体）を見つけるかどうか。デフォルトはfalse。正規表現で特定する場合は無視されます。正確な一致でも空白はトリムされることに注意してください。

戻り値

Locator #

highlight

追加バージョン: v1.20

locator.highlight

画面上の対応する要素を強調表示します。デバッグに便利ですが、locator.highlight()を使用するコードはコミットしないでください。

使用法

await locator.highlight();

戻り値

Promise<void>#

hover

追加されたバージョン: v1.14

locator.hover

一致する要素にホバーします。

使用法

await page.getByRole('link').hover();

引数

options Object (optional)
- force boolean (optional)#
  
  アクション可能性チェックをバイパスするかどうか。デフォルトはfalseです。
- modifiers Array<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (optional)#
  
  押す修飾キー。操作中にこれらの修飾キーのみが押されていることを保証し、現在の修飾キーを元に戻します。指定しない場合、現在押されている修飾キーが使用されます。"ControlOrMeta" は、Windows と Linux では "Control" に、macOS では "Meta" に解決されます。
- noWaitAfter boolean (optional)追加バージョン: v1.28#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- position Object (optional)#
  - x number
  - y number
  要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
- trial boolean (optional)#
  
  設定すると、このメソッドはアクション可能性チェックのみを実行し、アクションはスキップします。デフォルトはfalseです。アクションを実行せずに要素がアクションの準備が整うまで待機するのに役立ちます。キーボードのmodifiersは、それらのキーが押されたときにのみ表示される要素をテストできるように、trialに関係なく押されます。

戻り値

Promise<void>#

詳細

このメソッドは、次の手順を実行して要素にホバーします。

forceオプションが設定されていない限り、要素のアクション可能性チェックを待ちます。
必要に応じて要素を表示するためにスクロールします。
page.mouseを使用して要素の中央、または指定されたpositionにホバーします。

アクション中に要素が DOM から分離された場合、このメソッドはスローします。

innerHTML

追加されたバージョン: v1.14

locator.innerHTML

element.innerHTML を返します。

使用法

await locator.innerHTML();
await locator.innerHTML(options);

引数

options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<string>#

innerText

追加されたバージョン: v1.14

locator.innerText

element.innerText を返します。

テキストのアサート

使用法

await locator.innerText();
await locator.innerText(options);

引数

options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<string>#

inputValue

追加されたバージョン: v1.14

locator.inputValue

一致する <input>、<textarea>、または <select> 要素の値を返します。

値のアサート

入力値をアサートする必要がある場合は、不安定さを避けるためにexpect(locator).toHaveValue()を使用することをお勧めします。詳細については、アサーションガイドを参照してください。

使用法

const value = await page.getByRole('textbox').inputValue();

引数

options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<string>#

詳細

入力、テキストエリア、または選択要素ではない要素をスローします。ただし、要素が関連付けられたコントロールを持つ <label> 要素内にある場合、コントロールの値を返します。

isChecked

追加されたバージョン: v1.14

locator.isChecked

要素がチェックされているかどうかを返します。要素がチェックボックスまたはラジオ入力でない場合、スローします。

チェック状態のアサート

チェックボックスがチェックされていることをアサートする必要がある場合は、不安定さを避けるためにexpect(locator).toBeChecked()を使用することをお勧めします。詳細については、アサーションガイドを参照してください。

使用法

const checked = await page.getByRole('checkbox').isChecked();

引数

options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<boolean>#

isDisabled

追加されたバージョン: v1.14

locator.isDisabled

要素が無効かどうかを返します。enabledの反対です。

無効状態のアサート

要素が無効であることをアサートする必要がある場合は、不安定さを避けるためにexpect(locator).toBeDisabled()を使用することをお勧めします。詳細については、アサーションガイドを参照してください。

使用法

const disabled = await page.getByRole('button').isDisabled();

引数

options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<boolean>#

isEditable

追加されたバージョン: v1.14

locator.isEditable

要素が編集可能かどうかを返します。ターゲット要素が<input>、<textarea>、<select>、[contenteditable]ではなく、[aria-readonly]を許可するロールを持たない場合、このメソッドはエラーをスローします。

編集可能状態のアサート

要素が編集可能であることをアサートする必要がある場合は、不安定さを避けるためにexpect(locator).toBeEditable()を使用することをお勧めします。詳細については、アサーションガイドを参照してください。

使用法

const editable = await page.getByRole('textbox').isEditable();

引数

options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<boolean>#

isEnabled

追加されたバージョン: v1.14

locator.isEnabled

要素が有効かどうかを返します。

有効状態のアサート

要素が有効であることをアサートする必要がある場合は、不安定さを避けるためにexpect(locator).toBeEnabled()を使用することをお勧めします。詳細については、アサーションガイドを参照してください。

使用法

const enabled = await page.getByRole('button').isEnabled();

引数

options Object (optional)
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<boolean>#

isHidden

追加されたバージョン: v1.14

locator.isHidden

要素が非表示かどうかを返します。visibleの反対です。

可視性のアサート

要素が非表示であることをアサートする必要がある場合は、不安定さを避けるためにexpect(locator).toBeHidden()を使用することをお勧めします。詳細については、アサーションガイドを参照してください。

使用法

const hidden = await page.getByRole('button').isHidden();

引数

options Object (optional)
- timeout number (optional)#
  
  非推奨
  このオプションは無視されます。locator.isHidden()は要素が非表示になるのを待たずに即座に返します。

戻り値

Promise<boolean>#

isVisible

追加されたバージョン: v1.14

locator.isVisible

要素が表示可能かどうかを返します。

可視性のアサート

要素が表示可能であることをアサートする必要がある場合は、不安定さを避けるためにexpect(locator).toBeVisible()を使用することをお勧めします。詳細については、アサーションガイドを参照してください。

使用法

const visible = await page.getByRole('button').isVisible();

引数

options Object (optional)
- timeout number (optional)#
  
  非推奨
  このオプションは無視されます。locator.isVisible()は要素が表示されるのを待たずに即座に返します。

戻り値

Promise<boolean>#

last

追加されたバージョン: v1.14

locator.last

最後の一致要素のロケーターを返します。

使用法

const banana = await page.getByRole('listitem').last();

戻り値

Locator #

locator

追加されたバージョン: v1.14

locator.locator

このメソッドは、ロケーターのサブツリー内で指定されたセレクターに一致する要素を見つけます。locator.filter()メソッドと同様に、フィルターオプションも受け入れます。

ロケーターの詳細.

使用法

locator.locator(selectorOrLocator);
locator.locator(selectorOrLocator, options);

引数

selectorOrLocator string | Locator #

DOM要素を解決するときに使用するセレクターまたはロケーター。
options Object (optional)
- has Locator (optional)#
  
  この相対ロケーターに一致する要素を含む結果にメソッドの結果を絞り込みます。例えば、text=Playwrightを持つarticleは<article><div>Playwright</div></article>に一致します。
  
  内部ロケーターは**外部ロケーターに対して相対的**でなければならず、ドキュメントルートではなく外部ロケーターの一致からクエリが開始されます。例えば、<article><content><div>Playwright</div></content></article>でdivを持つcontentを見つけることができます。しかし、article divを持つcontentを探すと、内部ロケーターは相対的でなければならず、contentの外部の要素を使用すべきではないため、失敗します。
  
  外部ロケーターと内部ロケーターは同じフレームに属している必要があります。内部ロケーターにはFrameLocatorを含めることはできません。
- hasNot Locator (オプション)追加バージョン: v1.33#
  
  内部ロケーターに一致する要素を含まない要素に一致します。内部ロケーターは外部ロケーターに対してクエリされます。例えば、divを持たないarticleは<article><span>Playwright</span></article>に一致します。
  
  外部ロケーターと内部ロケーターは同じフレームに属している必要があります。内部ロケーターにはFrameLocatorを含めることはできません。
- hasNotText string | RegExp (オプション)追加バージョン: v1.33#
  
  指定されたテキストを内部のどこか（子または子孫要素内も含む）に含まない要素に一致します。stringが渡された場合、大文字小文字を区別せず、部分文字列を検索します。
- hasText string | RegExp (optional)#
  
  指定されたテキストを内部のどこか（子または子孫要素内も含む）に含む要素に一致します。stringが渡された場合、大文字小文字を区別せず、部分文字列を検索します。例えば、"Playwright"は<article><div>Playwright</div></article>に一致します。

戻り値

Locator #

nth

追加されたバージョン: v1.14

locator.nth

n番目の一致する要素のロケーターを返します。0から始まるため、nth(0) は最初の要素を選択します。

使用法

const banana = await page.getByRole('listitem').nth(2);

引数

index number #

戻り値

Locator #

or

追加バージョン: v1.33

locator.or

2つのロケーターのいずれかまたは両方に一致するすべての要素に一致するロケーターを作成します。

両方のロケーターが何かに一致する場合、結果のロケーターには複数の一致があり、ロケーターの厳密性違反を引き起こす可能性があることに注意してください。

使用法

「新しいメール」ボタンをクリックしたいが、セキュリティ設定ダイアログが代わりに表示される場合を考えてみましょう。この場合、「新しいメール」ボタンまたはダイアログのいずれかを待ち、それに応じて動作できます。

注

"New email"ボタンとセキュリティダイアログの両方が画面に表示される場合、"or"ロケーターは両方に一致し、"strict mode violation"エラーをスローする可能性があります。この場合、locator.first()を使用してどちらか一方のみに一致させることができます。

const newEmail = page.getByRole('button', { name: 'New' });
const dialog = page.getByText('Confirm security settings');
await expect(newEmail.or(dialog).first()).toBeVisible();
if (await dialog.isVisible())
  await page.getByRole('button', { name: 'Dismiss' }).click();
await newEmail.click();

引数

locator Locator #

一致する代替ロケーター。

戻り値

Locator #

page

追加されたバージョン: v1.19

locator.page

このロケーターが属するページ。

使用法

locator.page();

戻り値

Page #

press

追加されたバージョン: v1.14

locator.press

一致する要素にフォーカスを当て、キーの組み合わせを押します。

使用法

await page.getByRole('textbox').press('Backspace');

引数

key string #

押すキーの名前、または ArrowLeft や a などの生成する文字。
options Object (optional)
- delay number (optional)#
  
  keydown と keyup の間の待機時間 (ミリ秒)。デフォルトは 0 です。
- noWaitAfter boolean (optional)#
  
  非推奨
  このオプションは将来 true になります。
  
  ナビゲーションを開始するアクションは、これらのナビゲーションが発生し、ページがロードを開始するのを待機します。このフラグを設定することで、待機をオプトアウトできます。これは、アクセスできないページにナビゲートするなどの例外的な場合にのみ必要です。デフォルトは false です。
- timeout number (optional)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<void>#

詳細

要素にフォーカスし、その後keyboard.down()とkeyboard.up()を使用します。

keyは、意図したkeyboardEvent.key値を指定するか、テキストを生成するための一文字を指定できます。key値のスーパーセットはこちらで見つけることができます。キーの例は次のとおりです。

F1 - F12, Digit0- Digit9, KeyA- KeyZ, Backquote, Minus, Equal, Backslash, Backspace, Tab, Delete, Escape, ArrowDown, End, Enter, Home, Insert, PageDown, PageUp, ArrowRight, ArrowUpなど。

以下の修飾ショートカットもサポートされています：Shift, Control, Alt, Meta, ShiftLeft, ControlOrMeta。 ControlOrMetaはWindowsおよびLinuxではControlに、macOSではMetaに解決されます。

Shiftを押したままにすると、keyに対応するテキストが大文字で入力されます。

keyが一文字の場合、大文字小文字を区別するため、aとAの値は異なるテキストを生成します。

key: "Control+o"、key: "Control++、key: "Control+Shift+T"のようなショートカットもサポートされています。修飾キーを指定した場合、修飾キーは押し続けられ、その後に続くキーが押されます。

pressSequentially

追加バージョン: v1.38

locator.pressSequentially

ヒント

ほとんどの場合、代わりにlocator.fill()を使用する必要があります。ページに特別なキーボード処理がある場合にのみ、1つずつキーを押す必要があります。

要素にフォーカスし、テキスト内の各文字に対してkeydown、keypress/input、およびkeyupイベントを送信します。

ControlやArrowDownなどの特殊キーを押すには、locator.press()を使用します。

使用法

await locator.pressSequentially('Hello'); // Types instantly
await locator.pressSequentially('World', { delay: 100 }); // Types slower, like a user

テキストフィールドに入力し、フォームを送信する例

const locator = page.getByLabel('Password');
await locator.pressSequentially('my password');
await locator.press('Enter');

引数

text string #

フォーカスされた要素に順次押す文字の文字列。
options Object (optional)
- delay number (optional)#
  
  キー押下間の待機時間（ミリ秒）。デフォルトは0です。
- noWaitAfter boolean (オプション)#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<void>#

screenshot

追加されたバージョン: v1.14

locator.screenshot

ロケーターに一致する要素のスクリーンショットを撮ります。

使用法

await page.getByRole('link').screenshot();

アニメーションを無効にし、スクリーンショットをファイルに保存します

await page.getByRole('link').screenshot({ animations: 'disabled', path: 'link.png' });

引数

options Object (optional)
- animations "disabled" | "allow" (オプション)#
  
  "disabled"に設定すると、CSSアニメーション、CSSトランジション、Webアニメーションが停止します。アニメーションは期間によって異なる扱いを受けます。
  - 有限のアニメーションは完了まで早送りされ、transitionendイベントが発生します。
  - 無限のアニメーションは初期状態にキャンセルされ、スクリーンショットの後に再生されます。
  デフォルトは"allow"で、アニメーションはそのまま残されます。
- caret "hide" | "initial" (オプション)#
  
  "hide"に設定すると、スクリーンショットはテキストキャレットを非表示にします。"initial"に設定すると、テキストキャレットの動作は変更されません。デフォルトは"hide"です。
- mask Array<Locator> (オプション)#
  
  スクリーンショット撮影時にマスクされるロケーターを指定します。マスクされた要素は、バウンディングボックスを完全に覆うピンクのボックス #FF00FF（maskColor でカスタマイズ可能）でオーバーレイされます。マスクは非表示の要素にも適用されます。表示されている要素のみに一致させるを参照して、これを無効にしてください。
- maskColor string (オプション)追加されたバージョン: v1.35#
  
  CSSカラー形式で、マスクされた要素のオーバーレイボックスの色を指定します。デフォルトの色はピンク#FF00FFです。
- omitBackground boolean (オプション)#
  
  デフォルトの白い背景を非表示にし、透過性のあるスクリーンショットをキャプチャできるようにします。jpeg画像には適用されません。デフォルトはfalseです。
- path string (オプション)#
  
  画像を保存するファイルパス。スクリーンショットの種類はファイル拡張子から推測されます。path が相対パスの場合、現在の作業ディレクトリを基準にして解決されます。パスが指定されていない場合、画像はディスクに保存されません。
- quality number (オプション)#
  
  画像の品質（0～100）。png画像には適用されません。
- scale "css" | "device" (オプション)#
  
  "css"に設定すると、スクリーンショットはページ上の各CSSピクセルにつき1ピクセルになります。高DPIデバイスの場合、これによりスクリーンショットが小さく保たれます。"device"オプションを使用すると、各デバイスピクセルにつき1ピクセルが生成されるため、高DPIデバイスのスクリーンショットは2倍以上大きくなります。
  
  デフォルトは"device"です。
- style string (オプション)追加日: v1.41#
  
  スクリーンショット作成時に適用するスタイルシートのテキスト。これにより、動的な要素を非表示にしたり、要素を見えなくしたり、プロパティを変更したりして、再現性のあるスクリーンショットを作成するのに役立ちます。このスタイルシートはShadow DOMを貫通し、内部フレームにも適用されます。
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
- type "png" | "jpeg" (オプション)#
  
  スクリーンショットの種類を指定します。デフォルトはpngです。

戻り値

Promise<Buffer>#

詳細

このメソッドは、ロケーターに一致する特定の要素のサイズと位置に合わせてクリップされたページのスクリーンショットをキャプチャします。要素が他の要素で覆われている場合、スクリーンショットには実際には表示されません。要素がスクロール可能なコンテナの場合、現在スクロールされているコンテンツのみがスクリーンショットに表示されます。

このメソッドは、アクション性チェックを待機し、スクリーンショットを撮る前に要素をビュー内にスクロールします。要素がDOMからデタッチされている場合、このメソッドはエラーをスローします。

キャプチャされたスクリーンショットを含むバッファを返します。

scrollIntoViewIfNeeded

追加されたバージョン: v1.14

locator.scrollIntoViewIfNeeded

このメソッドは、アクション性チェックを待機し、IntersectionObserver の ratio で定義されたとおりに完全に表示されていない限り、要素をビュー内にスクロールしようとします。

他のスクロール方法については、スクロールを参照してください。

使用法

await locator.scrollIntoViewIfNeeded();
await locator.scrollIntoViewIfNeeded(options);

引数

options Object (optional)
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<void>#

selectOption

追加されたバージョン: v1.14

locator.selectOption

<select>のオプションを選択します。

使用法

<select multiple>
  <option value="red">Red</option>
  <option value="green">Green</option>
  <option value="blue">Blue</option>
</select>

// single selection matching the value or label
element.selectOption('blue');

// single selection matching the label
element.selectOption({ label: 'Blue' });

// multiple selection for red, green and blue options
element.selectOption(['red', 'green', 'blue']);

引数

values null | string | ElementHandle | Array<string> | Object | Array<ElementHandle> | Array<Object>#
- value string (オプション)
  
  option.value で一致します。任意。
- label string (オプション)
  
  option.label で一致します。任意。
- index number (オプション)
  
  インデックスで一致します。任意。
選択するオプション。 <select> に multiple 属性がある場合、一致するすべてのオプションが選択され、そうでない場合は、渡されたオプションのいずれかに一致する最初のオプションのみが選択されます。文字列値は値とラベルの両方に一致します。すべての指定されたプロパティが一致する場合、オプションは一致すると見なされます。
options Object (optional)
- force boolean (オプション)#
  
  アクション可能性チェックをバイパスするかどうか。デフォルトはfalseです。
- noWaitAfter boolean (オプション)#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<Array<string>>#

詳細

このメソッドは、アクション性チェックを待機し、指定されたすべてのオプションが <select> 要素に存在し、それらのオプションを選択するまで待機します。

ターゲット要素が<select>要素でない場合、このメソッドはエラーをスローします。ただし、要素が関連するコントロールを持つ<label>要素内にある場合、代わりにそのコントロールが使用されます。

正常に選択されたオプション値の配列を返します。

提供されたすべてのオプションが選択されると、changeおよびinputイベントをトリガーします。

selectText

追加されたバージョン: v1.14

locator.selectText

このメソッドは、アクション性チェックを待機し、要素にフォーカスしてそのテキストコンテンツをすべて選択します。

要素が関連するコントロールを持つ<label>要素内にある場合、代わりにコントロールにフォーカスしてテキストを選択します。

使用法

await locator.selectText();
await locator.selectText(options);

引数

options Object (optional)
- force boolean (オプション)#
  
  アクション可能性チェックをバイパスするかどうか。デフォルトはfalseです。
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<void>#

setChecked

追加されたバージョン: v1.15

locator.setChecked

チェックボックスまたはラジオ要素の状態を設定します。

使用法

await page.getByRole('checkbox').setChecked(true);

引数

checked boolean #

チェックボックスをチェックするか、チェックを外すか。
options Object (optional)
- force boolean (オプション)#
  
  アクション可能性チェックをバイパスするかどうか。デフォルトはfalseです。
- noWaitAfter boolean (オプション)#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- position Object (オプション)#
  - x number
  - y number
  要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
- trial boolean (オプション)#
  
  設定すると、このメソッドはアクション可能性チェックのみを実行し、アクションはスキップします。デフォルトはfalseです。アクションを実行せずに要素がアクションの準備が整うまで待機するのに役立ちます。

戻り値

Promise<void>#

詳細

このメソッドは、以下の手順を実行して要素をチェックまたはチェック解除します。

一致する要素がチェックボックスまたはラジオ入力であることを確認します。そうでない場合、このメソッドはエラーをスローします。
要素がすでに正しいチェック状態である場合、このメソッドはすぐに戻ります。
force オプションが設定されていない限り、一致した要素のアクション性チェックを待機します。チェック中に要素がデタッチされた場合、アクション全体が再試行されます。
必要に応じて要素を表示するためにスクロールします。
page.mouseを使用して要素の中央をクリックします。
要素がチェックまたはチェック解除されたことを確認します。そうでない場合、このメソッドはエラーをスローします。

指定されたタイムアウト期間中にすべての手順が完了しなかった場合、このメソッドはTimeoutErrorをスローします。タイムアウトをゼロにすると、これが無効になります。

setInputFiles

追加されたバージョン: v1.14

locator.setInputFiles

<input type=file>にファイルまたは複数のファイルをアップロードします。[webkitdirectory]属性を持つ入力の場合、単一のディレクトリパスのみがサポートされます。

使用法

// Select one file
await page.getByLabel('Upload file').setInputFiles(path.join(__dirname, 'myfile.pdf'));

// Select multiple files
await page.getByLabel('Upload files').setInputFiles([
  path.join(__dirname, 'file1.txt'),
  path.join(__dirname, 'file2.txt'),
]);

// Select a directory
await page.getByLabel('Upload directory').setInputFiles(path.join(__dirname, 'mydir'));

// Remove all the selected files
await page.getByLabel('Upload file').setInputFiles([]);

// Upload buffer from memory
await page.getByLabel('Upload file').setInputFiles({
  name: 'file.txt',
  mimeType: 'text/plain',
  buffer: Buffer.from('this is test')
});

引数

files string | Array<string> | Object | Array<Object>#
- name string
  
  ファイル名
- mimeType string
  
  ファイルタイプ
- buffer Buffer
  
  ファイル内容
options Object (optional)
- noWaitAfter boolean (オプション)#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<void>#

詳細

ファイル入力の値をこれらのファイルパスまたはファイルに設定します。いくつかのfilePathsが相対パスの場合、現在の作業ディレクトリからの相対パスとして解決されます。空の配列の場合、選択されたファイルをクリアします。

このメソッドは、Locator が input 要素を指すことを期待します。ただし、要素が関連する control を持つ <label> 要素内にある場合、代わりにコントロールをターゲットにします。

tap

追加されたバージョン: v1.14

locator.tap

ロケーターに一致する要素でタップジェスチャを実行します。手動でタッチイベントをディスパッチして他のジェスチャをエミュレートする例については、従来のタッチイベントのエミュレートページを参照してください。

使用法

await locator.tap();
await locator.tap(options);

引数

options Object (optional)
- force boolean (オプション)#
  
  アクション可能性チェックをバイパスするかどうか。デフォルトはfalseです。
- modifiers Array<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (オプション)#
  
  押す修飾キー。操作中にこれらの修飾キーのみが押されていることを保証し、現在の修飾キーを元に戻します。指定しない場合、現在押されている修飾キーが使用されます。"ControlOrMeta" は、Windows と Linux では "Control" に、macOS では "Meta" に解決されます。
- noWaitAfter boolean (オプション)#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- position Object (オプション)#
  - x number
  - y number
  要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
- trial boolean (オプション)#
  
  設定すると、このメソッドはアクション可能性チェックのみを実行し、アクションはスキップします。デフォルトはfalseです。アクションを実行せずに要素がアクションの準備が整うまで待機するのに役立ちます。キーボードのmodifiersは、それらのキーが押されたときにのみ表示される要素をテストできるように、trialに関係なく押されます。

戻り値

Promise<void>#

詳細

このメソッドは、以下の手順を実行して要素をタップします。

force オプションが設定されていない限り、要素のアクション性チェックを待機します。
必要に応じて要素を表示するためにスクロールします。
要素の中心、または指定された位置をタップするには、page.touchscreen を使用します。

アクション中に要素が DOM から分離された場合、このメソッドはスローします。

注

element.tap()を使用するには、ブラウザコンテキストのhasTouchオプションがtrueに設定されている必要があります。

textContent

追加されたバージョン: v1.14

locator.textContent

node.textContentを返します。

テキストのアサート

使用法

await locator.textContent();
await locator.textContent(options);

引数

options Object (optional)
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<null | string>#

uncheck

追加されたバージョン: v1.14

locator.uncheck

チェックボックスまたはラジオ要素がチェックされていないことを確認します。

使用法

await page.getByRole('checkbox').uncheck();

引数

options Object (optional)
- force boolean (オプション)#
  
  アクション可能性チェックをバイパスするかどうか。デフォルトはfalseです。
- noWaitAfter boolean (オプション)#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- position Object (オプション)#
  - x number
  - y number
  要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
- trial boolean (オプション)#
  
  設定すると、このメソッドはアクション可能性チェックのみを実行し、アクションはスキップします。デフォルトはfalseです。アクションを実行せずに要素がアクションの準備が整うまで待機するのに役立ちます。

戻り値

Promise<void>#

詳細

このメソッドは、以下の手順を実行して要素のチェックを外します。

要素がチェックボックスまたはラジオ入力であることを確認します。そうでない場合、このメソッドはエラーをスローします。要素がすでにチェックされていない場合、このメソッドはすぐに戻ります。
force オプションが設定されていない限り、要素のアクション性チェックを待機します。
必要に応じて要素を表示するためにスクロールします。
page.mouseを使用して要素の中央をクリックします。
要素がチェックされていないことを確認します。そうでない場合、このメソッドはエラーをスローします。

アクション中に要素が DOM から分離された場合、このメソッドはスローします。

waitFor

追加バージョン: v1.16

locator.waitFor

ロケーターで指定された要素が state オプションを満たした場合に返されます。

ターゲット要素がすでに条件を満たしている場合、メソッドはすぐに返されます。そうでない場合、条件が満たされるまで最大 timeout ミリ秒待機します。

使用法

const orderSent = page.locator('#order-sent');
await orderSent.waitFor();

引数

options Object (optional)
- state "attached" | "detached" | "visible" | "hidden" (オプション)#
  
  デフォルトは'visible'です。以下のいずれかになります。
  - 'attached' - 要素がDOMに存在することを待ちます。
  - 'detached' - 要素がDOMに存在しないことを待ちます。
  - 'visible' - 要素が空でない境界ボックスを持ち、visibility:hiddenがないことを待ちます。コンテンツがない要素やdisplay:noneの要素は空の境界ボックスを持つため、可視とはみなされないことに注意してください。
  - 'hidden' - 要素がDOMからデタッチされているか、空の境界ボックスを持つか、またはvisibility:hiddenを持つことを待ちます。これは'visible'オプションとは逆です。
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<void>#

非推奨

elementHandle

追加されたバージョン: v1.14

locator.elementHandle

推奨されません

ElementHandle は本質的に競合状態になりやすいため、常に Locator とウェブアサーションの使用を優先してください。

指定されたロケーターを最初の一致するDOM要素に解決します。一致する要素がない場合、1つが見つかるまで待機します。複数の要素がロケーターに一致する場合、エラーをスローします。

使用法

await locator.elementHandle();
await locator.elementHandle(options);

引数

options Object (optional)
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<ElementHandle>#

elementHandles

追加されたバージョン: v1.14

locator.elementHandles

推奨されません

ElementHandle は本質的に競合状態になりやすいため、常に Locator とウェブアサーションの使用を優先してください。

指定されたロケーターをすべての一致するDOM要素に解決します。一致する要素がない場合、空のリストを返します。

使用法

await locator.elementHandles();

戻り値

Promise<Array<ElementHandle>>#

type

追加されたバージョン: v1.14

locator.type

非推奨

ほとんどの場合、代わりに locator.fill() を使用してください。ページに特別なキーボード処理がある場合にのみ、キーを1つずつ押す必要があります。その場合は locator.pressSequentially() を使用してください。

要素にフォーカスし、テキスト内の各文字に対してkeydown、keypress/input、およびkeyupイベントを送信します。

ControlやArrowDownなどの特殊キーを押すには、locator.press()を使用します。

使用法

引数

text string #

フォーカスされた要素に入力するテキスト。
options Object (optional)
- delay number (オプション)#
  
  キー押下間の待機時間（ミリ秒）。デフォルトは0です。
- noWaitAfter boolean (オプション)#
  
  非推奨
  このオプションは効果がありません。
  
  このオプションは効果がありません。
- timeout number (オプション)#
  
  最大タイムアウト時間（ミリ秒単位）。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、config の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値

Promise<void>#

メソッド​

all​

allInnerTexts​

allTextContents​

and​

ariaSnapshot​

blur​

boundingBox​

check​

clear​

click​

contentFrame​

count​

dblclick​

describe​

dispatchEvent​

dragTo​

evaluate​

evaluateAll​

evaluateHandle​

fill​

filter​

first​

focus​

frameLocator​

getAttribute​

getByAltText​

getByLabel​

getByPlaceholder​

getByRole​

getByTestId​

getByText​

getByTitle​

highlight​

hover​

innerHTML​

innerText​

inputValue​

isChecked​

isDisabled​

isEditable​

isEnabled​

isHidden​

isVisible​

last​

locator​

nth​

or​

page​

press​

pressSequentially​

screenshot​

scrollIntoViewIfNeeded​

selectOption​

selectText​

setChecked​

setInputFiles​

tap​

textContent​

uncheck​

waitFor​

非推奨​

elementHandle​

elementHandles​

type​

メソッド

all

allInnerTexts

allTextContents

and

ariaSnapshot

blur

boundingBox

check

clear

click

contentFrame

count

dblclick

describe

dispatchEvent

dragTo

evaluate

evaluateAll

evaluateHandle

fill

filter

first

focus

frameLocator

getAttribute

getByAltText

getByLabel

getByPlaceholder

getByRole

getByTestId

getByText

getByTitle

highlight

hover

innerHTML

innerText

inputValue

isChecked

isDisabled

isEditable

isEnabled

isHidden

isVisible

last

locator

nth

or

page

press

pressSequentially

screenshot

scrollIntoViewIfNeeded

selectOption

selectText

setChecked

setInputFiles

tap

textContent

uncheck

waitFor

非推奨

elementHandle

elementHandles

type