Return the directory handle after a directoryOpen

[Amatewasu]

Hi,

It would be great to allow us to retrieve the directory handle after a directoryOpen like what is done with fileOpen. Thus, we could save a file in that directory.

Have a great day!

[tomayac]

Thanks for the suggestion. Just released v0.17.2 that includes this. Look for a directoryHandle property on the files returned by directoryOpen().

[Amatewasu]

Great! Thanks a lot!

[Senne]

How would you actually use the directory handle in this case? The parameter existingHandle in fileSave only accepts a file handle, so I'm still confused on how to save a file directly to a directory…

[tomayac]

You can pass a FileSystemHandle (that is, either of FileSystemFileHandle or FileSystemDirectoryHandle) as the startIn parameter per the spec. In browser-fs-access, it would look like this for example:

const directoryHandle = getPreviouslyObtainedHandle();

const options = {
  startIn: directoryHandle,
};
const blobs = await fileOpen(options);

It can indeed be both, a file or a directory handle. Here's the relevant part of the spec:

1. If entry is a file entry, and a path on the local file system corresponding to the parent directory if entry can be determined, then return that path. 1. If entry is a directory entry, and a path on the local file system corresponding to entry can be determined, then return that path.

[Senne]

Thanks for clarifying, Thomas. I was under the assumption that from the moment you have a directory handle you can save new files to that directory without having to show a picker to the user again. In my particular case this would have been useful to automatically store large assets (video, audio, images, …) in a dedicated folder rather than having to encode and store them in a single file I already have access to, for example as Base64 strings in a granted JSON file. But I understand that's not what the File System Access API was designed for.

[tomayac]

You can absolutely do this today. Go to https://vscode.dev/, open a local folder, then create a new file or folder and the app will ask you if you want to grant write access to the local folder and then go on and create the new file or folder.

[tomayac]

Check out this article section on how to do this. Note that this is of course no longer polyfillable with browser-fs-access.

[Senne]

Oh perfect, that's exactly what I was looking for. Thanks so much!