fix(nuxt): abort navigation when updating window.location

[nicolaspayot]

🔗 Linked issue

#21314

❓ Type of change

• 📖 Documentation (updates to the documentation, readme or JSdoc annotations)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality like performance)
• ✨ New feature (a non-breaking change that adds functionality)
• 🧹 Chore (updates to the build process or auxiliary tools and libraries)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

On client side, when we use the navigateTo function to redirect to an external URL from a middleware (and when the Nuxt application is hydrated => while navigating from NuxtLink or navigateTo, ...), we abort the navigation so that the page component is not rendered before location changes.

Resolves #21314

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.

[nicolaspayot]

There is a corner case that's not handled here: when the Nuxt app is loaded on a route that has a redirect middleware. The page gets rendered (and is visible during a very short time) before the location changes. If we also return false when nuxtApp.isHydrating, it renders a 404 error / page (that's visible during a very short time).

There's something we could do: delay the return statement, like so, for example:

if (!nuxtApp.isHydrating) {
  return false
}
return new Promise(resolve => setTimeout(resolve, 10))

But it looks a bit hacky 🤔

[danielroe]

I wonder what happens if you return a never-resolving promise 🤔

[nicolaspayot]

I actually think that's what's happening with return new Promise(resolve => setTimeout(resolve, 10)) as the location changes before the resolve function gets called.

I like the idea of returning a never-resolving promise (return new Promise(() => {})) for this case 👍

[nicolaspayot]

@danielroe I've pushed the change. Let me know if this is acceptable. I can't see a case when this would lead to an issue. Maybe if, somehow, location.href = toPath or location.replace(toPath) fail but can this happen?

[danielroe]

Thank you so much ❤️