ファイルアップロード操作がレコーディングできない・テスト実行に失敗する
  • 04 Apr 2024
  • 1 分で読めます
  • 投稿者
  • ダーク
    ライト

ファイルアップロード操作がレコーディングできない・テスト実行に失敗する

  • ダーク
    ライト

記事の要約

前提条件

ファイルアップロード操作をレコーディングし、テストを実行するためには、type属性にfileがセットされたinput要素が、DOMツリー内に存在している必要があります。なお、DOMツリーに存在していれば、スタイルの設定で不可視にしていても問題ありません。

原因

ファイルのアップロード操作をしても、「ファイルを指定する」ステップがレコーディングされない、あるいはレコーディングできてもテスト実行が失敗してしまう場合、以下の原因が考えられます。

「ファイルを指定する」ステップがレコーディングされない

input要素が画面のDOMツリーに追加されていない

前提条件でも説明した通り、ファイルアップロード操作をレコーディングし、テストを実行するためには、type属性にfileがセットされたinput要素が、DOMツリー内に存在している必要があります。

実験的な機能のwindow.showOpenFilePicker()を使用している

Autifyは、この機能を使用したファイルアップロード操作のレコーディングをサポートしていません。しかし、以下のJSをデベロッパーツールのコンソールで実行してから、ファイルアップロード操作をレコーディングすると「ファイルを指定する」ステップをレコーディングできます。

window.showOpenFilePicker = () => {
  return Promise.reject(new DOMException("", "SecurityError"))
}
react-dropzoneを使用している場合

react-dropzoneを使用している場合は、useFsAccessApiをfalseに設定することで、この機能を無効化できます。

間接的にinput要素をトリガーしている

button要素など、input要素以外の要素のクリックを契機に、input要素をトリガーするような実装となっている場合、Autifyがファイルアップロードイベントを検出できず、「ファイルを指定する」ステップがレコーディングされない場合があります。

この場合、以下の方法で「ファイルを指定する」ステップのレコーディングが可能です。

  1. デベロッパーツールのコンソールから、JSを使用して対象となるinput要素をクリックする。
  2. ファイル選択画面が表示されるので、対象のファイルを選択する。

レコーディングはできるがテスト実行に失敗する

テスト対象アプリケーションのアップデートにより、 input要素の位置や特徴などが変化したことで、テスト実行時に一致する要素が見つからなくなりテストが失敗した可能性があります。

この場合、再レコーディングやクイック要素更新で改善する場合があります。

レコーディングやテスト実行が不安定

input要素が動的に生成されたり、ファイルアップロードの操作中のみDOMツリーに追加されるなど、特定のタイミングでないと発見することができない場合、レコーディングやテスト実行が不安定になります。

input要素が生成・追加されるために必要なイベント、例えば「[ファイルをアップロードする]ボタンをクリックする」などの操作を追加でレコーディングすることで、改善する場合があります。

参考記事

上記にて問題が解決しない場合は、Autifyのチャットからご相談ください。


この記事は役に立ちましたか?

Changing your password will log you out immediately. Use the new password to log back in.
First name must have atleast 2 characters. Numbers and special characters are not allowed.
Last name must have atleast 1 characters. Numbers and special characters are not allowed.
Enter a valid email
Enter a valid password
Your profile has been successfully updated.