fix: download links cannot be refreshed through js #5105
Conversation
Problem: Reason: As far as I see, when using 'querySelectorAll' will store the whole page and return you the result directly, so the page should be fully-loaded. Sometimes there's problems when using "<Script...beforeInactive>" and I change it to "defer async" so as to speed up the loading of js files as well as to make sure the whole page is loaded, we can change the link instead of partially loading.
|
PS：Another way is to change the querySelector to getElementById(), which will find the real element again and again, no matter whether the page is stored or not (Live in searching). But now it seems to change the loading way of js gets me also fine. |
| @@ -13,7 +12,7 @@ export default function Document() { | |||
| <body> | |||
| <Main /> | |||
| <NextScript /> | |||
| <Script strategy="beforeInteractive" src="/static/js/legacyMain.js" /> | |||
| <script src="/static/js/legacyMain.js" defer async /> | |||
There was a problem hiding this comment.
Why removing the Script tag from nextjs? Which kind o tests you made that resulted in this conclusion?
There was a problem hiding this comment.
Maybe the customized event handlers' problem for listening after all the other js files of next.js are loaded successfully for querySelectoAll()……I also wonder if it's a better solution？
There was a problem hiding this comment.
Not really, it's more like the following:
- The next/link component takes an href argument, which is pretty much what our JavaScript legacy script does, replace the URL
- But the thing is that
next/linkalso sets up "click" events and other kinds of events. These events are managed by a React component, meaning if there's a re-render or whatever the internal logic is, it will ignore our "href" attribute. - Not to mention, "click" event has precedence over "href". So basically, us replacing the "href" probably has no effect at that point in time. Note that I am just making a wild guess here.
But the actual solution is for now to not use next/link, we probably also should not use it for external links, as it was primarily made for internal links.
|
With all due respect, I don't think your PR is fixing anything. |
|
@MaledongGit, my concerns here are the following:
Please, keep these points in consideration. I'm inclined to close this PR, as it doesn't solve any issues, but I want to hear you out, with your points, on why you changed the props of an unrelated component and the |
Do you mean "labels["download-for"] ? Ah yes, this is a typo error and it should be this instead of "labels["download"] in i18n. I'm now inverstigating in it and found the problem, just fix it together. |
Ah yes, I also found it later, can I help to change them? I found there're many external routes in "<Link>", however some of them work properly with console errors, should I change them or just fix this? |
|
In the end, I found it seems we're now having another fix for bugs like this, so I'd close mine. |
Yeah, I wonder why you made the change? 🤔 |
I found there're many external routes in "", however some of them work properly with console errors, should I change them or just fix this? Sure, but I made a PR already hours hours ago hehe |
【Problem】
#5102.
【Reason】
As far as I see, when using 'querySelectorAll', it will first search for the whole page and return you the result directly, sometimes the link name of the element is changed but NOT saved in the storage of querySelector DOM itself.
So A better solution is to search for the element after the DOM frame is loaded without loading the DOM contents...ect.
For more：