Renaming / moving files using File System Access API (javascript)

Question

I've been following this article to allow users to (semi) automatically save a client side generated XML file to a specific local folder. A third party program is watching this folder and will process its contents and output content in another file.

Problem is that it takes about 250 ms from the file is created until the content is actually written to the file using the close() method.

Sometimes the third party program will detect the file has been created and try to read its contents before its written. The program does not support adding a delay before trying to read the file content.

I've looked into writing the file to a temporary location and moving it once its closed, but this does not seem to be possible with this API. The same goes for renaming the file.

Creating / downloading the file using a normal dialog would probably work, but this requires manual steps that can be avoided using the file system access API.

Another solution would be to install a local program that can move the file from a temporary folder to the program watch folder when its closed, but I would rather avoid having to install software on the client.

Is there any other way to avoid this issue?

Thanks

Answer 1

There is now a way to rename and move files (currently implemented in Chrome behind the experimental web platform features flag):

// Get references to a file and a directory.
const [file] = await showOpenFilePicker();
const directory = await showDirectoryPicker();

// Rename the file.
await file.move('new_name');
// Move the file to a new directory.
await file.move(directory);
// Move the file to a new directory and rename it.
await file.move(directory, 'newer_name');

You can follow the spec work by subscribing to this PR.

Note that, confusingly, unflagged Chrome does have the .move() method on all file handles (not just OPFS ones), but using it throws a "User aborted a request" error.