Still struggling with promises and arrow functions

Ask the community
,
1

I’m calling a function in BackEnd.jsw to write some data to get round user permissions, and then using code in the page to update a dataset after the data has been written. Async / await looked like a good way round it, but it falls foul of the 14 second rule in the real application - it turns out that database actions using async / await are sloooooow.

So, I’ve written a small test function that accepts a value from an Input box and writes it to a record and field populated from the onClick event of a table containing data. The value is supposed to appear in the table when it is subsequently refreshed by the code.

/*
 Front end code
*/

export function btnSet_click(event) {   
 let ToUpdate = {
     "record": ("00" + (displayData.row).toString(10)).substr(-2),
     "field":  displayData.column,
     "value":  $w('#inputValue').value
    }
 console.log(ToUpdate);
 UpdateData(ToUpdate)
    .then ((updated) => {
         if (updated) {
            $w('#dynamicDataset').refresh();
            console.log("Refreshed");
        } else {
            console.log("No update needed")
        }
    });
}

/*
  Backend code
 */
 
 export function UpdateTable (ToUpdate) {

 let options = {
     "suppressAuth": true,
     "suppressHooks": true
    };
 let updated = false;

  //Funny place for a return just below, but necessary because the arrow function is, well, a function
  //Get can be used like this because records were created with _id = 00 .. 20
 
    return wixData.get("DataTable", ToUpdate.record)  
        .then ((updateRecord) => {

 // Check if the required value is already there - for example, clicked Set twice. If so, no further action

     let existingValue = updateRecord[ToUpdate.field];
     if (existingValue == ToUpdate.value)  {
                updated = false;
                return updated;
            }       
 // If necessary, do the update

            updateRecord[ToUpdate.field] = ToUpdate.value;
            wixData.update("DataTable",updateRecord,options);
            updated = true;
            console.log("Updated");
            return updated;
        });
}

The good news: value of updated is properly returned
The bad news: the console log shows “Refreshed” before it shows “Updated”

In my limited understanding, wixData.get returns a promise so the .then in the front end should not fire until the data has been updated. But the console log suggests otherwise.

Do I need to do something to make updated, as returned by the back end code, into a promise?

Or what else did I get wrong??

2

You’re missing a return before the wixData.update() on your backend.
Something like:

//...code..
return wixData.update("DataTable",updateRecord,options);
})
 .then( () => {  
            updated = true;
            console.log("Updated");
            return updated;
        });
}
3

Thank you very much, @jonatandor35 ! I can now close about a dozen browser windows with information about promises that have been open for several days. Let’s hope it will be a while before I have to open them all again.

On reflection, there is nothing odd about the return statements. They are just …

return function ( stuff );

… for a comparatively large amount of stuff.

As a small follow-up that others may find useful, I think console.log() has some random latency and is therefore a blunt instrument for checking sequences of events that come within a fraction of a second of each other.

console.log("Refreshed",stamp.getTime() % 10000);

… reveals that things are now happening in the right sequence, even if the slightly later time is logged before the slightly earlier time.