Window: showDirectoryPicker() method

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The showDirectoryPicker() method of the Window interface displays a directory picker which allows the user to select a directory.

Syntax

js

showDirectoryPicker()

Parameters

options Optional

An object containing options, which are as follows:

id

By specifying an ID, the browser can remember different directories for different IDs. If the same ID is used for another picker, the picker opens in the same directory.

mode

A string that defaults to "read" for read-only access or "readwrite" for read and write access to the directory.

startIn

A FileSystemHandle or a well known directory ("desktop", "documents", "downloads", "music", "pictures", or "videos") to open the dialog in.

Return value

A Promise whose fulfillment handler receives a FileSystemDirectoryHandle object.

Exceptions

AbortError

Thrown if the user dismisses the prompt without making a selection, or if the user agent deems the selected content to be too sensitive or dangerous

Security

Transient user activation is required. The user has to interact with the page or a UI element in order for this feature to work.

Examples

This asynchronous function shows a directory picker and returns a FileSystemDirectoryHandle once selected.

js

async function getDir() {
  const dirHandle = await window.showDirectoryPicker();

  // run code for dirHandle
}

Specifications

Specification
File System Access
# api-showdirectorypicker

Browser compatibility

BCD tables only load in the browser

See also