Showing spinner (PendingComponent) during beforeLoad

[dannyb]

I was doing some testing with the router yesterday. The Pending Component is rendered when loader is taking over 1 second or the configured amount of time. What happens if the beforeLoad of a component takes over 1 second? Is there a way to show a pending component when beforeLoad takes over 1 second? I can't see a way.

beforeLoad blocks the navigation. So it is a good place to do things like checking authorization. I was planning to load the currentUser there. What if that request takes some time? I would like to show a spinner. I have tried several different things, like putting the beforeLoad in a child component. Only thing that shows a spinner (PendingComponent) is if the loader function takes time, not the beforeLoad taking time. If the beforeLoad takes time, it shows an empty screen.

What is the best way to go about this? Looking for thoughts on this, thank you.

[nklhtv]

I am trying to do the exact same thing!. According to the docs:

If this function returns a promise, the route will be put into a pending state and cause rendering to suspend until the promise resolves. If this routes pendingMs threshold is reached, the pendingComponent will be shown until it resolved.

I think we must open an issue for this.

[andrewbellucci]

This seems like a small bug. Thoughts on this? @tannerlinsley

[sir-captainmorgan21]

@tannerlinsley any thoughts on this?

@andrewbellucci or @dannyb have you been able to figure this out?

[jacobgad]

Running into the same issue,
it's especially bad using beforeLoad to do auth checks combined with a serverless cold start