docs(mkdocs): enable instant loading of mathjax equations (autowarefoundation#3846)

* fix(docs): fixed rendering error mathjax

Signed-off-by: Mamoru Sobue <mamoru.sobue@tier4.jp>

* add js/mathjax.js to render equation with instant loading

Signed-off-by: Mamoru Sobue <mamoru.sobue@tier4.jp>

* enable instant loading

Signed-off-by: Mamoru Sobue <mamoru.sobue@tier4.jp>

* style(pre-commit): autofix

* add js/mathjax.js to sync file setting

Signed-off-by: Mamoru Sobue <mamoru.sobue@tier4.jp>

---------

Signed-off-by: Mamoru Sobue <mamoru.sobue@tier4.jp>
Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>

Author: soblin

.github/sync-files.yaml

@@ -97,3 +97,4 @@
         sd "/edit/main/docs/" "/edit/main/" {source}
         sd "docs_dir: .*" "docs_dir: ." {source}
         sd "assets/(\w+)" "docs/assets/\$1" {source}
+    - source: docs/assets/js/mathjax.js

docs/assets/js/mathjax.js

@@ -0,0 +1,16 @@
+window.MathJax = {
+  tex: {
+    inlineMath: [["\\(", "\\)"]],
+    displayMath: [["\\[", "\\]"]],
+    processEscapes: true,
+    processEnvironments: true,
+  },
+  options: {
+    ignoreHtmlClass: ".*|",
+    processHtmlClass: "arithmatex",
+  },
+};
+
+document$.subscribe(() => {
+  MathJax.typesetPromise();
+});

mkdocs.yaml

@@ -45,7 +45,9 @@ extra_css:
   - https://use.fontawesome.com/releases/v5.15.4/css/all.css
 
 extra_javascript:
-  - https://cdn.jsdelivr.net/npm/mathjax@2/MathJax.js?config=TeX-AMS-MML_HTMLorMML
+  - docs/assets/js/mathjax.js
+  - https://polyfill.io/v3/polyfill.min.js?features=es6
+  - https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js
 
 plugins:
   - awesome-pages
@@ -73,7 +75,8 @@ markdown_extensions:
   - plantuml_markdown:
       server: http://www.plantuml.com/plantuml
       format: svg
-  - pymdownx.arithmatex
+  - pymdownx.arithmatex:
+      generic: true
   - pymdownx.details
   - pymdownx.emoji:
       emoji_index: !!python/name:materialx.emoji.twemoji