メインコンテンツにスキップ

Frame

ページは、どの時点においても、page.mainFrame()frame.childFrames() メソッドによって現在のフレームツリーを公開します。

Frame オブジェクトのライフサイクルは、ページオブジェクトでディスパッチされる3つのイベントによって制御されます。

  • page.on('frameattached') - フレームがページにアタッチされたときに発火します。フレームはページに一度だけアタッチされます。
  • page.on('framenavigated') - フレームが別のURLへのナビゲーションをコミットしたときに発火します。
  • page.on('framedetached') - フレームがページからデタッチされたときに発火します。フレームはページから一度だけデタッチされます。

フレームツリーのダンプの例

const { firefox } = require('playwright');  // Or 'chromium' or 'webkit'.

(async () => {
const browser = await firefox.launch();
const page = await browser.newPage();
await page.goto('https://www.google.com/chrome/browser/canary.html');
dumpFrameTree(page.mainFrame(), '');
await browser.close();

function dumpFrameTree(frame, indent) {
console.log(indent + frame.url());
for (const child of frame.childFrames())
dumpFrameTree(child, indent + ' ');
}
})();

メソッド

addScriptTag

v1.9より前に追加 frame.addScriptTag

スクリプトの onload が発火したとき、またはスクリプトの内容がフレームに注入されたときに追加されたタグを返します。

指定された URL またはコンテンツを持つ <script> タグをページに追加します。

使用法

await frame.addScriptTag();
await frame.addScriptTag(options);

引数

  • options Object (optional)
    • content string (オプション)#

      フレームに注入する生の JavaScript コンテンツ。

    • path string (オプション)#

      フレームに注入する JavaScript ファイルへのパス。path が相対パスの場合、現在の作業ディレクトリを基準にして解決されます。

    • type string (オプション)#

      スクリプトのタイプ。JavaScript ES6 モジュールを読み込むには 'module' を使用します。詳細については script を参照してください。

    • url string (オプション)#

      追加するスクリプトの URL。

戻り値


addStyleTag

v1.9より前に追加 frame.addStyleTag

スタイルシートの onload が発火したとき、または CSS コンテンツがフレームに注入されたときに追加されたタグを返します。

目的の URL を持つ <link rel="stylesheet"> タグ、またはコンテンツを持つ <style type="text/css"> タグをページに追加します。

使用法

await frame.addStyleTag();
await frame.addStyleTag(options);

引数

  • options Object (optional)
    • content string (オプション)#

      フレームに注入する生の CSS コンテンツ。

    • path string (オプション)#

      フレームに注入する CSS ファイルへのパス。path が相対パスの場合、現在の作業ディレクトリを基準にして解決されます。

    • url string (オプション)#

      <link> タグの URL。

戻り値


childFrames

v1.9より前に追加 frame.childFrames

使用法

frame.childFrames();

戻り値


content

v1.9より前に追加 frame.content

doctype を含む、フレームの完全な HTML コンテンツを取得します。

使用法

await frame.content();

戻り値


dragAndDrop

追加バージョン: v1.13 frame.dragAndDrop

使用法

await frame.dragAndDrop(source, target);
await frame.dragAndDrop(source, target, options);

引数

  • source string#

    ドラッグする要素を検索するためのセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • target string#

    ドロップする要素を検索するためのセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • force boolean (オプション)#

      actionability チェックをバイパスするかどうか。デフォルトは false です。

    • noWaitAfter boolean (オプション)#

      非推奨

      このオプションは効果がありません。

      このオプションは効果がありません。

    • sourcePosition Object (オプション)追加されたバージョン: v1.14#

      要素のパディングボックスの左上隅を基準としたこの点でソース要素をクリックします。指定しない場合、要素のいくつかの可視点が使用されます。

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • targetPosition Object (オプション)追加されたバージョン: v1.14#

      要素のパディングボックスの左上隅を基準としたこの点でターゲット要素にドロップします。指定しない場合、要素のいくつかの可視点が使用されます。

    • timeout number (オプション)#

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

    • trial boolean (オプション)#

      設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは false です。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。

戻り値


evaluate

v1.9より前に追加 frame.evaluate

pageFunction の戻り値を返します。

frame.evaluate() に渡された関数が Promise を返す場合、frame.evaluate() はその Promise が解決されるのを待ってその値を返します。

frame.evaluate() に渡された関数が Serializable ではない値を返す場合、frame.evaluate()undefined を返します。Playwright は、JSON によってシリアル化できない一部の追加の値も転送することをサポートしています: -0NaNInfinity-Infinity

使用法

const result = await frame.evaluate(([x, y]) => {
return Promise.resolve(x * y);
}, [7, 8]);
console.log(result); // prints "56"

関数の代わりに文字列も渡すことができます。

console.log(await frame.evaluate('1 + 2')); // prints "3"

ElementHandle インスタンスは、frame.evaluate() の引数として渡すことができます。

const bodyHandle = await frame.evaluate('document.body');
const html = await frame.evaluate(([body, suffix]) =>
body.innerHTML + suffix, [bodyHandle, 'hello'],
);
await bodyHandle.dispose();

引数

戻り値


evaluateHandle

v1.9より前に追加 frame.evaluateHandle

pageFunction の戻り値を JSHandle として返します。

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

frame.evaluateHandle() に渡された関数が Promise を返す場合、frame.evaluateHandle() はその Promise が解決されるのを待ってその値を返します。

使用法

// Handle for the window object
const aWindowHandle = await frame.evaluateHandle(() => Promise.resolve(window));

関数の代わりに文字列も渡すことができます。

const aHandle = await frame.evaluateHandle('document'); // Handle for the 'document'.

JSHandle インスタンスは、frame.evaluateHandle() の引数として渡すことができます。

const aHandle = await frame.evaluateHandle(() => document.body);
const resultHandle = await frame.evaluateHandle(([body, suffix]) =>
body.innerHTML + suffix, [aHandle, 'hello'],
);
console.log(await resultHandle.jsonValue());
await resultHandle.dispose();

引数

戻り値


frameElement

v1.9より前に追加 frame.frameElement

このフレームに対応する frame または iframe 要素ハンドルを返します。

