PDFFileElement: open() method

Works in all major browsers
Since July 2026

WebPDF works in Chrome and Edge 125, Firefox 153 and Safari 18, on desktop and mobile, and in every later version: the oldest versions its PDF.js build supports, which already have every platform feature WebPDF needs. Since July 2026, that is every major browser.

The open() method of the PDFFileElement interface shows a file picker and loads the PDF you pick into a <pdf-file>, with its form data if you pick an XFDF file too.

With the File System Access API, the picker is showOpenFilePicker(), and the file remembers the handle, so PDFFileElement.save() can later write to the same file. Otherwise it is an <input type=file>.

Syntax

js
open()

Parameters

None.

Return value

A Promise that resolves to the opened File: the PDF's, also when you picked its XFDF file too, once both are applied. It rejects when you cancel the picker.

Exceptions

None.

Usage notes

Examples

An Open button

html
<button type=button>Open…</button>
<pdf-file id=f></pdf-file>
<pdf-page of=f></pdf-page>
js
const file = document.querySelector("#f");
document.querySelector("button").addEventListener("click", () => file.open());

Specifications

Not part of any specification. <pdf-file> and <pdf-page> are autonomous custom elements defined by WebPDF.pro.

Browser compatibility

desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
open()
1251251531111812515383182712518
  • open() · Firefox, Safari, Chrome Android, Firefox for Android, Opera Android, Safari on iOS, Samsung Internet, WebView Android, WebView on iOS: Without the File System Access API (Chrome Android 132, Opera Android 87, Samsung Internet 29 and WebView Android 132 have it), opening falls back to <input type=file> and saving to a download.

Legend

Full support
See implementation notes.

See also