mkdocs-material: Instant navigation breaks third-party URLs
- I’ve read the [contribution guidelines][1] and agree with them
I’ve found a bug and checked that …
- … the problem doesn’t occur with the default MkDocs template
- … the problem is not in any of my customizations (CSS, JS, template)
- … the documentation does not mention anything about my problem
- … there are no open or closed issues that are related to my problem
Description
Enabling navigation.instant
modified Isso requests URLs on first load. A page reload restores them.
Expected behavior
Requests are sent to usual URLs
Actual behavior
Requests are sent to a non existent URL
Steps to reproduce the bug
My website has https://example.org/mkdocs/ set as site_url and loads on every page the following Isso code:
{% block disqus %}
{% if not page.is_homepage %}
<script data-isso="https://example.org/comments" src="https://example.org/comments/js/embed.dev.js"></script>
<section id="isso-thread"></section>
{% endif %}
{% endblock %}
The file embed.dev.js
is the minified version of this attached file: embed.dev.js.txt. It generates URLs from the “data-isso” attribute.
Without navigation.instant
, comments are properly loaded:
- First load
Code | Method | URL |
---|---|---|
200 | GET | https://example.org/mkdocs/PAGE |
200 | GET | https://example.org/comments/js/embed.dev.js |
200 | POST | https://example.org/comments/count |
200 | GET | https://example.org/comments/?uri=PAGE&nested_limit=5 |
- Page Reload
Code | Method | URL |
---|---|---|
200 | GET | https://example.org/mkdocs/PAGE |
200 | GET | https://example.org/comments/js/embed.dev.js |
200 | POST | https://example.org/comments/count |
200 | GET | https://example.org/comments/?uri=PAGE&nested_limit=5 |
I noticed that by enabling navigation.instant
the request URLs appear modified (XHR interceptor?), but only at the first load of the page.
A user has has in fact to press F5 everytime he changes page, otherwise he will see the comment section, but he won’t be able to create or load comments.
- First load
Code | Method | URL |
---|---|---|
200 | GET | https://example.org/mkdocs/PAGE |
200 | GET | https://example.org/comments/js/embed.dev.js |
404 | POST | https://example.org/assets/javascripts/bundle/count |
404 | GET | https://example.org/assets/javascripts/bundle/?uri=PAGE&nested_limit=5 |
- Page reload
Code | Method | URL |
---|---|---|
200 | GET | https://example.org/mkdocs/PAGE |
200 | GET | https://example.org/comments/js/embed.dev.js |
200 | POST | https://example.org/comments/count |
200 | GET | https://example.org/comments/?uri=PAGE&nested_limit=5 |
I have tried with clean MkDocs directories multiple times and the problem always (and only) appears when enabling instant navigation.
Package versions
- Python:
3.9
- MkDocs:
1.1.2
- Material:
7.0.0
System information
- OS: any
- Browser: any
About this issue
- Original URL
- State: closed
- Created 3 years ago
- Comments: 20 (15 by maintainers)
b6779114 now preserves all attributes of the
script
tag. This might fix the issue.Here’s the same zip I mailed you, also in case @polarathene would like to give it a try: material-isso.zip
Please go back and forth between “home” and “test”, so you can see the actual behaviour. By reloading a page you will see that the error is gone. The file javascript file of the “src” attribute is always loaded properly, the URLs that are modified are the ones generated by that file.
First load:
Page reload:
@polarathene they are not properly equal because they appear to the browser as different origin. I whitelisted 127.0.0.1 because I thought he was going to use the URL printed by
mkdocs serve
, which I used to reproduce the issue locally, but he only tried fromlocalhost
(which he must have wrote manually in his browser) so he got the CORS issue. I then added “localhost” to the list of allowed origins, but he closed the issue and decided to not retry.The first time I also sent him two other links to demos with or without instant navigation, so he could also see the wrong redirection to /assets/javascripts/bundle/count instead of /comments/count directly from the server, but he decided to gave up before even opening them.
It could be, but my suggestion would be applying this behaviour only to a restricted lists of mkdocs/mkdocs-material generated URLs, like
/assets/javascripts/bundle
and/assets/stylesheets
, in order to not interfere with URLs generated from other javascript files.For instance, you can see from the file I attached in my first post that
endpoint + "/count"
is used, but somehow the final URL gets modified to /assets/javascripts/bundle/count only the first time a page is loaded if instant navigation has been set. If I refresh the page or disable instant navigation, the problem is gone.If he doesn’t care about reopening this issue, I’ll stick with instant navigation off.
Thanks for your email. However, this is just a bare repository which doesn’t run locally due to CORS issues (see screenshot below). I’m very sorry but I cannot invest too much time into problems with third-party integrations that are not officially supported by Material for MkDocs. If you manage to isolate the problem or provide a fix, I’m happy to merge it, but for now, I have to consider this a problem with customization. Thus I’m closing this issue.
Unfortunately, it’s impossible for me to debug without a working example. If you could provide a fully self-contained repository, which I can check out,
pip install
andmkdocs serve
, I may look into this, but note that I don’t have an account for Isso. You can also investigate this yourself and PR, if you manage to find the reason for this. Note that instant loading will evaluate allscript
tags that are part of thecontainer
component:https://github.com/squidfunk/mkdocs-material/blob/d6317dc51494309c7b09d4d80fa4611f1e6dc188/src/assets/javascripts/integrations/instant/index.ts#L294-L319
If you don’t wish to proceed on this, another option is just to disable instant loading. We can only guarantee that it works without customizations after all, there are just too many possibilities.