next(false) clears path on global Navigation Guards

[daniil4udo]

Version

3.6.5

Reproduction link

codesandbox.io

Steps to reproduce

• Run reproduction
• Switch to some route other then '/' (i.e. /route2/)
• Refresh the page

You'll notice that path gets cleared for a few ms (but still visible) in the big apps it happens for longer period of time

What is expected?

Path not gets cleared
(change next(false) to next() and you'll see how it should be)

What is actually happening?

App ends up in the root for awhile

[posva]

You cannot call next() multiple times. Use return in front of them to avoid this problem.

Remember to use the forum or the Discord chat to ask questions!

[daniil4udo]

@posva, sorry my bad in the example, but I found the reason behind my "path flashes", it's ensureURL method in the HTML5History class.

// next(false) -> abort navigation, ensure current URL
this.ensureURL(true)

If we take a look at this method

ensureURL (push?: boolean) {
  if (getLocation(this.base) !== this.current.fullPath) {
    const current = cleanPath(this.base + this.current.fullPath)
    push ? pushState(current) : replaceState(current)
  }
}

if I try to go straight to the restricted path, at some point, in my app I have next(false), that causes half-second absolutely clear URL.

When I logged vars in this method I noticed that it pushes to to url WITH aborting navigation.

When I commented that ensureURL(true) app worked as expected without annoying flashes.

Could you plz explain why do we need it?