MathJax does not work straight away with instant loading

• I’ve read the contribution guidelines 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

As the title suggests.

Expected behavior

When instant loading is enabled, MathJax is expected to typeset the content on page changes.

Actual behavior

Formulas won’t be rendered unless MathJax.typesetPromise() is manually called or the page is refreshed.

Steps to reproduce the bug

1. Follow the guide on creating a new site, enabling instant loading, and enabling MathJax.
2. Create a new page and write random formulas.
3. Preview and click on the new page to see if formulas are rendered.

Package versions

• Python: 3.9.2
• MkDocs: 1.1.2
• Material: 7.1.0

Project configuration

site_name: My Docs

theme:
  name: material
  features:
    - navigation.instant

markdown_extensions:
  - pymdownx.arithmatex:
      generic: true

extra_javascript:
  - javascripts/config.js
  - https://polyfill.io/v3/polyfill.min.js?features=es6
  - https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js

System information

• OS: macOS 11.2.3, Ubuntu 20.04

• Browser: Chrome 89.0.4389.114

[squidfunk]

Thanks for reporting. We might need to adjust the configuration (after window.MathJax and add:

document$.subscribe(() => {
  MathJax.typesetPromise()
})

This should trigger after the new document content was injected.

[squidfunk]

Added in 7761cad09.