hotwired / turbo

The speed of a single-page web application without having to write any JavaScript
https://turbo.hotwired.dev
MIT License
6.69k stars 423 forks source link

progressBarDelay not working when Back press #1058

Open gengamer opened 11 months ago

gengamer commented 11 months ago

I set progress bar delay to 2000 by changing this.progressBarDelay(500 to 2000). Turbo cache control no cache. It works when visiting new pages by clicking links or forms. But if back button pressed, Progress bar immediately showing instead of 2000 delay. Additionally, tried Turbo.setProgressBarDelay(2000); but not working on back press.

jaredcwhite commented 10 months ago

I'm seeing this same issue as well. Why was this closed? @risinginsider Did you find a workaround?

gengamer commented 10 months ago

@jaredcwhite I am using nprogress to get full control over the progress bar. https://github.com/rstacruz/nprogress/

zavarock commented 3 months ago

Workaround in case someone is interested:

let turboPopstateProgressBarTimeoutId;

window.addEventListener('popstate', (event) => {
    if (event.state.turbo) {
        Turbo.session.adapter.progressBar.progressElement.hidden = true;

        if (turboPopstateProgressBarTimeoutId) {
            clearTimeout(turboPopstateProgressBarTimeoutId);
        }

        turboPopstateProgressBarTimeoutId = setTimeout(() => {
            Turbo.session.adapter.progressBar.progressElement.hidden = false;
        }, Turbo.session.progressBarDelay);
    }
});