これは elementHandle.contentFrame() の逆です。返されるハンドルは実際には親フレームに属することに注意してください。

このメソッドは、frameElement() が返される前にフレームがデタッチされた場合、エラーをスローします。

使用法

const frameElement = await frame.frameElement();
const contentFrame = await frameElement.contentFrame();
console.log(frame === contentFrame); // -> true

戻り値


frameLocator

追加バージョン: v1.17 frame.frameLocator

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

使用法

次のスニペットは、<iframe id="my-frame"> のように、id が my-frame の iframe 内のテキスト "Submit" を持つ要素を特定します。

const locator = frame.frameLocator('#my-iframe').getByText('Submit');
await locator.click();

引数

  • selector string#

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

戻り値


getByAltText

追加バージョン: v1.27 frame.getByAltText

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

使用法

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

<img alt='Playwright logo'>
await page.getByAltText('Playwright logo').click();

引数

  • text string | RegExp#

    要素を特定するためのテキスト。

  • options Object (optional)

    • exact boolean (オプション)#

      完全一致(大文字小文字を区別し、文字列全体)を見つけるかどうか。デフォルトはfalse。正規表現で特定する場合は無視されます。正確な一致でも空白はトリムされることに注意してください。

戻り値


getByLabel

追加バージョン: v1.27 frame.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 (オプション)#

      完全一致(大文字小文字を区別し、文字列全体)を見つけるかどうか。デフォルトはfalse。正規表現で特定する場合は無視されます。正確な一致でも空白はトリムされることに注意してください。

戻り値


getByPlaceholder

追加バージョン: v1.27 frame.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 (オプション)#

      完全一致(大文字小文字を区別し、文字列全体)を見つけるかどうか。デフォルトはfalse。正規表現で特定する場合は無視されます。正確な一致でも空白はトリムされることに注意してください。

戻り値


getByRole

追加バージョン: v1.27 frame.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 (オプション)#

      通常、aria-checkedまたはネイティブの<input type=checkbox>コントロールによって設定される属性。

      aria-checkedの詳細。

    • disabled boolean (オプション)#

      通常、aria-disabledまたはdisabledによって設定される属性。

      他のほとんどの属性とは異なり、disabledはDOM階層を介して継承されます。aria-disabledの詳細。

    • exact boolean (オプション)追加バージョン: v1.28#

      name が完全に一致するかどうか: 大文字と小文字を区別し、完全な文字列。デフォルトは false です。name が正規表現の場合は無視されます。厳密な一致でも空白はトリムされることに注意してください。

    • expanded boolean (オプション)#

      通常、aria-expandedによって設定される属性。

      aria-expandedの詳細。

    • includeHidden boolean (オプション)#

      非表示要素が一致するかどうかを制御するオプション。デフォルトでは、ARIAで定義されているように、非表示でない要素のみがロールセレクターによって一致します。

      aria-hiddenの詳細。

    • level number (オプション)#

      通常、headinglistitemrowtreeitemのロールに存在する数値属性で、<h1>-<h6>要素のデフォルト値があります。

      aria-levelの詳細。

    • name string | RegExp (オプション)#

      アクセシブルネームに一致するオプション。デフォルトでは、大文字と小文字を区別せず、部分文字列を検索します。exact を使用してこの動作を制御します。

      アクセシブルネームの詳細。

    • pressed boolean (オプション)#

      通常、aria-pressedによって設定される属性。

      aria-pressedの詳細。

    • selected boolean (オプション)#

      通常、aria-selectedによって設定される属性。

      aria-selectedの詳細。

戻り値

詳細

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

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


getByTestId

追加バージョン: v1.27 frame.getByTestId

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

使用法

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

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

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

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

引数

戻り値

詳細

デフォルトでは、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 frame.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 (オプション)#

      完全一致(大文字小文字を区別し、文字列全体)を見つけるかどうか。デフォルトはfalse。正規表現で特定する場合は無視されます。正確な一致でも空白はトリムされることに注意してください。

戻り値

詳細

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

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


getByTitle

追加バージョン: v1.27 frame.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 (オプション)#

      完全一致(大文字小文字を区別し、文字列全体)を見つけるかどうか。デフォルトはfalse。正規表現で特定する場合は無視されます。正確な一致でも空白はトリムされることに注意してください。

戻り値


goto

v1.9より前に追加 frame.goto

メインリソースのレスポンスを返します。複数のリダイレクトの場合、ナビゲーションは最後のリダイレクトのレスポンスで解決されます。

このメソッドは、以下の場合にエラーをスローします。

  • SSL エラーがある場合 (例: 自己署名証明書の場合)。
  • ターゲット URL が無効な場合。
  • ナビゲーション中に timeout が超過した場合。
  • リモートサーバーが応答しない、または到達できない場合。
  • メインリソースの読み込みに失敗した場合。

このメソッドは、404 "Not Found" や 500 "Internal Server Error" を含む、リモートサーバーから有効な HTTP ステータスコードが返された場合、エラーをスローしません。このようなレスポンスのステータスコードは response.status() を呼び出すことで取得できます。

このメソッドは、エラーをスローするか、メインリソースのレスポンスを返します。唯一の例外は、about:blank へのナビゲーション、または異なるハッシュを持つ同じ URL へのナビゲーションで、これは成功し、null を返します。

ヘッドレスモードは PDF ドキュメントへのナビゲーションをサポートしていません。上流の課題を参照してください。

使用法

await frame.goto(url);
await frame.goto(url, options);

