Renaming a File() object in JavaScript

Now that file.name is a read-only property, I've found this to be the best method to rename a File object in the browser:

const myNewFile = new File([myFile], 'new_name.png', {type: myFile.type});

try this:

var blob = file.slice(0, file.size, 'image/png'); 
var newFile = new File([blob], 'name.png', {type: 'image/png'});

note: this is for a image type, you have to change this type with type you're actually using.

In response to Alexander Taborda's answer... The first and second parameters of Blob.slice() are the start and end bytes of the original blob that should form the new blob. By saying:

var blob = file.slice(0,-1);

you are not saying "copy to the end of the file" (which is what I think is your aim), you are saying "copy the whole blob except the last byte".

As @carestad says

var blob = file.slice(0, file.size);

followed by creating a new File() object should create an exact copy with a new name.

Note that with a png, the file will be considered invalid without the final byte.

From: https://developer.mozilla.org/en-US/docs/Web/API/Blob/slice

You can use

FileSystemEntry.moveTo(newParent[, newName][, successCallback][, errorCallback]);

to rename a file or directory.

It's from MDN : https://developer.mozilla.org/en-US/docs/Web/API/FileSystemEntry/moveTo

Assuming f is original file object, just use spread operator, example of regexing the name:

let newF = {
        ...f,
        name: f.name.toString().replace(/[^0-9A-Za-z.\-_()]/gi, '')
      };