search

denoland / fresh

The next-gen web framework.
https://fresh.deno.dev
MIT License
12.24k stars 626 forks source link

Handling `beforeunload` with Partials enabled makes no effect #2519

Open palpfiction opened 3 months ago

palpfiction commented 3 months ago

Hello! First of all I want to send a huge "thank you" to everyone collaborating in this project.

While trying to handle the beforeunload event in an island (to show a confirmation dialog before the user leaves the page) I noticed that it didn't do anything. I finally noticed that it stopped working when enabling Partials in my app, so it seems that's the issue.

Is this something expected when working with Partials? Is there a workaround that I can use to have Partials enabled + handling the beforeunload event?

Thank you very much!!

How to reproduce

I created a example repository with the minimal Fresh app handling the event to show a confirm dialog:

https://github.com/palpfiction/fresh-beforeunload-with-partials

The main branch doesn't use Partials and shows it working correctly when navigating. In the branch using-partials you can see that the confirm dialog doesn't show up anymore when navigating to the other page.

marvinhagemeister commented 3 months ago

The browser only dispatches when "leaving" the page and a new full page load is happening. This is not the case with client-side routing as there is no full page load. We could dispatch an event when a new partial is requested, but there would still be some user code required to detect whether the partial is for the whole page or just a random small area on it. Fresh has no information what the partial in question represents.

palpfiction commented 3 months ago

That makes sense, thank you very much! Is sending events when requesting or loading partials something already planned or tracked in another issue?

Sleepful commented 1 month ago

@palpfiction you could listen to the click event propagation, as the partials do:

https://github.com/denoland/fresh/blob/main/src/runtime/client/partials.ts#L76

but this only tells you that the partial-enabled link was clicked, it doesn't stop the partial from loading (e.g. if you want to display a warning before letting a partial load)

Sleepful commented 1 month ago

this issue might be related to: https://github.com/denoland/fresh/issues/2234