特定のフォームの中にあるフィールド(入力欄)に入力するステップです。入力欄に値が入っている場合は、「入力値」で置き換えます。
パラメータ
| パラメータ名 |
説明 |
フォーム名 |
<form>タグのid属性、または、<form>タグに含まれるテキストが利用可能。
|
フィールド名 |
id属性・name属性・placeholder属性
<label>タグのテキスト・CSS3セレクターなどが利用可能。
|
入力値 |
入力する文字列。 |
探索対象のフォーム
このステップが見つけることができる<form>は次の2種類のHTMLです。
<!-- 1. id属性が付いている -->
<form id="フォーム名">...</form>
<!-- 2. フォームの見出しテキストを含む -->
<form>...フォーム名...</form>
例えば、下記のように複数フォームがあるページで、「first_form」フォームの「field」フィールドの値が「value1」であることを実行すると、1つ目のフォームのフィールドの値をチェックします。
1つ目のフォームのid属性がfirst_formなので、これを手がかりにフォームを見つけるわけです。
一方、「2つ目のフォーム」フォームの「field」フィールドの値が「value2」であることという書き方では、2つ目のフォームのフィールドの値をチェックするようになります。
2つ目のフォームが「2つ目のフォーム」というテキストを含んでいるため、これがフォームを見つける手がかりになります。
テスト対象サイトの実装によっては、フォームが見出しテキストを持っています。
テキストは画面に見えるので、テキストでフォームを探す書き方のほうがステップが読みやすくなるメリットがあります。
<form id="first_form">
<div>1つ目のフォーム</div>
入力欄:<input type="text" name="field" value="value1">
</form>
<form id="second_form">
<div>2つ目のフォーム</div>
入力欄:<input type="text" name="field" value="value2">
</form>
探索対象のフィールド
このステップは下記の順番でマッチする要素を探していきます。
<input type="text" id="フィールド名">
<input type="text" name="フィールド名">
<input type="text" placeholder="フィールド名">
<label for="...">フィールド名</label> <input id="..." type="text">
<label>フィールド名 <input type="text"></label>
<input type="password" id="フィールド名">
<input type="password" name="フィールド名">
<input type="password" placeholder="フィールド名">
<label for="...">フィールド名</label> <input id="..." type="password">
<label>フィールド名 <input type="password"></label>
<textarea id="フィールド名"></textarea>
<textarea name="フィールド名"></textarea>
<textarea placeholder="フィールド名"></textarea>
<label for="...">フィールド名</label> <textarea id="..."></textarea>
<label>フィールド名 <textarea type="password"></textarea></label>
<input type="email" id="フィールド名">
<input type="email" name="フィールド名">
<input type="email" placeholder="フィールド名">
<label for="...">フィールド名</label> <input id="..." type="email">
<label>フィールド名 <input type="email"></label>
<input type="tel" id="フィールド名">
<input type="tel" name="フィールド名">
<input type="tel" placeholder="フィールド名">
<label for="...">フィールド名</label> <input id="..." type="tel">
<label>フィールド名 <input type="tel"></label>
<input id="フィールド名">
<input name="フィールド名">
<input placeholder="フィールド名">
<label for="...">フィールド名</label> <input id="...">
<label>フィールド名 <input></label>
以上のフィールドを探した後、何も見つからなければCSS3としてフィールドを探索します。
2つ目のフォームのフィールドに入力する例
「http://docs.shouldbee.at/steps/FillFieldInForm/」に移動する
「ご登録済み会員ログイン」フォームの「メールアドレス」フィールドに「tanaka@example.com」と入力する
「ご登録済み会員ログイン」フォームの「メールアドレス」フィールドの値が「tanaka@example.com」であること