My countup function worked satisfactorily. But then I wanted to add ready, steady, go. That is, give the user 3 seconds to shift their attention from the button on the screen to the test on their sheets of paper.

So, what I need: ready, steady, go beeps, then a timer starts counting.

Code

var ready_steady_go_counter = 0;

jQuery(function(){
    jQuery('#timer-form').on('submit', function(event){        
        event.preventDefault();        
        initiate_minutes();

        const ReadySteadyGoPromise = new Promise((resolve, reject) => {
            function ready_steady_go(){
                setTimeout(function () {
                    
                    if (ready_steady_go_counter > 2) { // Ready (0), steady (1), go (2);                        
                        return;
                    } 
                    
                    beep();
                    ready_steady_go_counter++;
                    ready_steady_go(); // <--- this is the "loop"        
                }, 1000);
            }
            ready_steady_go();    
        });        

        ReadySteadyGoPromise.then(countup, function(){console.log("Alert (timer)!")});        
        remove_submit_button();
        show_planned_times();
    });
});


function tick() {
    datediffInms =  new Date() - startDateTime;    
    seconds_lapsed = Math.round(datediffInms / 1000);
}


function countup() { 
    setTimeout(function () { // Breakpoint.
        if (stopped) return;
        if (!is_paused()) {
            tick();
            show_time_left();            
        }
        countup(); // <--- this is the "loop"
    }, 1000);
}

Problem

Ready, steady, go really beeps as planned. But countup doesn't start. I have marked where a breakpoint is situated with // Breakpoint.

So, the interpreter doesn't stop at the breakpoint. This means that counting up has not started.

How can I complete my task?