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より前に追加スクリプトの onload が発火したとき、またはスクリプトの内容がフレームに注入されたときに追加されたタグを返します。
指定された URL またはコンテンツを持つ <script> タグをページに追加します。
使用法
await frame.addScriptTag();
await frame.addScriptTag(options);
引数
optionsObject (optional)
戻り値
addStyleTag
v1.9より前に追加スタイルシートの onload が発火したとき、または CSS コンテンツがフレームに注入されたときに追加されたタグを返します。
目的の URL を持つ <link rel="stylesheet"> タグ、またはコンテンツを持つ <style type="text/css"> タグをページに追加します。
使用法
await frame.addStyleTag();
await frame.addStyleTag(options);
引数
optionsObject (optional)
戻り値
childFrames
v1.9より前に追加使用法
frame.childFrames();
戻り値
content
v1.9より前に追加doctype を含む、フレームの完全な HTML コンテンツを取得します。
使用法
await frame.content();
戻り値
dragAndDrop
追加バージョン: v1.13使用法
await frame.dragAndDrop(source, target);
await frame.dragAndDrop(source, target, options);
引数
-
ドラッグする要素を検索するためのセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
ドロップする要素を検索するためのセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
actionability チェックをバイパスするかどうか。デフォルトは
falseです。 -
非推奨
このオプションは効果がありません。
このオプションは効果がありません。
-
sourcePositionObject (オプション)追加されたバージョン: v1.14#要素のパディングボックスの左上隅を基準としたこの点でソース要素をクリックします。指定しない場合、要素のいくつかの可視点が使用されます。
-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
targetPositionObject (オプション)追加されたバージョン: v1.14#要素のパディングボックスの左上隅を基準としたこの点でターゲット要素にドロップします。指定しない場合、要素のいくつかの可視点が使用されます。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。 -
設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは
falseです。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。
-
戻り値
evaluate
v1.9より前に追加pageFunction の戻り値を返します。
frame.evaluate() に渡された関数が Promise を返す場合、frame.evaluate() はその Promise が解決されるのを待ってその値を返します。
frame.evaluate() に渡された関数が Serializable ではない値を返す場合、frame.evaluate() は undefined を返します。Playwright は、JSON によってシリアル化できない一部の追加の値も転送することをサポートしています: -0、NaN、Infinity、-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();
引数
-
pageFunctionfunction | string#ページコンテキストで評価される関数。
-
argEvaluationArgument (オプション)#pageFunction に渡すオプションの引数。
戻り値
evaluateHandle
v1.9より前に追加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();
引数
-
pageFunctionfunction | string#ページコンテキストで評価される関数。
-
argEvaluationArgument (オプション)#pageFunction に渡すオプションの引数。
戻り値
frameElement
v1.9より前に追加このフレームに対応する frame または iframe 要素ハンドルを返します。
これは elementHandle.contentFrame() の逆です。返されるハンドルは実際には親フレームに属することに注意してください。
このメソッドは、frameElement() が返される前にフレームがデタッチされた場合、エラーをスローします。
使用法
const frameElement = await frame.frameElement();
const contentFrame = await frameElement.contentFrame();
console.log(frame === contentFrame); // -> true
戻り値
frameLocator
追加バージョン: v1.17iframeを操作する場合、iframeに入り、そのiframe内の要素を選択できるフレームロケーターを作成できます。
使用法
次のスニペットは、<iframe id="my-frame"> のように、id が my-frame の iframe 内のテキスト "Submit" を持つ要素を特定します。
const locator = frame.frameLocator('#my-iframe').getByText('Submit');
await locator.click();
引数
戻り値
getByAltText
追加バージョン: v1.27要素をそのaltテキストで特定できます。
使用法
例えば、このメソッドはaltテキスト「Playwright logo」で画像を見つけます。
<img alt='Playwright logo'>
await page.getByAltText('Playwright logo').click();
引数
-
要素を特定するためのテキスト。
-
optionsObject (optional)
戻り値
getByLabel
追加バージョン: v1.27関連する<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');
引数
-
要素を特定するためのテキスト。
-
optionsObject (optional)
戻り値
getByPlaceholder
追加バージョン: v1.27プレースホルダーテキストによって入力要素を特定できます。
使用法
例えば、以下のDOM構造を考えてみましょう。
<input type="email" placeholder="name@example.com" />
プレースホルダーテキストで入力を見つけてから、入力できます。
await page
.getByPlaceholder('name@example.com')
.fill('playwright@microsoft.com');
引数
-
要素を特定するためのテキスト。
-
optionsObject (optional)
戻り値
getByRole
追加バージョン: v1.27要素をその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ロール。
-
optionsObject (optional)-
通常、
aria-checkedまたはネイティブの<input type=checkbox>コントロールによって設定される属性。aria-checkedの詳細。 -
通常、
aria-disabledまたはdisabledによって設定される属性。注他のほとんどの属性とは異なり、
disabledはDOM階層を介して継承されます。aria-disabledの詳細。 -
exactboolean (オプション)追加バージョン: v1.28#name が完全に一致するかどうか: 大文字と小文字を区別し、完全な文字列。デフォルトは false です。name が正規表現の場合は無視されます。厳密な一致でも空白はトリムされることに注意してください。
-
通常、
aria-expandedによって設定される属性。aria-expandedの詳細。 -
includeHiddenboolean (オプション)#非表示要素が一致するかどうかを制御するオプション。デフォルトでは、ARIAで定義されているように、非表示でない要素のみがロールセレクターによって一致します。
aria-hiddenの詳細。 -
通常、
heading、listitem、row、treeitemのロールに存在する数値属性で、<h1>-<h6>要素のデフォルト値があります。aria-levelの詳細。 -
アクセシブルネームに一致するオプション。デフォルトでは、大文字と小文字を区別せず、部分文字列を検索します。exact を使用してこの動作を制御します。
アクセシブルネームの詳細。
-
通常、
aria-pressedによって設定される属性。aria-pressedの詳細。 -
通常、
aria-selectedによって設定される属性。aria-selectedの詳細。
-
戻り値
詳細
ロールセレクターは、アクセシビリティ監査や適合性テストを**置き換えるものではなく**、ARIAガイドラインに関する早期のフィードバックを提供します。
多くのHTML要素には、ロールセレクターによって認識される暗黙的に定義されたロールがあります。サポートされているすべてのロールはこちらで確認できます。ARIAガイドラインは、roleおよび/またはaria-*属性をデフォルト値に設定して暗黙的なロールと属性を重複させることを**推奨しません**。
getByTestId
追加バージョン: v1.27テスト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指定されたテキストを含む要素を特定できます。
アクセシブルロールなどの他の基準で一致させ、その後テキストコンテンツでフィルターできる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);
引数
-
要素を特定するためのテキスト。
-
optionsObject (optional)
戻り値
詳細
テキストによる一致は、厳密な一致であっても常に空白を正規化します。例えば、複数のスペースを1つにまとめ、改行をスペースに変換し、先頭と末尾の空白を無視します。
buttonおよびsubmit型の入力要素は、テキストコンテンツの代わりにそのvalueによって一致します。例えば、テキスト"Log in"で特定すると、<input type=button value="Log in">が一致します。
getByTitle
追加バージョン: v1.27要素をそのタイトル属性で特定できます。
使用法
以下のDOM構造を考えてみましょう。
<span title='Issues count'>25 issues</span>
タイトルテキストで問題数を特定した後、確認できます。
await expect(page.getByTitle('Issues count')).toHaveText('25 issues');
引数
-
要素を特定するためのテキスト。
-
optionsObject (optional)
戻り値
goto
v1.9より前に追加メインリソースのレスポンスを返します。複数のリダイレクトの場合、ナビゲーションは最後のリダイレクトのレスポンスで解決されます。
このメソッドは、以下の場合にエラーをスローします。
- 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。URL にはスキーム (例:
https://) を含める必要があります。 -
optionsObject (optional)-
リファラーヘッダーの値。指定された場合、page.setExtraHTTPHeaders() によって設定されたリファラーヘッダーの値よりも優先されます。
-
ミリ秒単位の最大操作時間。デフォルトは
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より前に追加フレームがデタッチされている場合は true を、それ以外の場合は false を返します。
使用法
frame.isDetached();
戻り値
isEnabled
v1.9より前に追加要素が enabled かどうかを返します。
使用法
await frame.isEnabled(selector);
await frame.isEnabled(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
locator
追加されたバージョン: v1.14このメソッドは、このページ/フレームでアクションを実行するために使用できる要素ロケーターを返します。ロケーターは、アクションを実行する直前に要素に解決されるため、同じロケーターに対する一連のアクションは、実際には異なる DOM 要素に対して実行される可能性があります。これは、それらのアクション間の DOM 構造が変更された場合に発生します。
使用法
frame.locator(selector);
frame.locator(selector, options);
引数
-
DOM要素を解決するときに使用するセレクター。
-
optionsObject (optional)-
この相対ロケーターに一致する要素を含む結果にメソッドの結果を絞り込みます。例えば、
text=Playwrightを持つarticleは<article><div>Playwright</div></article>に一致します。内部ロケーターは**外部ロケーターに対して相対的**でなければならず、ドキュメントルートではなく外部ロケーターの一致からクエリが開始されます。例えば、
<article><content><div>Playwright</div></content></article>でdivを持つcontentを見つけることができます。しかし、article divを持つcontentを探すと、内部ロケーターは相対的でなければならず、contentの外部の要素を使用すべきではないため、失敗します。外部ロケーターと内部ロケーターは同じフレームに属している必要があります。内部ロケーターにはFrameLocatorを含めることはできません。
-
hasNotLocator (オプション)追加バージョン: v1.33#内部ロケーターに一致する要素を含まない要素に一致します。内部ロケーターは外部ロケーターに対してクエリされます。例えば、
divを持たないarticleは<article><span>Playwright</span></article>に一致します。外部ロケーターと内部ロケーターは同じフレームに属している必要があります。内部ロケーターにはFrameLocatorを含めることはできません。
-
hasNotTextstring | RegExp (オプション)追加バージョン: v1.33#指定されたテキストを内部のどこか(子または子孫要素内も含む)に含まない要素に一致します。stringが渡された場合、大文字小文字を区別せず、部分文字列を検索します。
-
hasTextstring | RegExp (オプション)#指定されたテキストを内部のどこか(子または子孫要素内も含む)に含む要素に一致します。stringが渡された場合、大文字小文字を区別せず、部分文字列を検索します。例えば、
"Playwright"は<article><div>Playwright</div></article>に一致します。
-
戻り値
name
v1.9より前に追加タグで指定されたフレームの name 属性を返します。
名前が空の場合、代わりに id 属性を返します。
この値は、フレームが作成されたときに一度計算され、後で属性が変更されても更新されません。
使用法
frame.name();
戻り値
page
v1.9より前に追加このフレームを含むページを返します。
使用法
frame.page();
戻り値
parentFrame
v1.9より前に追加親フレームがある場合、親フレームを返します。デタッチされたフレームとメインフレームは null を返します。
使用法
frame.parentFrame();
戻り値
setContent
v1.9より前に追加このメソッドは内部的に document.write() を呼び出し、そのすべての特定の特性と動作を継承します。
使用法
await frame.setContent(html);
await frame.setContent(html, options);
引数
-
ページに割り当てる HTML マークアップ。
-
optionsObject (optional)-
ミリ秒単位の最大操作時間。デフォルトは
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より前に追加ページのタイトルを返します。
使用法
await frame.title();
戻り値
url
v1.9より前に追加フレームの URL を返します。
使用法
frame.url();
戻り値
waitForFunction
v1.9より前に追加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);
引数
-
pageFunctionfunction | string#ページコンテキストで評価される関数。
-
argEvaluationArgument (オプション)#pageFunction に渡すオプションの引数。
-
optionsObject (optional)-
pollingnumber | "raf" (オプション)#polling が
'raf'の場合、pageFunction はrequestAnimationFrameコールバックで継続的に実行されます。polling が数値の場合、関数が実行されるミリ秒単位の間隔として扱われます。デフォルトはrafです。 -
待機する最大時間 (ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、設定のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
waitForLoadState
v1.9より前に追加必要な読み込み状態に到達するまで待ちます。
このメソッドは、フレームがデフォルトで 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ミリ秒間ネットワーク接続がないまで待ちます。テストにはこのメソッドを使用せず、代わりにウェブアサーションに頼って準備状況を評価してください。
-
optionsObject (optional)-
ミリ秒単位の最大操作時間。デフォルトは
0(タイムアウトなし) です。デフォルト値は、設定のnavigationTimeoutオプション、または browserContext.setDefaultNavigationTimeout()、browserContext.setDefaultTimeout()、page.setDefaultNavigationTimeout()、page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
waitForURL
追加されたバージョン: v1.11フレームが指定された URL にナビゲートするまで待ちます。
使用法
await frame.click('a.delayed-navigation'); // Clicking the link will indirectly cause a navigation
await frame.waitForURL('**/target.html');
引数
-
urlstring | RegExp | function(URL):boolean#ナビゲーションを待っている間に一致するグロブパターン、正規表現パターン、または URL を受け取る述語。パラメーターがワイルドカード文字のない文字列の場合、メソッドは文字列と完全に一致する URL へのナビゲーションを待機することに注意してください。
-
optionsObject (optional)-
ミリ秒単位の最大操作時間。デフォルトは
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.locator() を使用してください。ロケーターについて詳しくはこちら。
フレーム要素を指す ElementHandle を返します。
ElementHandle の使用は推奨されません。Locator オブジェクトとweb-firstアサーションを使用してください。
このメソッドは、フレーム内で指定されたセレクターに一致する要素を検索します。セレクターに一致する要素がない場合、null を返します。
使用法
await frame.$(selector);
await frame.$(selector, options);
引数
-
クエリするセレクター。
-
optionsObject (optional)
戻り値
$$
追加バージョン: v1.9代わりにロケーターベースの frame.locator() を使用してください。ロケーターについて詳しくはこちら。
フレーム要素を指す ElementHandles を返します。
ElementHandle の使用は推奨されません。代わりに Locator オブジェクトを使用してください。
このメソッドは、フレーム内で指定されたセレクターに一致するすべての要素を検索します。セレクターに一致する要素がない場合、空の配列を返します。
使用法
await frame.$$(selector);
引数
戻り値
$eval
追加バージョン: v1.9このメソッドは要素が actionability チェックに合格するのを待たないため、不安定なテストにつながる可能性があります。代わりに locator.evaluate()、その他の Locator ヘルパーメソッド、またはウェブファーストアサーションを使用してください。
pageFunction の戻り値を返します。
このメソッドは、フレーム内で指定されたセレクターに一致する要素を検索し、それを pageFunction の最初の引数として渡します。セレクターに一致する要素がない場合、このメソッドはエラーをスローします。
pageFunction が Promise を返す場合、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');
引数
-
クエリするセレクター。
-
pageFunctionfunction(Element) | string#ページコンテキストで評価される関数。
-
argEvaluationArgument (オプション)#pageFunction に渡すオプションの引数。
-
optionsObject (optional)
戻り値
$$eval
追加バージョン: v1.9ほとんどの場合、locator.evaluateAll()、その他の Locator ヘルパーメソッド、およびウェブファーストアサーションの方が優れています。
pageFunction の戻り値を返します。
このメソッドは、フレーム内で指定されたセレクターに一致するすべての要素を検索し、一致する要素の配列を pageFunction の最初の引数として渡します。
pageFunction が Promise を返す場合、frame.$$eval() はその Promise が解決されるのを待ってその値を返します。
使用法
const divsCounts = await frame.$$eval('div', (divs, min) => divs.length >= min, 10);
引数
-
クエリするセレクター。
-
pageFunctionfunction(Array<Element>) | string#ページコンテキストで評価される関数。
-
argEvaluationArgument (オプション)#pageFunction に渡すオプションの引数。
戻り値
check
v1.9より前に追加代わりにロケーターベースの locator.check() を使用してください。ロケーターについて詳しくはこちら。
このメソッドは、以下の手順を実行して、セレクターに一致する要素をチェックします。
- セレクターに一致する要素を検索します。一致する要素がない場合、一致する要素が DOM にアタッチされるまで待機します。
- 一致する要素がチェックボックスまたはラジオ入力であることを確認します。そうでない場合、このメソッドはスローします。要素がすでにチェックされている場合、このメソッドはすぐに戻ります。
- force オプションが設定されていない限り、一致する要素の actionability チェックを待ちます。チェック中に要素がデタッチされた場合、全体のアクションが再試行されます。
- 必要に応じて要素を表示するためにスクロールします。
- page.mouse を使用して、要素の中央をクリックします。
- 要素が現在チェックされていることを確認します。そうでない場合、このメソッドはスローします。
指定された timeout 内にすべての手順が完了しない場合、このメソッドは TimeoutError をスローします。タイムアウトにゼロを渡すと、これを無効にします。
使用法
await frame.check(selector);
await frame.check(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
actionability チェックをバイパスするかどうか。デフォルトは
falseです。 -
非推奨
このオプションは効果がありません。
このオプションは効果がありません。
-
positionObject (オプション)追加されたバージョン: v1.11#要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。 -
trialboolean (オプション)追加されたバージョン: v1.11#設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは
falseです。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。
-
戻り値
click
v1.9より前に追加代わりにロケーターベースの locator.click() を使用してください。ロケーターについて詳しくはこちら。
このメソッドは、以下の手順を実行して、セレクターに一致する要素をクリックします。
- セレクターに一致する要素を検索します。一致する要素がない場合、一致する要素が DOM にアタッチされるまで待機します。
- force オプションが設定されていない限り、一致する要素の actionability チェックを待ちます。チェック中に要素がデタッチされた場合、全体のアクションが再試行されます。
- 必要に応じて要素を表示するためにスクロールします。
- page.mouse を使用して、要素の中央、または指定された 位置をクリックします。
- noWaitAfter オプションが設定されていない限り、開始されたナビゲーションが成功するか失敗するまで待ちます。
指定された timeout 内にすべての手順が完了しない場合、このメソッドは TimeoutError をスローします。タイムアウトにゼロを渡すと、これを無効にします。
使用法
await frame.click(selector);
await frame.click(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
button"left" | "right" | "middle" (オプション)#デフォルトは
leftです。 -
デフォルトは 1 です。UIEvent.detail を参照してください。
-
mousedownとmouseupの間の待機時間 (ミリ秒単位)。デフォルトは 0 です。 -
actionability チェックをバイパスするかどうか。デフォルトは
falseです。 -
modifiersArray<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (オプション)#押す修飾キー。操作中にこれらの修飾キーのみが押されていることを保証し、現在の修飾キーを元に戻します。指定しない場合、現在押されている修飾キーが使用されます。"ControlOrMeta" は、Windows と Linux では "Control" に、macOS では "Meta" に解決されます。
-
非推奨
このオプションは将来
trueになります。ナビゲーションを開始するアクションは、これらのナビゲーションが発生し、ページがロードを開始するのを待機します。このフラグを設定することで、待機をオプトアウトできます。これは、アクセスできないページにナビゲートするなどの例外的な場合にのみ必要です。デフォルトは
falseです。 -
要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。 -
trialboolean (オプション)追加されたバージョン: v1.11#設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは
falseです。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。キーボードのmodifiersは、それらのキーが押されたときにのみ表示される要素をテストできるように、trialにかかわらず押されることに注意してください。
-
戻り値
dblclick
v1.9より前に追加代わりにロケーターベースの locator.dblclick() を使用してください。ロケーターについて詳しくはこちら。
このメソッドは、以下の手順を実行して、セレクターに一致する要素をダブルクリックします。
- セレクターに一致する要素を検索します。一致する要素がない場合、一致する要素が DOM にアタッチされるまで待機します。
- force オプションが設定されていない限り、一致する要素の actionability チェックを待ちます。チェック中に要素がデタッチされた場合、全体のアクションが再試行されます。
- 必要に応じて要素を表示するためにスクロールします。
- page.mouse を使用して、要素の中央、または指定された 位置をダブルクリックします。
dblclick()の最初のクリックがナビゲーションイベントをトリガーした場合、このメソッドはスローします。
指定された timeout 内にすべての手順が完了しない場合、このメソッドは TimeoutError をスローします。タイムアウトにゼロを渡すと、これを無効にします。
frame.dblclick() は2つの click イベントと1つの dblclick イベントをディスパッチします。
使用法
await frame.dblclick(selector);
await frame.dblclick(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
button"left" | "right" | "middle" (オプション)#デフォルトは
leftです。 -
mousedownとmouseupの間の待機時間 (ミリ秒単位)。デフォルトは 0 です。 -
actionability チェックをバイパスするかどうか。デフォルトは
falseです。 -
modifiersArray<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (オプション)#押す修飾キー。操作中にこれらの修飾キーのみが押されていることを保証し、現在の修飾キーを元に戻します。指定しない場合、現在押されている修飾キーが使用されます。"ControlOrMeta" は、Windows と Linux では "Control" に、macOS では "Meta" に解決されます。
-
非推奨
このオプションは効果がありません。
このオプションは効果がありません。
-
要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。 -
trialboolean (オプション)追加されたバージョン: v1.11#設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは
falseです。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。キーボードのmodifiersは、それらのキーが押されたときにのみ表示される要素をテストできるように、trialにかかわらず押されることに注意してください。
-
戻り値
dispatchEvent
v1.9より前に追加代わりにロケーターベースの locator.dispatchEvent() を使用してください。ロケーターについて詳しくはこちら。
以下のスニペットは、要素に対して click イベントをディスパッチします。要素の表示状態にかかわらず、click がディスパッチされます。これは element.click() を呼び出すことと同等です。
使用法
await frame.dispatchEvent('button#submit', 'click');
内部的には、指定された type に基づいてイベントのインスタンスを作成し、eventInit プロパティで初期化し、要素に対してディスパッチします。イベントはデフォルトで composed、cancelable、バブルします。
eventInit はイベント固有であるため、初期プロパティのリストについてはイベントのドキュメントを参照してください。
- DeviceMotionEvent
- DeviceOrientationEvent
- DragEvent
- Event
- FocusEvent
- KeyboardEvent
- MouseEvent
- PointerEvent
- TouchEvent
- WheelEvent
ライブオブジェクトをイベントに渡したい場合は、JSHandle をプロパティ値として指定することもできます。
// Note you can only create DataTransfer in Chromium and Firefox
const dataTransfer = await frame.evaluateHandle(() => new DataTransfer());
await frame.dispatchEvent('#source', 'dragstart', { dataTransfer });
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
DOM イベントタイプ:
"click"、"dragstart"など。 -
eventInitEvaluationArgument (オプション)#オプションのイベント固有の初期化プロパティ。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
fill
v1.9より前に追加代わりにロケーターベースの locator.fill() を使用してください。ロケーターについて詳しくはこちら。
このメソッドは、セレクターに一致する要素を待ち、actionability チェックを待ち、要素にフォーカスし、入力フィールドに値を入力し、入力後に input イベントをトリガーします。入力フィールドをクリアするために空の文字列を渡すことができることに注意してください。
ターゲット要素が <input>、<textarea>、または [contenteditable] 要素でない場合、このメソッドはエラーをスローします。ただし、要素が関連付けられた コントロール を持つ <label> 要素内にある場合、代わりにコントロールが入力されます。
きめ細かなキーボードイベントを送信するには、locator.pressSequentially() を使用してください。
使用法
await frame.fill(selector, value);
await frame.fill(selector, value, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
<input>、<textarea>または[contenteditable]要素に入力する値。 -
optionsObject (optional)-
forceboolean (オプション)追加バージョン: v1.13#actionability チェックをバイパスするかどうか。デフォルトは
falseです。 -
非推奨
このオプションは効果がありません。
このオプションは効果がありません。
-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
focus
v1.9より前に追加代わりにロケーターベースの locator.focus() を使用してください。ロケーターについて詳しくはこちら。
このメソッドは、セレクターに一致する要素を取得し、それにフォーカスします。セレクターに一致する要素がない場合、このメソッドは一致する要素が DOM に表示されるまで待機します。
使用法
await frame.focus(selector);
await frame.focus(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
getAttribute
v1.9より前に追加代わりにロケーターベースの locator.getAttribute() を使用してください。ロケーターについて詳しくはこちら。
要素の属性値を返します。
使用法
await frame.getAttribute(selector, name);
await frame.getAttribute(selector, name, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
値を取得する属性名。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
hover
v1.9より前に追加代わりにロケーターベースの locator.hover() を使用してください。ロケーターについて詳しくはこちら。
このメソッドは、以下の手順を実行して、セレクターに一致する要素にカーソルを合わせます。
- セレクターに一致する要素を検索します。一致する要素がない場合、一致する要素が DOM にアタッチされるまで待機します。
- force オプションが設定されていない限り、一致する要素の actionability チェックを待ちます。チェック中に要素がデタッチされた場合、全体のアクションが再試行されます。
- 必要に応じて要素を表示するためにスクロールします。
- page.mouse を使用して、要素の中央、または指定された 位置にカーソルを合わせます。
指定された timeout 内にすべての手順が完了しない場合、このメソッドは TimeoutError をスローします。タイムアウトにゼロを渡すと、これを無効にします。
使用法
await frame.hover(selector);
await frame.hover(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
actionability チェックをバイパスするかどうか。デフォルトは
falseです。 -
modifiersArray<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (オプション)#押す修飾キー。操作中にこれらの修飾キーのみが押されていることを保証し、現在の修飾キーを元に戻します。指定しない場合、現在押されている修飾キーが使用されます。"ControlOrMeta" は、Windows と Linux では "Control" に、macOS では "Meta" に解決されます。
-
noWaitAfterboolean (オプション)追加バージョン: v1.28#非推奨このオプションは効果がありません。
このオプションは効果がありません。
-
要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。 -
trialboolean (オプション)追加されたバージョン: v1.11#設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは
falseです。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。キーボードのmodifiersは、それらのキーが押されたときにのみ表示される要素をテストできるように、trialにかかわらず押されることに注意してください。
-
戻り値
innerHTML
v1.9より前に追加代わりにロケーターベースの locator.innerHTML() を使用してください。ロケーターについて詳しくはこちら。
element.innerHTML を返します。
使用法
await frame.innerHTML(selector);
await frame.innerHTML(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
innerText
v1.9より前に追加代わりにロケーターベースの locator.innerText() を使用してください。ロケーターについて詳しくはこちらをご覧ください。
element.innerText を返します。
使用法
await frame.innerText(selector);
await frame.innerText(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
inputValue
追加バージョン: v1.13代わりにロケーターベースの locator.inputValue() を使用してください。ロケーターについて詳しくはこちらをご覧ください。
選択した <input>、<textarea>、または <select> 要素の input.value を返します。
非入力要素の場合はスローされます。ただし、要素が関連する コントロールを持つ <label> 要素内にある場合は、コントロールの値を返します。
使用法
await frame.inputValue(selector);
await frame.inputValue(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
isChecked
v1.9より前に追加代わりにロケーターベースの locator.isChecked() を使用してください。ロケーターについて詳しくはこちらをご覧ください。
要素がチェックされているかどうかを返します。要素がチェックボックスまたはラジオ入力でない場合、スローします。
使用法
await frame.isChecked(selector);
await frame.isChecked(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
isDisabled
v1.9より前に追加代わりにロケーターベースの locator.isDisabled() を使用してください。ロケーターについて詳しくはこちらをご覧ください。
要素が無効であるかどうか、つまり 有効の反対を返します。
使用法
await frame.isDisabled(selector);
await frame.isDisabled(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
isEditable
v1.9より前に追加代わりにロケーターベースの locator.isEditable() を使用してください。ロケーターについて詳しくはこちらをご覧ください。
要素が 編集可能かどうかを返します。
使用法
await frame.isEditable(selector);
await frame.isEditable(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
isHidden
v1.9より前に追加代わりにロケーターベースの locator.isHidden() を使用してください。ロケーターについて詳しくはこちらをご覧ください。
要素が非表示であるかどうか、つまり 表示可能の反対を返します。要素に一致しない セレクターは非表示とみなされます。
使用法
await frame.isHidden(selector);
await frame.isHidden(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
非推奨
このオプションは無視されます。frame.isHidden() は要素が非表示になるのを待たずに即座に返します。
-
戻り値
isVisible
v1.9より前に追加代わりにロケーターベースの locator.isVisible() を使用してください。ロケーターについて詳しくはこちらをご覧ください。
要素が 表示可能かどうかを返します。要素に一致しない セレクターは表示可能ではないとみなされます。
使用法
await frame.isVisible(selector);
await frame.isVisible(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
非推奨
このオプションは無視されます。frame.isVisible() は要素が表示可能になるのを待たずに即座に返します。
-
戻り値
press
v1.9より前に追加代わりにロケーターベースの 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, ControlOrMeta。 ControlOrMetaはWindowsおよびLinuxではControlに、macOSではMetaに解決されます。
Shift を押し続けると、キーに対応するテキストが大文字で入力されます。
key が単一文字の場合、大文字と小文字が区別されるため、値 a と A はそれぞれ異なるテキストを生成します。
key: "Control+o"、key: "Control++、key: "Control+Shift+T"のようなショートカットもサポートされています。修飾キーを指定した場合、修飾キーは押し続けられ、その後に続くキーが押されます。
使用法
await frame.press(selector, key);
await frame.press(selector, key, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
押すキーの名前、または
ArrowLeftやaなどの生成する文字。 -
optionsObject (optional)-
keydownとkeyupの間の待機時間 (ミリ秒)。デフォルトは 0 です。 -
非推奨
このオプションは将来
trueになります。ナビゲーションを開始するアクションは、これらのナビゲーションが発生し、ページがロードを開始するのを待機します。このフラグを設定することで、待機をオプトアウトできます。これは、アクセスできないページにナビゲートするなどの例外的な場合にのみ必要です。デフォルトは
falseです。 -
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
selectOption
v1.9より前に追加代わりにロケーターベースの 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');
引数
-
クエリするセレクター。
-
valuesnull | 文字列 | ElementHandle | 配列<文字列> | オブジェクト | 配列<ElementHandle> | 配列<オブジェクト>#-
value文字列 (オプション)option.valueで一致します。任意。 -
label文字列 (オプション)option.labelで一致します。任意。 -
index数値 (オプション)インデックスで一致します。任意。
選択するオプション。
<select>にmultiple属性がある場合、一致するすべてのオプションが選択され、そうでない場合は、渡されたオプションのいずれかに一致する最初のオプションのみが選択されます。文字列値は値とラベルの両方に一致します。すべての指定されたプロパティが一致する場合、オプションは一致すると見なされます。 -
-
optionsObject (optional)-
forceboolean (オプション)追加バージョン: v1.13#actionability チェックをバイパスするかどうか。デフォルトは
falseです。 -
非推奨
このオプションは効果がありません。
このオプションは効果がありません。
-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
setChecked
追加されたバージョン: v1.15代わりにロケーターベースの locator.setChecked() を使用してください。ロケーターについて詳しくはこちらをご覧ください。
このメソッドは、セレクターに一致する要素に対して以下の手順を実行して、チェックまたはチェック解除します。
- セレクターに一致する要素を見つけます。一致する要素がない場合は、一致する要素が DOM にアタッチされるまで待ちます。
- 一致する要素がチェックボックスまたはラジオ入力であることを確認します。そうでない場合、このメソッドはエラーをスローします。
- 要素がすでに正しいチェック状態である場合、このメソッドはすぐに戻ります。
- force オプションが設定されていない限り、一致する要素に対してアクション可能性のチェックを待ちます。チェック中に要素がデタッチされた場合、すべてのアクションが再試行されます。
- 必要に応じて要素を表示するためにスクロールします。
- page.mouse を使用して、要素の中央をクリックします。
- 要素がチェックまたはチェック解除されたことを確認します。そうでない場合、このメソッドはエラーをスローします。
すべてのステップが指定された タイムアウト内に完了しない場合、このメソッドは TimeoutError をスローします。タイムアウトをゼロに設定すると、これを無効にします。
使用法
await frame.setChecked(selector, checked);
await frame.setChecked(selector, checked, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
チェックボックスをチェックするか、チェックを外すか。
-
optionsObject (optional)-
actionability チェックをバイパスするかどうか。デフォルトは
falseです。 -
非推奨
このオプションは効果がありません。
このオプションは効果がありません。
-
要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
-
true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。 -
設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは
falseです。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。
-
戻り値
setInputFiles
v1.9より前に追加代わりにロケーターベースの locator.setInputFiles() を使用してください。ロケーターについて詳しくはこちらをご覧ください。
ファイル入力の値をこれらのファイルパスまたはファイルに設定します。いくつかのfilePathsが相対パスの場合、現在の作業ディレクトリからの相対パスとして解決されます。空の配列の場合、選択されたファイルをクリアします。
このメソッドは、セレクターが input 要素を指していることを想定しています。ただし、要素が関連する コントロールを持つ <label> 要素内にある場合は、代わりにコントロールをターゲットとします。
使用法
await frame.setInputFiles(selector, files);
await frame.setInputFiles(selector, files, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
非推奨
このオプションは効果がありません。
このオプションは効果がありません。
-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
tap
v1.9より前に追加代わりにロケーターベースの locator.tap() を使用してください。ロケーターについて詳しくはこちらをご覧ください。
このメソッドは、セレクターに一致する要素に対して以下の手順を実行してタップします。
- セレクターに一致する要素を見つけます。一致する要素がない場合は、一致する要素が DOM にアタッチされるまで待ちます。
- force オプションが設定されていない限り、一致する要素に対してアクション可能性のチェックを待ちます。チェック中に要素がデタッチされた場合、すべてのアクションが再試行されます。
- 必要に応じて要素を表示するためにスクロールします。
- 要素の中央または指定された 位置をタップするには、page.touchscreen を使用します。
すべてのステップが指定された タイムアウト内に完了しない場合、このメソッドは TimeoutError をスローします。タイムアウトをゼロに設定すると、これを無効にします。
frame.tap() は、ブラウザコンテキストの hasTouch オプションが true に設定されている必要があります。
使用法
await frame.tap(selector);
await frame.tap(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
actionability チェックをバイパスするかどうか。デフォルトは
falseです。 -
modifiers配列<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (オプション)#押す修飾キー。操作中にこれらの修飾キーのみが押されていることを保証し、現在の修飾キーを元に戻します。指定しない場合、現在押されている修飾キーが使用されます。"ControlOrMeta" は、Windows と Linux では "Control" に、macOS では "Meta" に解決されます。
-
非推奨
このオプションは効果がありません。
このオプションは効果がありません。
-
要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。 -
trialboolean (オプション)追加されたバージョン: v1.11#設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは
falseです。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。キーボードのmodifiersは、それらのキーが押されたときにのみ表示される要素をテストできるように、trialにかかわらず押されることに注意してください。
-
戻り値
textContent
v1.9より前に追加代わりにロケーターベースの locator.textContent() を使用してください。ロケーターについて詳しくはこちらをご覧ください。
element.textContent を返します。
使用法
await frame.textContent(selector);
await frame.textContent(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
type
v1.9より前に追加ほとんどの場合、代わりに locator.fill() を使用すべきです。ページに特別なキーボード処理がある場合にのみ、キーを1つずつ押す必要があります。この場合は locator.pressSequentially() を使用してください。
テキスト内の各文字に対して keydown、keypress/input、および keyup イベントを送信します。frame.type は、細かなキーボードイベントを送信するために使用できます。フォームフィールドに値を入力するには、frame.fill() を使用します。
Control や ArrowDown などの特殊キーを押すには、keyboard.press() を使用します。
使用法
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
フォーカスされた要素に入力するテキスト。
-
optionsObject (optional)-
キー押下間の待機時間(ミリ秒)。デフォルトは0です。
-
非推奨
このオプションは効果がありません。
このオプションは効果がありません。
-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
uncheck
v1.9より前に追加代わりにロケーターベースの locator.uncheck() を使用してください。ロケーターについて詳しくはこちらをご覧ください。
このメソッドは、セレクターに一致する要素に対して以下の手順を実行して、チェック解除します。
- セレクターに一致する要素を見つけます。一致する要素がない場合は、一致する要素が DOM にアタッチされるまで待ちます。
- 一致する要素がチェックボックスまたはラジオ入力であることを確認します。そうでない場合、このメソッドはスローされます。要素がすでにチェック解除されている場合、このメソッドは即座に返します。
- force オプションが設定されていない限り、一致する要素に対してアクション可能性のチェックを待ちます。チェック中に要素がデタッチされた場合、すべてのアクションが再試行されます。
- 必要に応じて要素を表示するためにスクロールします。
- page.mouse を使用して、要素の中央をクリックします。
- 要素がチェックされていないことを確認します。そうでない場合、このメソッドはエラーをスローします。
すべてのステップが指定された タイムアウト内に完了しない場合、このメソッドは TimeoutError をスローします。タイムアウトをゼロに設定すると、これを無効にします。
使用法
await frame.uncheck(selector);
await frame.uncheck(selector, options);
引数
-
要素を検索するセレクター。セレクターを満たす要素が複数ある場合、最初の要素が使用されます。
-
optionsObject (optional)-
actionability チェックをバイパスするかどうか。デフォルトは
falseです。 -
非推奨
このオプションは効果がありません。
このオプションは効果がありません。
-
positionObject (オプション)追加されたバージョン: v1.11#要素のパディングボックスの左上隅を基準に使用する点。指定しない場合は、要素の可視点の一部が使用されます。
-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。 -
trialboolean (オプション)追加されたバージョン: v1.11#設定されている場合、このメソッドは actionability チェックのみを実行し、アクションをスキップします。デフォルトは
falseです。アクションを実行せずに要素がアクションの準備が整うまで待つ場合に便利です。
-
戻り値
waitForNavigation
v1.9より前に追加このメソッドは本質的に競合が発生しやすいです。代わりに 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 を使用することは、ナビゲーションと見なされます。
引数
optionsObject (optional)-
ミリ秒単位の最大操作時間。デフォルトは
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より前に追加代わりに可視性をアサートするウェブアサーション、またはロケーターベースの 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();
})();
引数
-
クエリするセレクター。
-
optionsObject (optional)-
state"attached" | "detached" | "visible" | "hidden" (オプション)#デフォルトは
'visible'です。以下のいずれかになります。'attached'- 要素がDOMに存在することを待ちます。'detached'- 要素がDOMに存在しないことを待ちます。'visible'- 要素が空でない境界ボックスを持ち、visibility:hiddenがないことを待ちます。コンテンツがない要素やdisplay:noneの要素は空の境界ボックスを持つため、可視とはみなされないことに注意してください。'hidden'- 要素がDOMからデタッチされているか、空の境界ボックスを持つか、またはvisibility:hiddenを持つことを待ちます。これは'visible'オプションとは逆です。
-
strictboolean (オプション)追加されたバージョン: v1.14#true の場合、呼び出しはセレクターが単一の要素に解決されることを要求します。指定されたセレクターが複数の要素に解決される場合、呼び出しは例外をスローします。
-
最大タイムアウト時間(ミリ秒単位)。デフォルトは
0(タイムアウトなし) です。デフォルト値は、config のactionTimeoutオプション、または browserContext.setDefaultTimeout() または page.setDefaultTimeout() メソッドを使用して変更できます。
-
戻り値
waitForTimeout
v1.9より前に追加本番環境でタイムアウトを待つことは絶対に避けてください。時間を待つテストは本質的に不安定です。自動的に待機する ロケーターアクションとウェブアサーションを使用してください。
指定された タイムアウト(ミリ秒)だけ待機します。
frame.waitForTimeout() はデバッグ目的でのみ使用すべきであることに注意してください。本番環境でタイマーを使用するテストは不安定になるでしょう。代わりに、ネットワークイベント、セレクターの可視化などのシグナルを使用してください。
使用法
await frame.waitForTimeout(timeout);
引数
戻り値