I used to handle file downloading by creating an anchor element and clicking on it:

exports.saveBlobAsFileImpl = blob => filename => () => {
    var a = document.createElement("a");
    var url = URL.createObjectURL(blob);
    a.href = url;
    a.download = filename;
    document.body.appendChild(a);
    a.click();
    setTimeout(function(){
        document.body.removeChild(a);
        window.URL.revokeObjectURL(url);
    }, 100);
    return true;
};

(don't mind that the function is curried, it's because the function is exported to PureScript). It works nicely but the downside of it is that it is always downloaded to the default location, and the user cannot overwrite the filename given. So I turned to the new FileSystem API:

exports.saveBlobAsFileImpl = blob => filename => () => {
  window.showSaveFilePicker({ suggestedName: filename })
    .then(fileHandle => fileHandle.createWritable())
    .then(stream => {
      stream.write(blob);
      stream.close();
    })
    .catch(err => console.log("SaveFile aborted"));
    return true;
};

It also works fine (the user chooses the directory and can change the default hardcoded filename). However, now he is unable to open the file right away, as it isn't shown the way downloaded files are (on the bottom of the screen in Chrome). He has to open the file explorer on the folder he downloaded it to, and open from there.

Here is my question: can I have the advantages of both worlds, i.e. ability of the user to select a folder to which he wants to download the blob and overwrite the filename if necessary, and show the downloaded file on the bottom of the screen so the user can open it right away?