引数

  • url string#

    フレームをナビゲートする URL。URL にはスキーム (例: https://) を含める必要があります。

  • options Object (optional)

    • referer string (オプション)#

      リファラーヘッダーの値。指定された場合、page.setExtraHTTPHeaders() によって設定されたリファラーヘッダーの値よりも優先されます。

    • timeout number (オプション)#

      ミリ秒単位の最大操作時間。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、設定の navigationTimeout オプション、または browserContext.setDefaultNavigationTimeout()browserContext.setDefaultTimeout()page.setDefaultNavigationTimeout()page.setDefaultTimeout() メソッドを使用して変更できます。

    • waitUntil "load" | "domcontentloaded" | "networkidle" | "commit" (オプション)#

      操作が成功したと見なすタイミング。デフォルトは load です。イベントは次のいずれかです。

      • 'domcontentloaded' - DOMContentLoaded イベントが発火したときに操作が終了したと見なします。
      • 'load' - load イベントが発火したときに操作が終了したと見なします。
      • 'networkidle' - 推奨されません 少なくとも 500 ミリ秒間ネットワーク接続がないときに操作が終了したと見なします。テストにはこのメソッドを使用せず、代わりにウェブアサーションに頼って準備状況を評価してください。
      • 'commit' - ネットワーク応答が受信され、ドキュメントの読み込みが開始されたときに操作が終了したと見なします。

戻り値


isDetached

v1.9より前に追加 frame.isDetached

フレームがデタッチされている場合は true を、それ以外の場合は false を返します。

使用法

frame.isDetached();

戻り値


isEnabled

v1.9より前に追加 frame.isEnabled

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

使用法

await frame.isEnabled(selector);
await frame.isEnabled(selector, options);

引数

  • selector string#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout number (オプション)#

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

戻り値


locator

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

このメソッドは、このページ/フレームでアクションを実行するために使用できる要素ロケーターを返します。ロケーターは、アクションを実行する直前に要素に解決されるため、同じロケーターに対する一連のアクションは、実際には異なる DOM 要素に対して実行される可能性があります。これは、それらのアクション間の DOM 構造が変更された場合に発生します。

ロケーターの詳細.

ロケーターの詳細.

使用法

frame.locator(selector);
frame.locator(selector, options);

引数

  • selector string#

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

  • options Object (optional)

    • has Locator (オプション)#

      この相対ロケーターに一致する要素を含む結果にメソッドの結果を絞り込みます。例えば、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 (オプション)#

      指定されたテキストを内部のどこか(子または子孫要素内も含む)に含む要素に一致します。stringが渡された場合、大文字小文字を区別せず、部分文字列を検索します。例えば、"Playwright"<article><div>Playwright</div></article>に一致します。

戻り値


name

v1.9より前に追加 frame.name

タグで指定されたフレームの name 属性を返します。

名前が空の場合、代わりに id 属性を返します。

この値は、フレームが作成されたときに一度計算され、後で属性が変更されても更新されません。

使用法

frame.name();

戻り値


page

v1.9より前に追加 frame.page

このフレームを含むページを返します。

使用法

frame.page();

戻り値


parentFrame

v1.9より前に追加 frame.parentFrame

親フレームがある場合、親フレームを返します。デタッチされたフレームとメインフレームは null を返します。

使用法

frame.parentFrame();

戻り値


setContent

v1.9より前に追加 frame.setContent

このメソッドは内部的に document.write() を呼び出し、そのすべての特定の特性と動作を継承します。

使用法

await frame.setContent(html);
await frame.setContent(html, options);

引数

  • html string#

    ページに割り当てる HTML マークアップ。

  • options Object (optional)

    • timeout number (オプション)#

      ミリ秒単位の最大操作時間。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、設定の navigationTimeout オプション、または browserContext.setDefaultNavigationTimeout()browserContext.setDefaultTimeout()page.setDefaultNavigationTimeout()page.setDefaultTimeout() メソッドを使用して変更できます。

    • waitUntil "load" | "domcontentloaded" | "networkidle" | "commit" (オプション)#

      操作が成功したと見なすタイミング。デフォルトは load です。イベントは次のいずれかです。

      • 'domcontentloaded' - DOMContentLoaded イベントが発火したときに操作が終了したと見なします。
      • 'load' - load イベントが発火したときに操作が終了したと見なします。
      • 'networkidle' - 推奨されません 少なくとも 500 ミリ秒間ネットワーク接続がないときに操作が終了したと見なします。テストにはこのメソッドを使用せず、代わりにウェブアサーションに頼って準備状況を評価してください。
      • 'commit' - ネットワーク応答が受信され、ドキュメントの読み込みが開始されたときに操作が終了したと見なします。

戻り値


title

v1.9より前に追加 frame.title

ページのタイトルを返します。

使用法

await frame.title();

戻り値


url

v1.9より前に追加 frame.url

フレームの URL を返します。

使用法

frame.url();

戻り値


waitForFunction

v1.9より前に追加 frame.waitForFunction

pageFunction が真の値を返すと解決し、その値を返します。

使用法

frame.waitForFunction() はビューポートサイズの変化を監視するために使用できます。

const { firefox } = require('playwright');  // Or 'chromium' or 'webkit'.

(async () => {
const browser = await firefox.launch();
const page = await browser.newPage();
const watchDog = page.mainFrame().waitForFunction('window.innerWidth < 100');
await page.setViewportSize({ width: 50, height: 50 });
await watchDog;
await browser.close();
})();

frame.waitForFunction 関数の述語に引数を渡すには

const selector = '.foo';
await frame.waitForFunction(selector => !!document.querySelector(selector), selector);

引数

  • pageFunction function | string#

    ページコンテキストで評価される関数。

  • arg EvaluationArgument (オプション)#

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

  • options Object (optional)

    • polling number | "raf" (オプション)#

      polling'raf' の場合、pageFunctionrequestAnimationFrame コールバックで継続的に実行されます。polling が数値の場合、関数が実行されるミリ秒単位の間隔として扱われます。デフォルトは raf です。

    • timeout number (オプション)#

      待機する最大時間 (ミリ秒単位)。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、設定の actionTimeout オプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。

戻り値


waitForLoadState

v1.9より前に追加 frame.waitForLoadState

必要な読み込み状態に到達するまで待ちます。

このメソッドは、フレームがデフォルトで load の必要な読み込み状態に到達したときに解決します。このメソッドが呼び出された時点で、ナビゲーションはコミットされている必要があります。現在のドキュメントがすでに必要な状態に達している場合、すぐに解決します。

ほとんどの場合、Playwright は すべてのアクションの前に自動的に待機するため、このメソッドは必要ありません。

使用法

await frame.click('button'); // Click triggers navigation.
await frame.waitForLoadState(); // Waits for 'load' state by default.

引数

  • state "load" | "domcontentloaded" | "networkidle" (オプション)#

    待機するオプションの読み込み状態。デフォルトは load です。現在のドキュメントの読み込み中にすでに状態に達している場合、メソッドはすぐに解決します。次のいずれかです。

    • 'load' - load イベントが発火するまで待ちます。
    • 'domcontentloaded' - DOMContentLoaded イベントが発火するまで待ちます。
    • 'networkidle' - 推奨されません 少なくとも 500 ミリ秒間ネットワーク接続がないまで待ちます。テストにはこのメソッドを使用せず、代わりにウェブアサーションに頼って準備状況を評価してください。
  • options Object (optional)

戻り値


waitForURL

追加されたバージョン: v1.11 frame.waitForURL

フレームが指定された URL にナビゲートするまで待ちます。

使用法

await frame.click('a.delayed-navigation'); // Clicking the link will indirectly cause a navigation
await frame.waitForURL('**/target.html');

引数

  • url string | RegExp | function(URL):boolean#

    ナビゲーションを待っている間に一致するグロブパターン、正規表現パターン、または URL を受け取る述語。パラメーターがワイルドカード文字のない文字列の場合、メソッドは文字列と完全に一致する URL へのナビゲーションを待機することに注意してください。

  • options Object (optional)

    • timeout number (オプション)#

      ミリ秒単位の最大操作時間。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、設定の navigationTimeout オプション、または browserContext.setDefaultNavigationTimeout()browserContext.setDefaultTimeout()page.setDefaultNavigationTimeout()page.setDefaultTimeout() メソッドを使用して変更できます。

    • waitUntil "load" | "domcontentloaded" | "networkidle" | "commit" (オプション)#

      操作が成功したと見なすタイミング。デフォルトは load です。イベントは次のいずれかです。

      • 'domcontentloaded' - DOMContentLoaded イベントが発火したときに操作が終了したと見なします。
      • 'load' - load イベントが発火したときに操作が終了したと見なします。
      • 'networkidle' - 推奨されません 少なくとも 500 ミリ秒間ネットワーク接続がないときに操作が終了したと見なします。テストにはこのメソッドを使用せず、代わりにウェブアサーションに頼って準備状況を評価してください。
      • 'commit' - ネットワーク応答が受信され、ドキュメントの読み込みが開始されたときに操作が終了したと見なします。

戻り値


非推奨

$

追加バージョン: v1.9 frame.$
推奨されません

代わりにロケーターベースの frame.locator() を使用してください。ロケーターについて詳しくはこちら。

フレーム要素を指す ElementHandle を返します。

注意

ElementHandle の使用は推奨されません。Locator オブジェクトとweb-firstアサーションを使用してください。

このメソッドは、フレーム内で指定されたセレクターに一致する要素を検索します。セレクターに一致する要素がない場合、null を返します。

使用法

await frame.$(selector);
await frame.$(selector, options);

引数

  • selector string#

    クエリするセレクター。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

戻り値


$$

追加バージョン: v1.9 frame.$$
推奨されません

代わりにロケーターベースの frame.locator() を使用してください。ロケーターについて詳しくはこちら。

フレーム要素を指す ElementHandles を返します。

注意

ElementHandle の使用は推奨されません。代わりに Locator オブジェクトを使用してください。

このメソッドは、フレーム内で指定されたセレクターに一致するすべての要素を検索します。セレクターに一致する要素がない場合、空の配列を返します。

使用法

await frame.$$(selector);

引数

  • selector string#

    クエリするセレクター。

戻り値


$eval

追加バージョン: v1.9 frame.$eval
推奨されません

このメソッドは要素が actionability チェックに合格するのを待たないため、不安定なテストにつながる可能性があります。代わりに locator.evaluate()、その他の Locator ヘルパーメソッド、またはウェブファーストアサーションを使用してください。

pageFunction の戻り値を返します。

このメソッドは、フレーム内で指定されたセレクターに一致する要素を検索し、それを pageFunction の最初の引数として渡します。セレクターに一致する要素がない場合、このメソッドはエラーをスローします。

pageFunctionPromise を返す場合、frame.$eval() はその Promise が解決されるのを待ってその値を返します。

使用法

const searchValue = await frame.$eval('#search', el => el.value);
const preloadHref = await frame.$eval('link[rel=preload]', el => el.href);
const html = await frame.$eval('.main-container', (e, suffix) => e.outerHTML + suffix, 'hello');

引数

  • selector string#

    クエリするセレクター。

  • pageFunction function(Element) | string#

    ページコンテキストで評価される関数。

  • arg EvaluationArgument (オプション)#

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

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

戻り値


$$eval

追加バージョン: v1.9 frame.$$eval
推奨されません

ほとんどの場合、locator.evaluateAll()、その他の Locator ヘルパーメソッド、およびウェブファーストアサーションの方が優れています。

pageFunction の戻り値を返します。

このメソッドは、フレーム内で指定されたセレクターに一致するすべての要素を検索し、一致する要素の配列を pageFunction の最初の引数として渡します。

pageFunctionPromise を返す場合、frame.$$eval() はその Promise が解決されるのを待ってその値を返します。

使用法

const divsCounts = await frame.$$eval('div', (divs, min) => divs.length >= min, 10);

引数

戻り値


check

v1.9より前に追加 frame.check
推奨されません

代わりにロケーターベースの locator.check() を使用してください。ロケーターについて詳しくはこちら。

このメソッドは、以下の手順を実行して、セレクターに一致する要素をチェックします。

  1. セレクターに一致する要素を検索します。一致する要素がない場合、一致する要素が DOM にアタッチされるまで待機します。
  2. 一致する要素がチェックボックスまたはラジオ入力であることを確認します。そうでない場合、このメソッドはスローします。要素がすでにチェックされている場合、このメソッドはすぐに戻ります。
  3. force オプションが設定されていない限り、一致する要素の actionability チェックを待ちます。チェック中に要素がデタッチされた場合、全体のアクションが再試行されます。
  4. 必要に応じて要素を表示するためにスクロールします。
  5. page.mouse を使用して、要素の中央をクリックします。
  6. 要素が現在チェックされていることを確認します。そうでない場合、このメソッドはスローします。

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

使用法

await frame.check(selector);
await frame.check(selector, options);

引数

  • selector string#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • force boolean (オプション)#

      actionability チェックをバイパスするかどうか。デフォルトは false です。

    • noWaitAfter boolean (オプション)#

      非推奨

      このオプションは効果がありません。

      このオプションは効果がありません。

    • position Object (オプション)追加されたバージョン: v1.11#

      要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout number (オプション)#

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

    • trial boolean (オプション)追加されたバージョン: v1.11#

      設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは false です。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。

戻り値


click

v1.9より前に追加 frame.click
推奨されません

代わりにロケーターベースの locator.click() を使用してください。ロケーターについて詳しくはこちら。

このメソッドは、以下の手順を実行して、セレクターに一致する要素をクリックします。

  1. セレクターに一致する要素を検索します。一致する要素がない場合、一致する要素が DOM にアタッチされるまで待機します。
  2. force オプションが設定されていない限り、一致する要素の actionability チェックを待ちます。チェック中に要素がデタッチされた場合、全体のアクションが再試行されます。
  3. 必要に応じて要素を表示するためにスクロールします。
  4. page.mouse を使用して、要素の中央、または指定された 位置をクリックします。
  5. noWaitAfter オプションが設定されていない限り、開始されたナビゲーションが成功するか失敗するまで待ちます。

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

使用法

await frame.click(selector);
await frame.click(selector, options);

引数

  • selector string#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • button "left" | "right" | "middle" (オプション)#

      デフォルトは left です。

    • clickCount number (オプション)#

      デフォルトは 1 です。UIEvent.detail を参照してください。

    • delay number (オプション)#

      mousedownmouseup の間の待機時間 (ミリ秒単位)。デフォルトは 0 です。

    • force boolean (オプション)#

      actionability チェックをバイパスするかどうか。デフォルトは false です。

    • modifiers Array<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (オプション)#

      押す修飾キー。操作中にこれらの修飾キーのみが押されていることを保証し、現在の修飾キーを元に戻します。指定しない場合、現在押されている修飾キーが使用されます。"ControlOrMeta" は、Windows と Linux では "Control" に、macOS では "Meta" に解決されます。

    • noWaitAfter boolean (オプション)#

      非推奨

      このオプションは将来 true になります。

      ナビゲーションを開始するアクションは、これらのナビゲーションが発生し、ページがロードを開始するのを待機します。このフラグを設定することで、待機をオプトアウトできます。これは、アクセスできないページにナビゲートするなどの例外的な場合にのみ必要です。デフォルトは false です。

    • position Object (オプション)#

      要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout number (オプション)#

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

    • trial boolean (オプション)追加されたバージョン: v1.11#

      設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは false です。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。キーボードの modifiers は、それらのキーが押されたときにのみ表示される要素をテストできるように、trial にかかわらず押されることに注意してください。

戻り値


dblclick

v1.9より前に追加 frame.dblclick
推奨されません

代わりにロケーターベースの locator.dblclick() を使用してください。ロケーターについて詳しくはこちら。

このメソッドは、以下の手順を実行して、セレクターに一致する要素をダブルクリックします。

  1. セレクターに一致する要素を検索します。一致する要素がない場合、一致する要素が DOM にアタッチされるまで待機します。
  2. force オプションが設定されていない限り、一致する要素の actionability チェックを待ちます。チェック中に要素がデタッチされた場合、全体のアクションが再試行されます。
  3. 必要に応じて要素を表示するためにスクロールします。
  4. page.mouse を使用して、要素の中央、または指定された 位置をダブルクリックします。dblclick() の最初のクリックがナビゲーションイベントをトリガーした場合、このメソッドはスローします。

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

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

使用法

await frame.dblclick(selector);
await frame.dblclick(selector, options);

引数

  • selector string#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • button "left" | "right" | "middle" (オプション)#

      デフォルトは left です。

    • delay number (オプション)#

      mousedownmouseup の間の待機時間 (ミリ秒単位)。デフォルトは 0 です。

    • force boolean (オプション)#

      actionability チェックをバイパスするかどうか。デフォルトは false です。

    • modifiers Array<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (オプション)#

      押す修飾キー。操作中にこれらの修飾キーのみが押されていることを保証し、現在の修飾キーを元に戻します。指定しない場合、現在押されている修飾キーが使用されます。"ControlOrMeta" は、Windows と Linux では "Control" に、macOS では "Meta" に解決されます。

    • noWaitAfter boolean (オプション)#

      非推奨

      このオプションは効果がありません。

      このオプションは効果がありません。

    • position Object (オプション)#

      要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout number (オプション)#

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

    • trial boolean (オプション)追加されたバージョン: v1.11#

      設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは false です。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。キーボードの modifiers は、それらのキーが押されたときにのみ表示される要素をテストできるように、trial にかかわらず押されることに注意してください。

戻り値


dispatchEvent

v1.9より前に追加 frame.dispatchEvent
推奨されません

代わりにロケーターベースの locator.dispatchEvent() を使用してください。ロケーターについて詳しくはこちら。

以下のスニペットは、要素に対して click イベントをディスパッチします。要素の表示状態にかかわらず、click がディスパッチされます。これは element.click() を呼び出すことと同等です。

使用法

await frame.dispatchEvent('button#submit', 'click');

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

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

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

// Note you can only create DataTransfer in Chromium and Firefox
const dataTransfer = await frame.evaluateHandle(() => new DataTransfer());
await frame.dispatchEvent('#source', 'dragstart', { dataTransfer });

引数

  • selector string#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • type string#

    DOM イベントタイプ: "click""dragstart" など。

  • eventInit EvaluationArgument (オプション)#

    オプションのイベント固有の初期化プロパティ。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout number (オプション)#

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

戻り値


fill

v1.9より前に追加 frame.fill
推奨されません

代わりにロケーターベースの locator.fill() を使用してください。ロケーターについて詳しくはこちら。

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

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

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

使用法

await frame.fill(selector, value);
await frame.fill(selector, value, options);

引数

  • selector string#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • value string#

    <input><textarea> または [contenteditable] 要素に入力する値。

  • options Object (optional)

    • force boolean (オプション)追加バージョン: v1.13#

      actionability チェックをバイパスするかどうか。デフォルトは false です。

    • noWaitAfter boolean (オプション)#

      非推奨

      このオプションは効果がありません。

      このオプションは効果がありません。

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout number (オプション)#

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

戻り値


focus

v1.9より前に追加 frame.focus
推奨されません

代わりにロケーターベースの locator.focus() を使用してください。ロケーターについて詳しくはこちら。

このメソッドは、セレクターに一致する要素を取得し、それにフォーカスします。セレクターに一致する要素がない場合、このメソッドは一致する要素が DOM に表示されるまで待機します。

使用法

await frame.focus(selector);
await frame.focus(selector, options);

引数

  • selector string#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout number (オプション)#

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

戻り値


getAttribute

v1.9より前に追加 frame.getAttribute
推奨されません

代わりにロケーターベースの locator.getAttribute() を使用してください。ロケーターについて詳しくはこちら。

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

使用法

await frame.getAttribute(selector, name);
await frame.getAttribute(selector, name, options);

引数

  • selector string#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • name string#

    値を取得する属性名。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout number (オプション)#

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

戻り値


hover

v1.9より前に追加 frame.hover
推奨されません

代わりにロケーターベースの locator.hover() を使用してください。ロケーターについて詳しくはこちら。

このメソッドは、以下の手順を実行して、セレクターに一致する要素にカーソルを合わせます。

  1. セレクターに一致する要素を検索します。一致する要素がない場合、一致する要素が DOM にアタッチされるまで待機します。
  2. force オプションが設定されていない限り、一致する要素の actionability チェックを待ちます。チェック中に要素がデタッチされた場合、全体のアクションが再試行されます。
  3. 必要に応じて要素を表示するためにスクロールします。
  4. page.mouse を使用して、要素の中央、または指定された 位置にカーソルを合わせます。

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

使用法

await frame.hover(selector);
await frame.hover(selector, options);

引数

  • selector string#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • force boolean (オプション)#

      actionability チェックをバイパスするかどうか。デフォルトは false です。

    • modifiers Array<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (オプション)#

      押す修飾キー。操作中にこれらの修飾キーのみが押されていることを保証し、現在の修飾キーを元に戻します。指定しない場合、現在押されている修飾キーが使用されます。"ControlOrMeta" は、Windows と Linux では "Control" に、macOS では "Meta" に解決されます。

    • noWaitAfter boolean (オプション)追加バージョン: v1.28#

      非推奨

      このオプションは効果がありません。

      このオプションは効果がありません。

    • position Object (オプション)#

      要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout number (オプション)#

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

    • trial boolean (オプション)追加されたバージョン: v1.11#

      設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは false です。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。キーボードの modifiers は、それらのキーが押されたときにのみ表示される要素をテストできるように、trial にかかわらず押されることに注意してください。

戻り値


innerHTML

v1.9より前に追加 frame.innerHTML
推奨されません

代わりにロケーターベースの locator.innerHTML() を使用してください。ロケーターについて詳しくはこちら。

element.innerHTML を返します。

使用法

await frame.innerHTML(selector);
await frame.innerHTML(selector, options);

引数

  • selector string#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

戻り値


innerText

v1.9より前に追加 frame.innerText
推奨されません

代わりにロケーターベースの locator.innerText() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

element.innerText を返します。

使用法

await frame.innerText(selector);
await frame.innerText(selector, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

戻り値


inputValue

追加バージョン: v1.13 frame.inputValue
推奨されません

代わりにロケーターベースの locator.inputValue() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

選択した <input><textarea>、または <select> 要素の input.value を返します。

非入力要素の場合はスローされます。ただし、要素が関連する コントロールを持つ <label> 要素内にある場合は、コントロールの値を返します。

使用法

await frame.inputValue(selector);
await frame.inputValue(selector, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

戻り値


isChecked

v1.9より前に追加 frame.isChecked
推奨されません

代わりにロケーターベースの locator.isChecked() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

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

使用法

await frame.isChecked(selector);
await frame.isChecked(selector, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

戻り値


isDisabled

v1.9より前に追加 frame.isDisabled
推奨されません

代わりにロケーターベースの locator.isDisabled() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

要素が無効であるかどうか、つまり 有効の反対を返します。

使用法

await frame.isDisabled(selector);
await frame.isDisabled(selector, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

戻り値


isEditable

v1.9より前に追加 frame.isEditable
推奨されません

代わりにロケーターベースの locator.isEditable() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

要素が 編集可能かどうかを返します。

使用法

await frame.isEditable(selector);
await frame.isEditable(selector, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

戻り値


isHidden

v1.9より前に追加 frame.isHidden
推奨されません

代わりにロケーターベースの locator.isHidden() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

要素が非表示であるかどうか、つまり 表示可能の反対を返します。要素に一致しない セレクターは非表示とみなされます。

使用法

await frame.isHidden(selector);
await frame.isHidden(selector, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

      非推奨

      このオプションは無視されます。frame.isHidden() は要素が非表示になるのを待たずに即座に返します。

戻り値


isVisible

v1.9より前に追加 frame.isVisible
推奨されません

代わりにロケーターベースの locator.isVisible() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

要素が 表示可能かどうかを返します。要素に一致しない セレクターは表示可能ではないとみなされます。

使用法

await frame.isVisible(selector);
await frame.isVisible(selector, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

      非推奨

      このオプションは無視されます。frame.isVisible() は要素が表示可能になるのを待たずに即座に返します。

戻り値


press

v1.9より前に追加 frame.press
推奨されません

代わりにロケーターベースの locator.press() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

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, ControlOrMetaControlOrMetaはWindowsおよびLinuxではControlに、macOSではMetaに解決されます。

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

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

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

使用法

await frame.press(selector, key);
await frame.press(selector, key, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • key 文字列#

    押すキーの名前、または ArrowLefta などの生成する文字。

  • options Object (optional)

    • delay 数値 (オプション)#

      keydownkeyup の間の待機時間 (ミリ秒)。デフォルトは 0 です。

    • noWaitAfter 真偽値 (オプション)#

      非推奨

      このオプションは将来 true になります。

      ナビゲーションを開始するアクションは、これらのナビゲーションが発生し、ページがロードを開始するのを待機します。このフラグを設定することで、待機をオプトアウトできます。これは、アクセスできないページにナビゲートするなどの例外的な場合にのみ必要です。デフォルトは false です。

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

戻り値


selectOption

v1.9より前に追加 frame.selectOption
推奨されません

代わりにロケーターベースの locator.selectOption() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

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

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

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

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

使用法

// Single selection matching the value or label
frame.selectOption('select#colors', 'blue');

// single selection matching both the value and the label
frame.selectOption('select#colors', { label: 'Blue' });

// multiple selection
frame.selectOption('select#colors', 'red', 'green', 'blue');

引数

  • selector 文字列#

    クエリするセレクター。

  • values null | 文字列 | ElementHandle | 配列<文字列> | オブジェクト | 配列<ElementHandle> | 配列<オブジェクト>#

    • value 文字列 (オプション)

      option.value で一致します。任意。

    • label 文字列 (オプション)

      option.label で一致します。任意。

    • index 数値 (オプション)

      インデックスで一致します。任意。

    選択するオプション。 <select>multiple 属性がある場合、一致するすべてのオプションが選択され、そうでない場合は、渡されたオプションのいずれかに一致する最初のオプションのみが選択されます。文字列値は値とラベルの両方に一致します。すべての指定されたプロパティが一致する場合、オプションは一致すると見なされます。

  • options Object (optional)

    • force boolean (オプション)追加バージョン: v1.13#

      actionability チェックをバイパスするかどうか。デフォルトは false です。

    • noWaitAfter 真偽値 (オプション)#

      非推奨

      このオプションは効果がありません。

      このオプションは効果がありません。

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

戻り値


setChecked

追加されたバージョン: v1.15 frame.setChecked
推奨されません

代わりにロケーターベースの locator.setChecked() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

このメソッドは、セレクターに一致する要素に対して以下の手順を実行して、チェックまたはチェック解除します。

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

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

使用法

await frame.setChecked(selector, checked);
await frame.setChecked(selector, checked, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • checked 真偽値#

    チェックボックスをチェックするか、チェックを外すか。

  • options Object (optional)

    • force 真偽値 (オプション)#

      actionability チェックをバイパスするかどうか。デフォルトは false です。

    • noWaitAfter 真偽値 (オプション)#

      非推奨

      このオプションは効果がありません。

      このオプションは効果がありません。

    • position オブジェクト (オプション)#

      要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。

    • strict 真偽値 (オプション)#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

    • trial 真偽値 (オプション)#

      設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは false です。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。

戻り値


setInputFiles

v1.9より前に追加 frame.setInputFiles
推奨されません

代わりにロケーターベースの locator.setInputFiles() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

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

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

使用法

await frame.setInputFiles(selector, files);
await frame.setInputFiles(selector, files, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • files 文字列 | 配列<文字列> | オブジェクト | 配列<オブジェクト>#

    • name string

      ファイル名

    • mimeType string

      ファイルタイプ

    • buffer Buffer

      ファイル内容

  • options Object (optional)

    • noWaitAfter 真偽値 (オプション)#

      非推奨

      このオプションは効果がありません。

      このオプションは効果がありません。

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

戻り値


tap

v1.9より前に追加 frame.tap
推奨されません

代わりにロケーターベースの locator.tap() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

このメソッドは、セレクターに一致する要素に対して以下の手順を実行してタップします。

  1. セレクターに一致する要素を見つけます。一致する要素がない場合は、一致する要素が DOM にアタッチされるまで待ちます。
  2. force オプションが設定されていない限り、一致する要素に対してアクション可能性のチェックを待ちます。チェック中に要素がデタッチされた場合、すべてのアクションが再試行されます。
  3. 必要に応じて要素を表示するためにスクロールします。
  4. 要素の中央または指定された 位置をタップするには、page.touchscreen を使用します。

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

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

使用法

await frame.tap(selector);
await frame.tap(selector, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • force 真偽値 (オプション)#

      actionability チェックをバイパスするかどうか。デフォルトは false です。

    • modifiers 配列<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (オプション)#

      押す修飾キー。操作中にこれらの修飾キーのみが押されていることを保証し、現在の修飾キーを元に戻します。指定しない場合、現在押されている修飾キーが使用されます。"ControlOrMeta" は、Windows と Linux では "Control" に、macOS では "Meta" に解決されます。

    • noWaitAfter 真偽値 (オプション)#

      非推奨

      このオプションは効果がありません。

      このオプションは効果がありません。

    • position オブジェクト (オプション)#

      要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

    • trial boolean (オプション)追加されたバージョン: v1.11#

      設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは false です。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。キーボードの modifiers は、それらのキーが押されたときにのみ表示される要素をテストできるように、trial にかかわらず押されることに注意してください。

戻り値


textContent

v1.9より前に追加 frame.textContent
推奨されません

代わりにロケーターベースの locator.textContent() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

element.textContent を返します。

使用法

await frame.textContent(selector);
await frame.textContent(selector, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

戻り値


type

v1.9より前に追加 frame.type
非推奨

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

テキスト内の各文字に対して keydownkeypress/input、および keyup イベントを送信します。frame.type は、細かなキーボードイベントを送信するために使用できます。フォームフィールドに値を入力するには、frame.fill() を使用します。

ControlArrowDown などの特殊キーを押すには、keyboard.press() を使用します。

使用法

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • text 文字列#

    フォーカスされた要素に入力するテキスト。

  • options Object (optional)

    • delay 数値 (オプション)#

      キー押下間の待機時間(ミリ秒)。デフォルトは0です。

    • noWaitAfter 真偽値 (オプション)#

      非推奨

      このオプションは効果がありません。

      このオプションは効果がありません。

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

戻り値


uncheck

v1.9より前に追加 frame.uncheck
推奨されません

代わりにロケーターベースの locator.uncheck() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

このメソッドは、セレクターに一致する要素に対して以下の手順を実行して、チェック解除します。

  1. セレクターに一致する要素を見つけます。一致する要素がない場合は、一致する要素が DOM にアタッチされるまで待ちます。
  2. 一致する要素がチェックボックスまたはラジオ入力であることを確認します。そうでない場合、このメソッドはスローされます。要素がすでにチェック解除されている場合、このメソッドは即座に返します。
  3. force オプションが設定されていない限り、一致する要素に対してアクション可能性のチェックを待ちます。チェック中に要素がデタッチされた場合、すべてのアクションが再試行されます。
  4. 必要に応じて要素を表示するためにスクロールします。
  5. page.mouse を使用して、要素の中央をクリックします。
  6. 要素がチェックされていないことを確認します。そうでない場合、このメソッドはエラーをスローします。

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

使用法

await frame.uncheck(selector);
await frame.uncheck(selector, options);

引数

  • selector 文字列#

    要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。

  • options Object (optional)

    • force 真偽値 (オプション)#

      actionability チェックをバイパスするかどうか。デフォルトは false です。

    • noWaitAfter 真偽値 (オプション)#

      非推奨

      このオプションは効果がありません。

      このオプションは効果がありません。

    • position Object (オプション)追加されたバージョン: v1.11#

      要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。

    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

    • trial boolean (オプション)追加されたバージョン: v1.11#

      設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは false です。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。

戻り値


waitForNavigation

v1.9より前に追加 frame.waitForNavigation
非推奨

このメソッドは本質的に競合が発生しやすいです。代わりに frame.waitForURL() を使用してください。

フレームのナビゲーションを待ち、メインリソースのレスポンスを返します。複数のリダイレクトがある場合、ナビゲーションは最後のリダイレクトのレスポンスで解決されます。異なるアンカーへのナビゲーション、または History API の使用によるナビゲーションの場合、ナビゲーションは null で解決されます。

使用法

このメソッドは、フレームが新しい URL にナビゲートするのを待ちます。フレームを間接的にナビゲートさせるコードを実行する場合に便利です。この例を検討してください。

// Start waiting for navigation before clicking. Note no await.
const navigationPromise = page.waitForNavigation();
await page.getByText('Navigate after timeout').click();
await navigationPromise;

URL を変更するために History API を使用することは、ナビゲーションと見なされます。

引数

  • options Object (optional)
    • timeout 数値 (オプション)#

      ミリ秒単位の最大操作時間。デフォルトは 0 (タイムアウトなし) です。デフォルト値は、設定の navigationTimeout オプション、または browserContext.setDefaultNavigationTimeout()browserContext.setDefaultTimeout()page.setDefaultNavigationTimeout()page.setDefaultTimeout() メソッドを使用して変更できます。

    • url 文字列 | 正規表現 | 関数(URL):真偽値 (オプション)#

      ナビゲーションを待っている間に一致するグロブパターン、正規表現パターン、または URL を受け取る述語。パラメーターがワイルドカード文字のない文字列の場合、メソッドは文字列と完全に一致する URL へのナビゲーションを待機することに注意してください。

    • waitUntil "load" | "domcontentloaded" | "networkidle" | "commit" (オプション)#

      操作が成功したと見なすタイミング。デフォルトは load です。イベントは次のいずれかです。

      • 'domcontentloaded' - DOMContentLoaded イベントが発火したときに操作が終了したと見なします。
      • 'load' - load イベントが発火したときに操作が終了したと見なします。
      • 'networkidle' - 推奨されません 少なくとも 500 ミリ秒間ネットワーク接続がないときに操作が終了したと見なします。テストにはこのメソッドを使用せず、代わりにウェブアサーションに頼って準備状況を評価してください。
      • 'commit' - ネットワーク応答が受信され、ドキュメントの読み込みが開始されたときに操作が終了したと見なします。

戻り値


waitForSelector

v1.9より前に追加 frame.waitForSelector
推奨されません

代わりに可視性をアサートするウェブアサーション、またはロケーターベースの locator.waitFor() を使用してください。ロケーターについて詳しくはこちらをご覧ください。

セレクターで指定された要素が state オプションを満たしたときに返ります。hidden または detached を待っている場合は null を返します。

Playwright はアクションを実行する前に、要素が準備されるのを自動的に待ちます。ロケーターオブジェクトとウェブファーストアサーションを使用すると、コードが wait-for-selector 不要になります。

セレクターstate オプション(DOM に表示/非表示になる、または可視/非可視になる)を満たすのを待ちます。メソッド呼び出し時に セレクターがすでに条件を満たしている場合、メソッドは即座に返ります。セレクターが タイムアウト ミリ秒間条件を満たさない場合、関数はスローします。

使用法

このメソッドはナビゲーションをまたいで動作します

const { chromium } = require('playwright');  // Or 'firefox' or 'webkit'.

(async () => {
const browser = await chromium.launch();
const page = await browser.newPage();
for (const currentURL of ['https://google.com', 'https://bbc.com']) {
await page.goto(currentURL);
const element = await page.mainFrame().waitForSelector('img');
console.log('Loaded image: ' + await element.getAttribute('src'));
}
await browser.close();
})();

引数

  • selector 文字列#

    クエリするセレクター。

  • options Object (optional)

    • state "attached" | "detached" | "visible" | "hidden" (オプション)#

      デフォルトは'visible'です。以下のいずれかになります。

      • 'attached' - 要素がDOMに存在することを待ちます。
      • 'detached' - 要素がDOMに存在しないことを待ちます。
      • 'visible' - 要素が空でない境界ボックスを持ち、visibility:hiddenがないことを待ちます。コンテンツがない要素やdisplay:noneの要素は空の境界ボックスを持つため、可視とはみなされないことに注意してください。
      • 'hidden' - 要素がDOMからデタッチされているか、空の境界ボックスを持つか、またはvisibility:hiddenを持つことを待ちます。これは'visible'オプションとは逆です。
    • strict boolean (オプション)追加されたバージョン: v1.14#

      true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。

    • timeout 数値 (オプション)#

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

戻り値


waitForTimeout

v1.9より前に追加 frame.waitForTimeout
推奨されません

本番環境でタイムアウトを待つことは絶対に避けてください。時間を待つテストは本質的に不安定です。自動的に待機する ロケーターアクションとウェブアサーションを使用してください。

指定された タイムアウト(ミリ秒)だけ待機します。

frame.waitForTimeout() はデバッグ目的でのみ使用すべきであることに注意してください。本番環境でタイマーを使用するテストは不安定になるでしょう。代わりに、ネットワークイベント、セレクターの可視化などのシグナルを使用してください。

使用法

await frame.waitForTimeout(timeout);

引数

  • timeout 数値#

    待機するタイムアウト

戻り値