solid-start icon indicating copy to clipboard operation
solid-start copied to clipboard

[Bug?]: Error in preload route cause router to go back to previous page

Open buddamus opened this issue 1 year ago • 1 comments

Duplicates

  • [X] I have searched the existing issues

Latest version

  • [X] I have tested the latest version

Current behavior 😯

If an error occurs on the prefetching of the route data, the user is redirected back to the previous page even though the URL in the browser shows the user landing at the destination.

For example,

  • User is at ?page=1
  • User navigates to ?page=2 but gets an error
  • ?page=2 remains in the browser window but data from ?page=1 gets displayed again

Expected behavior 🤔

User should land on the target route (and that target page's error handling will take over)

Steps to reproduce 🕹

Steps:

  1. Create a simple route prefetch that throws an error: export const route = { preload({ location, params }) { if(params.page == 2){ throw('Testing this'); } } } satisfies RouteDefinition;
  2. Load the app on a page that will not error
  3. Click a link that triggers navigation to the error prone route

Context 🔦

I am testing out my error messaging and ensuring my components are displaying that an error exists. Note: wrapping the prefetch in a try/catch gets me around the problem but I think I shouldn't have to do this.

Your environment 🌎

No response

buddamus avatar Aug 24 '24 14:08 buddamus

I'm going to ask for a reproduction. I'd expect ErrorBoundary to be able to catch this. Albeit happening during routing it will be one up by the router. If it is not being caught by an ErrorBoundary then we have an issue. Also preload function may load on a preload event like a hover or as we enter the route, these impact how they error. I suppose a sync error might be handled differently than an async one which may be the source of the issue.

ryansolid avatar Sep 25 '24 21:09 ryansolid