Playwright File Upload Download
A job portal asks a candidate to upload a resume. A tax website lets a user download a filled form. File uploads and downloads appear across countless websites, and Playwright handles both without ever needing a real file picker window to open on screen.
The Upload Journey
Test Script
|
v
File Input Element on the Page
|
v
File Attached Directly (No Dialog Box Needed)
|
v
File Sent to the Server
Uploading a Single File
await page.getByLabel('Upload Resume').setInputFiles('resume.pdf');This line attaches the file named "resume.pdf" straight to the file input. Playwright skips the operating system's file browser window entirely, making the test faster and more reliable.
Uploading Multiple Files at Once
await page.getByLabel('Attach Documents').setInputFiles([
'id-proof.pdf',
'address-proof.pdf',
]);Passing an array of file names uploads several documents together, matching forms that accept multiple attachments in one step.
Uploading a File Created on the Fly
await page.getByLabel('Upload File').setInputFiles({
name: 'notes.txt',
mimeType: 'text/plain',
buffer: Buffer.from('This is a test file'),
});This creates a small text file directly in memory without needing an actual file saved on the computer beforehand, useful for quick, disposable test files.
Removing an Uploaded File
await page.getByLabel('Upload Resume').setInputFiles([]);Passing an empty array clears any previously attached file from the input.
The Download Journey
Click Download Button
|
v
Browser Starts the Download
|
v
Playwright Listens for the Download Event
|
v
File Saved for Inspection
Capturing a Download
const [download] = await Promise.all([
page.waitForEvent('download'),
page.getByRole('button', { name: 'Download Invoice' }).click(),
]);
await download.saveAs('invoice.pdf');Playwright waits for the download to start at the same moment the button gets clicked, then saves the resulting file under a chosen name.
Checking the Downloaded File Name
console.log(download.suggestedFilename());This confirms the website suggested the correct file name, catching bugs where a download arrives with a broken or generic name.
A Real-World Example
An online banking test uploads a scanned ID document during account verification, then later downloads a monthly statement to confirm it generates correctly. Both actions run within seconds, without ever showing an actual file dialog window.
Quick Practice Task
Find a website offering a free downloadable file, such as a sample PDF. Write a test that clicks the download link and saves the file locally.
Key Takeaways
- setInputFiles attaches files without opening a real file picker window.
- Multiple files and in-memory files both work with setInputFiles.
- waitForEvent captures downloads triggered by a button click.
- Downloaded files can be saved and checked within the same test.
