- 印刷
- ダークライト
レコーディング時に、要素をクリックしてもアサーションが記録されない、もしくは希望する種類のアサーションが選択肢に表示されない場合、以下のような原因が考えられます。
近くにある別の要素を選択してしまっている
まずは、アサーションを行いたい要素を正しく選択できているか確認してください。
選択した要素によって、利用できるアサーションの種類は異なります。
例えば、ボタンに対して有効 (クリック可能) か無効 (クリック不可) かのアサーションを行いたいとします。
この場合、選択の対象は <button>
要素である必要があります。
近くにある別の要素 (親や兄弟要素など) を選択してしまっていると、「対象が有効/無効であることを確認する」アサーションが表示されないことがあります。
対象の要素にCSSプロパティ pointer-events: none
が適用されている
希望する要素に対してアサーションが記録できない場合、その要素に pointer-events: none
という CSS プロパティが適用されている可能性があります。この CSS プロパティが適用されている場合、イベントの発火が無効化されてしまうために、レコーダーが要素に対する操作を記録できなくなります。
以下に、この場合のワークアラウンドを 2 つ紹介します。
1. pointer-events: none
を削除する
ウェブサイトを変更してこのスタイルを取り除くか、 Chrome DevTools から、一時的にこのプロパティを無効化します。
レコーダーが要素を認識できるようになるためこちらの方法を推奨しますが、難しい場合は 2 つ目の方法をお試しください。
2. pointer-events: none
が適用されていない時に作成したアサーションステップを使用する
例としてボタンの有効 / 無効を検証したい場合のワークアラウンドを紹介します。
この方法は以下の前提を満たしている必要があります。
- ボタン有効時は対象の要素にフォーカスでき、「対象が有効であることを確認する」ステップが作成できる
- ボタン無効時は
pointer-events: none
の影響でフォーカスできず、「対象が無効であることを確認する」アサーションも表示されない
前提を満たしている場合は以下の方法でボタンが無効であることを検証できます!
- シナリオにある「対象が有効であることを確認する」ステップをコピーする (まだステップがない場合はレコーディングしてステップを作成してください)
- コピーした「対象が有効であることを確認する」ステップのアクションの選択肢を開き、「対象が無効であることを確認する」を選択し保存する