Testing File Uploads, Downloads, and PDFs Using Playwright

Modern web applications rely heavily on file interactions — whether it’s users uploading a profile picture, downloading a report, or previewing a PDF. Testing these flows is critical, but many testers struggle to handle them reliably.

In this article, you’ll learn how to test:

• ✅ File Uploads
• 📥 File Downloads
• 📄 PDF Content Preview & Validation

All using Playwright, a modern E2E testing tool built by Microsoft.

1. Uploading Files in Playwright

Uploading a file in Playwright is incredibly easy using the setInputFiles() method.

import { test, expect } from '@playwright/test';
test('Upload a file', async ({ page }) => {
  await page.goto('https://example.com/upload');
J
  const fileInput = page.locator('input[type="file"]');
  await fileInput.setInputFiles('tests/files/test-document.pdf');
await page.getByRole('button', { name: 'Upload' }).click();
  await expect(page.locator('.success-message')).toHaveText('Upload successful');
});

📝 Notes:

• Make sure the file exists in your project directory.
• You can also upload multiple files using an array:
  await fileInput.setInputFiles(['file1.pdf', 'file2.png']);

2. Downloading Files in Playwright

Playwright allows you to track downloads using the page.waitForEvent('download') method.

test('Download a file', async ({ page }) => {
  await page.goto('https://example.com/download');
const [download] = await Promise.all([
    page.waitForEvent('download'), // Waits for the download to start
    page.click('text=Download Report'),
  ]);
  const downloadPath = await download.path();
  console.log('Downloaded file path:', downloadPath);
  await expect(download.suggestedFilename()).toContain('report.pdf');
});

📝 Notes:

• You can save the download with a custom name:
  await download.saveAs('downloads/monthly-report.pdf')
• Useful in CI to validate report generation or invoices.

3. Reading and Validating PDFs

Playwright itself cannot parse PDFs, but you can combine it with Node.js libraries like pdf-parse.

First, install:

npm install pdf-parse

import fs from 'fs';
import pdf from 'pdf-parse';
test('Validate PDF content', async ({ page }) => {
  await page.goto('https://example.com/download');
  const [download] = await Promise.all([
    page.waitForEvent('download'),
    page.click('text=Download Invoice'),
  ]);
  const filePath = await download.path();
  const dataBuffer = fs.readFileSync(filePath);
  const pdfData = await pdf(dataBuffer);
  expect(pdfData.text).toContain('Invoice Number');
  expect(pdfData.text).toMatch(/Total: \$\d+/);
});

🧠 Why This is Powerful:

• You’re not just testing that the file downloaded, but validating its content.
• You can validate totals, names, dates, or even specific keywords.

Testing file uploads, downloads, and PDF content is no longer a hassle with Playwright. Whether you’re building a document-heavy SaaS or a simple resume uploader, you now have full control and confidence in your test coverage.

Quick Recap:

• ✅ Use setInputFiles() for uploads
• 📥 Track and validate downloads with page.waitForEvent('download')
• 📄 Parse PDFs using pdf-parse to validate content

#Playwright #E2E #Testing #QA #PDF #Automation