Skip to main content

Test File Upload Functionality

Learn how to test the file upload functionality of your web app using BrowserStack Automate.

Overview

The file upload functionality of a web app allows you to upload files for various features, such as forms, registration pages, or document uploaders. Uploading a file requires searching for the file in a specific location on your machine, and then uploading it to the web app.

BrowserStack allows you to test the Playwrights file upload functionality using the setInputFiles method of the locator element that enables file transfers from your machine to the BrowserStack remote browser. The locator.setInputFiles(files[, options]) method should always point the first argument to a file type.

Upload files from your machine

The following code example shows how the setInputFiles method is used to upload a file:

'use strict';
const {chromium} = require('playwright');
const {promisify} = require('util');
const sleep = promisify(setTimeout);

(async () => {
  const caps = {
    build: 'Playwright testing',
    browser: "chrome",
    os: "osx",
    os_version: "monterey",
    'browserstack.username': process.env.BROWSERSTACK_USERNAME,
    'browserstack.accessKey': process.env.BROWSERSTACK_ACCESS_KEY,
    'browserstack.networkLogs': true,
    'browserstack.console': 'errors'
  };

  const browser = await chromium.connect({
    wsEndpoint: `wss://cdp.browserstack.com/playwright?caps=${encodeURIComponent(JSON.stringify(caps))}`,
  });
  const context = await browser.newContext({ignoreHTTPSErrors: true});
  const page = await context.newPage();

  await page.goto('http://www.fileconvoy.com/');
  await page.locator('input[name=\"upfile_0\"]').setInputFiles('./my_file.txt');// This uploads the file my_file.txt from the current working directory.
  await page.locator('input[name=\"readTermsOfUse\"]').check();
  await page.locator('input[name=\"upload_button\"]').click();

  await sleep(5*1000);
  await browser.close();
})();

We're sorry to hear that. Please share your feedback so we can do better

Contact our Support team for immediate help while we work on improving our docs.

We're continuously improving our docs. We'd love to know what you liked






Thank you for your valuable feedback

Is this page helping you?

Yes
No

We're sorry to hear that. Please share your feedback so we can do better

Contact our Support team for immediate help while we work on improving our docs.

We're continuously improving our docs. We'd love to know what you liked






Thank you for your valuable feedback!

Talk to an Expert
Talk to an Expert