Endtest

Endtest

›Web Tests

Web Tests

  • How to create Web Tests
  • Finding elements in Web Applications
  • How to execute Web Tests
  • Assertions for Web Tests
  • IF Statements for Web Tests
  • Web Applications with restricted access
  • How to test in iframes
  • How to test in multiple tabs
  • How to test File Uploads
  • How to test File Downloads
  • How to test Emails
  • How to test PDF files
  • How to test Chrome Extensions
  • Dealing with reCAPTCHA
  • Dealing with Dynamic Locators
  • Dealing with Canvas Elements
  • Performing a Drag and Drop
  • Execute JavaScript
  • Testing WebRTC Applications
  • How to scroll in Web Tests
  • How to test Checkboxes
  • How to test Dropdowns
  • Dealing with Sessions
  • Web Crawler
  • Export Web Tests
  • Migrating from Selenium

Mobile Tests

  • How to create Mobile Tests
  • Finding elements in Mobile Applications
  • How to execute Mobile Tests
  • Assertions for Mobile Tests
  • IF Statements for Mobile Tests
  • How to scroll in Mobile Tests
  • Performing Complex Gestures

Advanced

  • Variables
  • Waits
  • Endtest API
  • Scheduler
  • Drive
  • Adding Collaborators
  • Computer Vision
  • Importing Test Cases
  • Using Loops
  • Data-driven Testing
  • Send API Requests
  • Read SMS
  • Execute SQL queries
  • Self-Healing Tests
  • Email Notifications
  • Slack Notifications
  • PagerDuty Notifications
  • Webhook Notifications
  • Automatic Backup
  • Advanced Settings
  • Multiple environments
  • How to stop a test
  • Utilities
  • Utilities API
  • Team
  • On-Premises

Integrations

  • Atlassian Jira
  • Slack
  • PagerDuty
  • Microsoft Teams
  • Discord
  • Mattermost
  • Jenkins
  • GitHub
  • Azure DevOps
  • GitLab
  • TeamCity
  • CircleCI
  • TravisCI
  • Bitbucket
  • Heroku
  • Bamboo Server
  • Test Case Management
  • SSO
  • BrowserStack
  • Sauce Labs

How to test File Uploads

Introduction

When you manually upload a file on a site, a native window from the Operating System opens which allows you to select the file.

After you select the file from that window, the local path of the file is written in the <input type="file"> element.

Since our engine is using the webdrivers to locate and interact with elements from Web Applications, our engine cannot see or interact with that native window from the Operating System.

That's why our Upload FIle action writes the local path of the file directly in the <input type="file"> element, thus skipping the native window from the Operating System.

In the Upload FIle action, you need to provide the online path for your file.

You can get an online path for your file by uploading it in our Drive section.

Our engine will download the file from that path, place it on the machine on which the test is executed and it will get the local path for that file and write it in the <input type="file"> element.

There is no need to add a Click step that clicks on the Choose file button from your Web Application, since there is no need for the native window from the Operating System to be displayed.

Sometimes, the <input type="file"> may be hidden or may not be displayed.

In order for our engine to interact with that input, you might need to add an Execute JavaScript step to make it visible.

Steps

  1. Upload your file in our Drive section.
  2. Copy the File Download URL for your uploaded file.
  3. Find the <input type="file"> in your Web Application.
  4. Get the locator for that element.
  5. Add the File Download URL for your file in the Upload File step.


In order for our engine to interact with that input, you might need to add an Execute JavaScript step before step 5 in order to make it visible.

The Execute JavaScript step must be placed before the Upload File step.

For this example, we'll pretend that the <input type="file"> has the myFile ID.

document.querySelector("#myFile").style.visibility="visible";
document.querySelector("#myFile").style.display="block";

Depending on the state of your element, you might also need to update CSS properties such as width, height, opacity, z-index, pointer-events, etc.

document.querySelector("#myFile").style.visibility="visible";
document.querySelector("#myFile").style.display="block";
document.querySelector("#myFile").style.width="200px";
document.querySelector("#myFile").style.height="20px";
document.querySelector("#myFile").style.position="fixed";
document.querySelector("#myFile").style.overflow="visible";
document.querySelector("#myFile").style.zIndex="9999999";
document.querySelector("#myFile").style.top="500px";
document.querySelector("#myFile").style.left="500px";
document.querySelector("#myFile").style.right="500px";
document.querySelector("#myFile").style.bottom="500px";

If you still can't figure it out, just send us a message, we'll gladly help out.

You can also upload files in the Drive by using our Endtest API.

More details are available in the Endtest API chapter.

← How to test in multiple tabsHow to test File Downloads →
  • Introduction
  • Steps
© Endtest Inc.