event.preventDefault in react-router-dom is not working in Chrome and Firefox

[kambing86]

found this issue recently, the a tag generated by Link component will sometime refresh the whole page when the link is clicked, and it's not 100% happened, sometimes it works as expected, but sometimes it refreshes the whole page

I think this issue most likely is related to browser, but just want to know anyone facing the same issue, and if so, is there anyway to solve it?

[timdorr]

Without an example of this, it's basically impossible to check if it's a legitimate bug. We check for default being prevented, so it's a specific case we're handling. I tend to think it's something specific to your app, not the library.

[kambing86]

thanks for the reply, found the issue over the weekend, it was some analytic scripts from the google tag manager that integrated in the page causing the issue

[thedivac]

@kambing86 Can you elaborate a little more about what caused the issue? I am experiencing the same issue and tracked it down to GTM, but I can't figure out what exactly is causing the issue and how to fix it. thanks!

[thedivac]

So for anybody stumbling on the same issue in the future: React Router didn't work for me in cases where Google Tag Manager fired a "click" event for internal links. I am not sure what exactly is causing the issue, but I fixed it by removing these events from GTM

[kambing86]

@thedivac sorry for late reply, the GTM actually tracked and intercepted all the a tag including the one Link generated, so any script in the GTM that is binded to the link will be executed, and might cause weird issue

for my case, one of the script throws error, and react-router didn't catch the error, so the link became a normal link without preventDefault

[kambing86]

@timdorr not sure should react-router catchs the error, but I don't think is a common issue, just FYI

[StringEpsilon]

@kambing86 This should be fixed via #6711 in the next release.