Python EEL: Changing button label during script running

Question

I have a script that compiles a bunch of files from diferent directories into one xlsx sheet. I am creating a front-end to it so I can share it with my coworkers, and while I have print statements throughout my code I want some feedback on my GUI.

I need the button to change the label during code execution, this is what I tried:

function getstarted(){
    document.getElementById("buttonstart").value="Running...";
    eel.myfunc();
    document.getElementById("buttonstart").value="Done!";
}

This of course isn't working, since javascript isn't waiting for my eel function to finish processing to change the value again. Any ideas? Thanks in advance

Answer 1

If you make the function asynchronous, you can ask to await the response from Eel.

async function getstarted(){
    document.getElementById("buttonstart").value="Running...";
    await eel.myfunc()();
    document.getElementById("buttonstart").value="Done!";
}

If you don't want to use an asynchronous method, another option is to put the code that runs after into another method that Eel calls when it is done.

function getstarted() {
    document.getElementById("buttonstart").value="Running...";
    eel.myfunc()(getstarted2);
}

function getstarted2() {
    document.getElementById("buttonstart").value="Done!";
}