Issues when redirecting to root route

[n00ki]

Hey :)

So I've recently decided to make my SvelteKit projects just a bit less dependent on JavaScript (I do understand the irony, yet isn't that just a beautiful thing to be able to say? 😎 ) sveltekit-flash-message quickly became a crucial addition to my toolbox as I'm trying to create equivalently great interfaces for both JS-enabled/disabled environments, and I believe this is a great opportunity to thank @ciscoheat once again for his amazing work on both sveltekit-flash-message and sveltekit-superforms. these are absolutely fantastic solutions for meaningful problems!

I did find a possible issue, though: When redirecting to the root route using the custom redirect helper, and client-side isn't directly involved (Implementing a logout form action, for example) - flash messages aren't displayed. refreshing the page makes the message appear (I suspect the load function gets retriggered, hence the update). redirecting to any other route works as expected. The same behavior was noticed when trying to redirect to root after form submissions with actual data validation (login, for example), yet that was fixed by setting flashModule as the module on the client side (in superForm options). i also tried to hack a workaround by redirecting to the same URL and triggering the load function which redirects again to the root route with the flash message using invalidateAll. still, nothing.

Any ideas? am I missing something here?

[ciscoheat]

Hey, thank you so much for your kind words. :)

If the flash message appears after refresh, it's a sign that the request wasn't detected as a server-side request, so it is kept for the client to handle, which in your case won't do anything since there is no javascript active on the page? Very strange that it happens only on the root route.

Here is the client request detection: https://github.com/ciscoheat/sveltekit-flash-message/blob/master/src/lib/server.ts#L37-L53

Can you look at the request and see if it for some reason matches the client request detection here?

[n00ki]

When logging the request, I see that sec-fetch-dest is empty, and accept is */*. You pointing me in this direction was very helpful, though. It seems like using enhance on the form was the root cause of this issue.

Removing use:enhance from the form solved it immediately.

        <form
          id="logout"
          action="/logout"
          method="POST"
          use:enhance={() => {
            return async ({ result }) => {
              await applyAction(result);
              invalidateAll();
            };
          }} />

// to

        <form
          id="logout"
          action="/logout"
          method="POST"
         />

even though it works, i still wonder why it is happening...? and why exclusively when redirecting to root?

[ciscoheat]

If you're using SvelteKit's use:enhance, you need to update the flash message in the callback: https://github.com/ciscoheat/sveltekit-flash-message#example-1-enhance

[n00ki]

If you're using SvelteKit's use:enhance, you need to update the flash message in the callback: https://github.com/ciscoheat/sveltekit-flash-message#example-1-enhance

I'm really not sure how I managed to miss that part in the docs🤷‍♂️sorry for that. Although still quite baffled by the fact it only happens when redirecting to root, my best guess is that it has something to do with my specific project setup. I'll try to find out what exactly is going on...

Anyhow, thanks again for being so communicative and for truly helping us all!