Accessing the parent of FileSystemFileHandle

[orlovushek]

There is no method to request the parent of FileSystemFileHandle.
Some use cases:

1. There is no ability to remove the file from the handle, so it's required to access the parent in order to call FileSystemDirectoryHandle.removeEntry(). This will allow the files opened with PWA (via file_handlers) to be removed from within PWA.
2. There is no ability to access other files in the same directory. For example consider the photo opened with PWA (image viewer) and the user wants a) to navigate to the next/previous photo in the directory or b) to browse/list all the other photos within same directory.

[jesup]

The ability to get the Parent of an item is a common FileSystem API point

[a-sully]

This was discussed in WICG/file-system-access#193 (and WICG/file-system-access#373, which seems like the same request as 2)

This comment provides context as to why we've been hesitant to provide this method, though the arguments there are more relevant to files picked outside of the OPFS. I wonder if something like what's proposed in WICG/file-system-access#378 would be more useful than just access to the parent, since combining this with the resolve() method would give a pretty straightforward way to acquire a handle to any path under the root directory

[jesup]

The comments you point to discuss a number of issues that don't apply to OPFS (since you don't get handles from a picker); we always know and can easily return the parent of a file or directory and there are no permission issues.

Yes, direct path access (like in #378) would definitely be useful for reasons outside of this issue. You could implement parent() as resolve, strip the last entry, and the getdirectoryhandle using #378. This would work; it might be more expensive though, since it requires walking to the root and then back again.

Why does it have to be so complicated for such a simple requirement as requesting parent folder(s) of files.

My js application saves location of local video file in order to access it upon subsequent import of a json file. I export something like: localhost:8080/Assets/Media/Video/myvideo.mp4, but I need now to provide sub-folders inside the "Video" folder in order to better manage media content. I must know the sub-folder name (which is a parent directory of media file) in order to save it as a string, alongside the media file's name like so: "ParentFolder/myvideo.mp4". The File System Access API must provide for such an option -- I'm certainly not going to have to force user to write -- via a dialog box - which parent folder he/she/it is using, at each and every media list iteration.

SOLUTION: If the API provides the parent folder name of video file that I can include in my json export string, then when I import the json file back into my app, the saved string "ParentFolder/myvideo.mp4" will be appended to "localhost:8080/Assets/Media/Video/" located in my app in order for the video to be playable at any time, on user demand, for as long as the video still exists in that folder, of course.

So I'm not asking for much, this API allows more flexibility, but stops short of providing the basic feature I request: Knowing the parent folder of a media file, or, knowing the relative path of sub-folders leading to the media file without exposing the whole local url of the media file.

Am I missing something here? I have implemented the following sample located at https://web.dev/patterns/files/open-one-or-multiple-files/#the-modern-way and would sure love to know where I must insert code that exposes the parent folder of media file. I am not using this API for writing, moving, deleting, creating, etc folders and/or files, I simply need to read the "ParentFolder/file-name.ext" portion of a local url, is that possible? Thanks in advance for swift reply.

[tomayac]

@danavangard It's (maybe unfortunately) not possible to get information about the parent folder of a file for the reasons outlined in WICG/file-system-access#193 (comment). On top, it could potentially also be revealing private information. Imagine a file hierarchy like /Users/thomassteiner/video.mp4. If you have access to video.mp4 and are able to know its parent folder thomassteiner, this might reveal to your app my real name (one could at least imagine an attack vector where an evil actor would match folder names against known name, first name + lastname, first letter of first name + lastname, etc. combinations).

For your concrete problem, I think what might work is ask for access to a directory via showDirectoryPicker() instead. The user can then grant access to their Movies folder and you can work from there and can list the contents of the folder. You can even fine-tune the starting point to be the default OS-defined Movies folder by passing a startIn parameter:

const directoryHandle = await showDirectoryPicker({
  startIn: 'videos',
});

The relevant pattern is explained in How to open a directory.

💡 Bonus tip: I maintain a library called browser-fs-access that abstracts this pattern (and other file patterns) as a convenience function called directoryOpen().

Back to @orlovushek's original points:

1. There now is a remove() method directly on FileSystemHandle, so it works on both files and directories (see Add FileSystemHandle.remove method #9, already implemented in Chrome).
2. This use case would be better addressed by getting access to the parent directory, similar as outlined a few lines above, the startIn parameter could be used to start the dialog in 'pictures'.

@tomayac Awesome! I will try the showDirectoryPicker() solution as you mentioned above. I will also check out your browser-fs-access library in order to keep things simple, updated, and reliable (am a newbie at this). Question: Once the directory is accessible, can I still multiple select some files within?