I can't record file uploads/tests fail at file upload

Prerequisites

To record file uploads and run the test, an input element with the type attribute set to "file" must exist in the DOM tree. As long as the input element is present in the DOM tree, it's okay if it's hidden in the CSS settings.

Causes

If the "Choose File" step is not recorded during file upload operations, or if it is recorded but test execution fails, possible causes are detailed below.

"Choose File" Step not recorded

Input element is not added to the DOM

As mentioned in the prerequisites, an input element with the type attribute set to "file" must exist in the DOM tree to record file upload operations and execute the test.

The experimental function window.showOpenFilePicker() is used

Autify does not support recording file upload operations using this function. However, you can record the "Choose File" step by running the following JavaScript code in the Developer Tool console before recording file upload operations:

window.showOpenFilePicker = () => {
  return Promise.reject(new DOMException("", "SecurityError"))
}

The input element is triggered indirectly

If the input element is triggered by clicking an element other than the input element, such as a button element, Autify may not detect the file upload event, and the "Choose File" step may not be recorded.

In this case, you can record the "Choose File" step by following these steps:

1. Click on the target input element using JavaScript in the Developer Tools console.
2. A file selector window appears. Select the appropriate file.

Recording is successful but test execution fails

If the application under test has been updated and the position or properties of the input element have changed, Autify may not be able to find a matching element, causing the test to fail.

In this case, you may see improvements by re-recording or by using Quick Element Update.

Recording or test execution is unreliable

If the input element can only be found at specific times - for example, if it's dynamically generated or added to the DOM tree only during file upload operations - recording and execution may be unreliable.

You can improve this situation by adding the event that causes the input element to be generated/added. For example, by recording "Click the [Upload File] button".

Reference Articles

• File Upload
• Autify JavaScript Snippets - Click an element
• Details on <input type="file"> (jumps to MDN Web Docs)
• Introduction to the DOM (jumps to MDN Web Docs)
• Window: showOpenFilePicker() method (jumps to MDN Web Docs)

If the above does not solve your problem, please contact us via Autify chat.