- 印刷
- ダークライト
1. 一般的なアサーション
これらのアサーションは、ページ上のすべてのHTML要素 でご利用いただけます。
可視性のアサーション
キーワード名 | 概要 |
---|---|
対象が表示されていることを確認する | 対象の要素が目視できる状態であることを確認する |
このアサーションは、対象要素がHTMLのコード上に存在していても display: none;
や visibility: hidden;
、opacity: 0;
など見えない状態の場合、ビューポートの外にある場合は失敗となります。以下のドキュメントもあわせてご参照ください。
「ページに指定の要素が存在することを確認する」と「対象が表示されていることを確認する」の違いはなんですか?
基本的なテキストアサーション
キーワード名 | 概要 |
---|---|
対象のテキストが〇〇であることを確認する | 対象の要素の文字列が指定の文字列と完全に一致することを確認する |
対象のテキストが〇〇を含むことを確認する | 対象の要素の文字列が指定の文字列を含むことを確認する |
対象のテキストが〇〇を含まないことを確認する | 対象の要素の文字列が指定の文字列を含まないことを確認する |
対象のテキストが指定の文字列で開始することを確認する | 対象の要素の文字列が指定の文字列で開始することを確認する |
対象のテキストが指定の文字列で開始しないことを確認する | 対象の要素の文字列が指定の文字列とは異なる文字列で始まることを確認する |
対象のテキストが空白でないことを確認する | 対象の要素の文字列が、空白文字(半角・全角のスペースやタブ、LF や CR のような改行文字などを含む)以外の文字を1つ以上含むことを確認する |
正規表現を使ったテキストアサーション
キーワード名 | 概要 |
---|---|
対象のテキストが正規表現に一致することを確認する | 対象の要素が指定された正規表現パターンに一致する文字列を持つことを確認する |
対象のテキストが正規表現に一致しないことを確認する | 対象の要素が指定された正規表現パターンに一致する文字列を持たないことを確認する |
正規表現を使うと、ユースケースに応じてきわめて柔軟なテキストアサーションを作成することができます。参考までに、以下にいくつかの正規表現の例を挙げます:
^Good (morning|night)
Good morning
またはGood night
で始まる文字列- 一致する文字列の例:
Good night
,Good morning, Hatty!
- 一致する文字列の例:
w[ow]+w$
w
の後に1つ以上のo
またはw
が続き、w
で終わる文字列- 一致する文字列の例:
wowow
,Oh, wow
- 一致する文字列の例:
^\d{3}-\d{4}$
- 3桁の数字で始まり、ハイフンを挟んで4桁の数字で終わる文字列
- 一致する文字列の例:
123-4567
,999-0000
- 一致する文字列の例:
- 3桁の数字で始まり、ハイフンを挟んで4桁の数字で終わる文字列
正規表現の文法の詳細については、以下のドキュメント(外部)をご覧ください。
正規表現構文早見表 (MDN)
- 正規表現を用いたテキストアサーションは、指定された正規表現に文法上の誤りがあった場合には失敗します。
i
(大文字小文字の区別を無視)やm
(複数行指定)はサポートされていません。
チェックボックスのアサーション
キーワード名 | 概要 |
---|---|
チェックボックスが選択されていることを確認する | チェックボックス・ラジオボタンにチェックが入っている状態であることを確認する |
チェックボックスが選択されていないことを確認する | チェックボックス・ラジオボタンにチェックが入っていない状態であることを確認する |
MLを用いたAutifyのチェックボックスアサーションは、<input type="checkbox">
の要素だけでなく、スタイルを使ってチェックボックスに見せかけた <div>
要素や <span>
要素など、チェックボックスのような見た目を持つあらゆる要素で機能します!
数値のアサーション
これらのアサーションは、数字及び「. (ピリオド)」を対象にしています。
具体的には、テキスト中の最初の数字 (0 ~ 9) から、数字以外の文字 (カンマを含む) までを対象としてアサーションを行います。そのため、「¥1,234」のように、「,」を含む場合、1のみを対象としてアサーションします。
また、「その金額は、¥1000. 」のように「.」を含む要素であっても「.」の後に数字がない場合は、「1000」が対象となります。
キーワード名 | 概要 |
---|---|
数値が指定の値より大きいことを確認する | 対象の要素が指定された数値よりも大きな値を持つことを確認する |
数値が指定の値より小さいことを確認する | 対象の要素が指定された数値よりも小さな値を持つことを確認する |
対象が数値でない場合には、数値のアサーションは失敗します。
クラス名のアサーション
キーワード名 | 概要 |
---|---|
対象のクラス名が指定の文字列を含むことを確認する | 対象の要素が指定された文字列を含むクラス名をクラス属性に持つことを確認する |
対象のクラス名が指定の文字列を含まないことを確認する | 対象の要素が指定された文字列を含むクラス名をクラス属性に持たないことを確認する |
クラス名は部分一致で検出されます。たとえば、state-1
をクラス名に指定した場合は、次のような要素とマッチします。
<div class="state-10">
<div class="sample-a state-1">
このアサーションの使用例としては、特定のスタイルが適用されるクラスの有無を確認するなどが挙げられます。
2. 有効・無効のアサーション
これらのアサーションは、BUTTON
, INPUT
, SELECT
, TEXTAREA
, OPTGROUP
, OPTION
, FIELDSET
要素でご利用いただけます。
キーワード名 | 概要 |
---|---|
対象が有効であることを確認する | 要素が有効であることを確認する(対象要素がdisabled属性もしくはreadonly属性を持たないことを確認する) |
対象が無効であることを確認する | 要素が無効であることを確認する(対象要素がdisabled属性もしくはreadonly属性を持つことを確認する) |
見た目がボタンや選択肢の要素の場合でも、 実態として div
や span
として記述されていてCSSで見た目を整えているような場合には、これらのコマンドは表示されません。また、disabled属性を持っておらず、JavaScriptで操作できない状態になっている要素は、有効であるとみなされます。
3. フォーム要素のアサーション
テキストフィールドのアサーション
これらのアサーションは、INPUT
要素でご利用いただけます。
キーワード名 | 概要 |
---|---|
テキストフィールドの値が〇〇であることを確認する | テキストフィールドに入力されている内容が指定の文字列と完全に一致することを確認する |
テキストフィールドの値が〇〇を含むことを確認する | テキストフィールドに入力されている内容が指定の文字列を含むことを確認する |
テキストエリアのアサーション
これらのアサーションは、TEXTAREA
要素でご利用いただけます。
キーワード名 | 概要 |
---|---|
テキストエリアの値が〇〇であることを確認する | テキストエリアに入力されている内容が指定の文字列と完全に一致することを確認する |
テキストエリアのテキストが〇〇を含むことを確認する | テキストエリアに入力されている内容が指定の文字列を含むことを確認する |
プルダウンメニューのアサーション
これらのアサーションは、SELECT
要素でご利用いただけます。
ドロップダウンリスト、プルダウンメニュー、リストボックス、 など様々な呼ばれ方をする、複数の選択肢から選択を行う要素に対するアサーションです。
キーワード名 | 概要 |
---|---|
selectの選択内容が指定通りか確認する | 指定の文字列と一致する選択肢が選ばれていることを確認する |
selectが非選択状態であることを確認する | multiple 属性のついた select で何も選択されていないことを確認する |
※複数の選択肢を選択している場合にうまく動作しない可能性があり、将来的に修正予定です。
プルダウンメニューのアサーションの留意事項
択一式の要素においてデフォルトの選択肢が選択されている状態は、 selectが非選択状態であることを確認する では確認できません。
例えば、以下のスクリーンショットは Autify のデモをリクエストするフォームに含まれるプルダウンですが、 最上部の 組織の総従業員数 が表示されている状態は
非選択状態ではなく 組織の総従業員数 の選択肢が選択されている状態です。
デフォルトの選択肢が選択されている状態を確認したい場合は selectが非選択状態であることを確認する ではなく selectの選択内容が指定通りか確認する をご利用ください。