Return statement in onReady() page event handler

Ask the community
,
1

I experienced this drawback. For some unjustified reason, I put a return statement in the onReady event handler of a page. Usually, that does not cause any issue in Preview.

By exception, if the return-ed function is a lightbox open statement (wixWindow.openLightbox), or is a promise and its .then() method includes a lightbox open statement, there are the conditions because Preview stalls out.

Preview stalling causes Editor almost completely blocked, and Editor page refresh is required.

Removing the useless return statement from onReady(), everything is OK.
Is this a Preview issue or is there something that I should know reading a good article?

Tks for advise

//sandbox

import wixWindow from 'wix-window';                                                           
    
/*
$w.onReady(function () {    
    
    wixWindow.openLightbox( "Test Lightbox", {} )             // <--- no problem this way 

});  
*/

/*
$w.onReady(function () {    
    
    wixWindow.openLightbox( "Test Lightbox", {} )             // <--- no problem this way 
        .then( () => {
            console.log("Everything OK");                                       
        })

});  
*/
/*
$w.onReady(function () {    
    
    return wixWindow.openLightbox( "Test Lightbox", {} )      // <--- Preview stalls out this way 
        .then( ( results ) => {
            console.log("Everything OK: ", results);
            return results;
        })
        .catch( (err) => {
            console.log(err);
        }); 

});  
*/
/*
$w.onReady(function () {    
    
    testPromiseIncludingLightbox()                            // <--- no problem this way 
        .then( ( answer ) => {
            console.log(answer);                                                
        })
});

function testPromiseIncludingLightbox() {
    return wixWindow.openLightbox( "Test Lightbox", {} )                        
        .then( ( results ) => {
            console.log(results);
            return results;
        })
}
*/

$w.onReady(function () {    
    
    return testPromiseIncludingLightbox()                     // <--- Preview stalls out this way 
        .then( ( answer ) => {
            console.log("Answer: ", answer);
        })
});

function testPromiseIncludingLightbox() {
    return wixWindow.openLightbox( "Test Lightbox", {} )                        
        .then( ( results ) => {
            console.log("Everything OK: ", results);
            return results;
        })
}

/*
$w.onReady(function () {    
    
    return testGenericPromise()                               // <--- no problem this way 
        .then( ( answer ) => {
            console.log("Answer: ", answer);
        })
});

function testGenericPromise() {
    return new Promise(
        function(resolve) {
            setTimeout(resolve, 1);
        }
    );
}
*/
2

Well first of all → i hope you do NOT have all these on-Readys in your code (eleminate them all until you have just one remaining).

Second, working with lightboxes, you have the “CONTEXT” to communicate between PAGE & LIGHTBOX…
https://www.wix.com/velo/reference/wix-window/lightbox-obj/getcontext

…and third…

I don’t know, perhaps this to your question…(what ever this shall be)

$w.onReady(async function() {let xxx = await testPromiseIncludingLightbox(); console.log(xxx);});

function testPromiseIncludingLightbox() {
    return wixWindow.openLightbox( "Test Lightbox", {} )                        
        .then(( results ) => {
            console.log("Everything OK: ", results);
            return results;
        })
}
3

Tks Velo-Ninja
Following your indexed list of answers:

  1. No, this is a sandbox file where I added many different versions of the unique onReady() event handler used on the page. Anyway, no one of those is the “real” onReady(). They are just examples of different tests

  2. getContext() is used for communication to the lightbox. Here we are discussing communication back from the lightbox

  3. Just tested: using async/await with lightboxes, Preview stalls out again.
    Seems that if the onReady() event handler has to wait for the lightbox closing, Preview stalls, not depending on the way the waiting is implemented.

$w.onReady(async function () {
const results = await testPromiseIncludingLightbox();
// <— Preview stalls out this way
console.log( results );
});

function testPromiseIncludingLightbox() {
return wixWindow.openLightbox( “Test Lightbox”, {} )
.then( ( results ) => {
console.log("Everything OK: ", results);
return results;
})
}

As I demoed with the list of tests, luckily I solved appending everything has to be done in the .then() method of the promise called by onReady(), and leaving the onReady() execution free to progress to the end with no pause.

My only question is why Preview stalls in that case, and not simply keeps working giving some useful warning, that is exactly what Preview is expected to do