Refresh page before it works

[SH3LLco]

I'm not sure if im having a conflict as im not the best web dev, however, after your latest update ive noticed that the panzoom feature fails to work unless i reload the page. This happens maybe one out of every 3 times i navigate to a page with a mermaid diagram. I have to refresh the page before panzoom will work. All functionality is broken when this happens, including the reset to center and fullscreen button.

You can test this on my site by going here: https://sh3ll.co/core/networking/protocols/http-s/ and then clicking on "HTTP Flow." Sometimes it works first try, others it takes a refresh, sometimes it works multiple times in a row before breaking.

Ive tested this on the latest firefox and chrome browsers.

Please let me know how i can assist in troubleshooting.

[PLAYG0N]

Issue can only be replicated your page.

I could not replicate it on my demo site. Maybe it's the insider version or another plugin causing it. Does this also happen on the demo site?

• Can you try to build the page using the standard version?
• Put the panzoom plugin as the last in the mkdocs.yml
• Maybe also try to disable certain plugins to find out if any of them are the cause

[SH3LLco]

It doesn't happen on the demo site as far as im aware. I will try your recommendations and see what happens.

[SH3LLco]

i do use the insiders version, hope thats not the issue.

[LarsWegm]

I have the same issue (but no insiders version). I guess the instant loading feature could be the problem here (since I had a similar problem when writing custom scripts for mkdocs-material).
To resolve this one has to load the init script with

document$.subscribe(function() {
  myInitFunction();
})

as described under How to integrate with third-party JavaScript libraries.

[SH3LLco]

I have the same issue (but no insiders version). I guess the instant loading feature could be the problem here (since I had a similar problem when writing custom scripts for mkdocs-material). To resolve this one has to load the init script with

document$.subscribe(function() {
myInitFunction();
})

as described under How to integrate with third-party JavaScript libraries.

could you show me how you've incorporated this with panzoom? Im a big noob when it comes to JS.

[SH3LLco]

i tried to load the script per the documentation you mentioned but it did not work. I also disabled the instant loading features and this did not resolve. Since LarsWegm mentions having the same issue on standard material for mkdocs, i do not see a need to test that. I also noticed this in console, but unsure what this means or if it's related.

[LarsWegm]

This should do the trick: #22

[PLAYG0N]

New Version is available on pypi

Thanks @LarsWegm for the pull request

Let me know if it worked

[LarsWegm]

Works on my machine @PLAYG0N , but I guess @SH3LLco should also verify it, because of his last comment.