Error on uploading files to multi-document field

I have a upload button on my page that it needs to upload a file to a multi document field, but it always ends up with an error undefined. Here’s the code I am currently using:

$w ( ‘#uploadButton’ ). onChange (() => {
if ( $w ( ‘#uploadButton’ ). value.length > 0 ) {
$w ( ‘#uploadButton’ ). uploadFiles ()
. then ( async ( file ) => {
await wixData . get ( ‘myCollection’ , id). then ( async ( res ) => {
res.multiDocumentField = [… res.multiDocumentField , file [ 0 ]. fileUrl ];
await wixData . update ( ‘myCollection’ , res );
});
}). catch (( err ) => {
console . log ( File upload error: ${ err.errorDescription } ); ← here it returnes undefined
});
} else {
console . log ( ‘Select a file’ );
}
});

It is not immediately clear to me which async operation is causing the error. It could be due to various factors including collection permissions.

I would recommend refactoring this handler to be able to catch errors even if they happen in a inner chain.

Here’s a example that should help you find the cause of the issue (might need to be modified slightly to work):

$w('#uploadButton').onChange(async () => {
    if ($w('#uploadButton').value.length > 0) {
        try {
            const file = await $w('#uploadButton').uploadFiles();
            const res = await wixData.get('myCollection', id);
            res.multiDocumentField = [...res.multiDocumentField, file[0].fileUrl];
            await wixData.update('myCollection', res);
        } catch (err) {
            console.log(`Error: ${err}`);
        }
    } else {
        console.log('Select a file');
    }
});

This works Thomas! Thank you very much!