We have a React application using Next.js. My understanding is NextLink works by adding a click event to the element, stopping normal navigation and letting the router handle it instead. For example:
<Link href="/app/page">
<a id="my-link">Go here</a>
</Link>
This sends up being rendered as an <a> tag with a click and onClick event. When the user click the link, the event uses preventDefault() and then handles navigation. Without using NextLink, the router would not be used and navigation would reload the application/state/etc.
So we wanted to manipulate our UI programmatically with a script loaded with the browser dev tools for testing purposes. We noticed that if you do something like this:
document.getElementById("my-link").click()
The Next router is effectively bypassed. Why is that the case? Shouldn't triggering the click event like this be the same as the user clicking an element?
