htmx
htmx copied to clipboard
bigskysoftware
Long running request pushes URL after navigating away via a boosted link
Hi. I have a long running XHR GET request, triggered by htmx, with hx-push-url="true". If this request is in-flight and I navigate to another page via a boosted GET link, I'm seeing the URL pushed from the previous long running request, after it completes.
Timeline:
- Long running XHR GET request triggered with
hx-push-url="true". Window URL changes to/page1. - User clicks on boosted anchor. Window URL changes to
/page2. - Long running request completes. Window URL changes to
/page1.
I've tried to listen to the htmx:beforeOnLoad event and block this URL push, but this doesn't work. I think it's because the event after the long running request is raised on the body of the previous page, which was removed after boosted request replaces the body.
<!--This does not work-->
<body x-data
@htmx:before-on-load="
if ($event.detail.pathInfo.path !== location.pathname && !('HX-Boosted' in $event.detail.requestConfig.headers)) {
$event.preventDefault();
}">
Great work on htmx btw. Thank you!
Sorry to take so long to respond to this. I have just started thinking about an hx-sync attribute that helps deal with this:
https://gist.github.com/1cg/785a98742b10cfd67d421d9d8f42f918
