Mermaid Diagrams Break Offline Search Plugin

[Vasperous]

Contribution guidelines

• I've read the contribution guidelines and wholeheartedly agree

I've found a bug and checked that ...

• ... the problem doesn't occur with the mkdocs or readthedocs themes
• ... the problem persists when all overrides are removed, i.e. custom_dir, extra_javascript and extra_css
• ... the documentation does not mention anything about my problem
• ... there are no open or closed issues that are related to my problem

Description

After upgrading to the latest Material MKDOCS I adjusted the project to use the offline search plugin as outlined in the docs. Once this change was made the initial Index.html page search works with the expansion etc. when the user clicks in the search box, however, when the user navigates to another page the search no longer works.

I was able to figure out the issue was with the mermaid superfences extension through process of elimination.

Expected behaviour

Offline search should work on subpages etc.

Actual behaviour

Offline search does not work.

Steps to reproduce

1. Create basic project
2. Add several sub pages
3. Add mermaid extension with superfences
4. Add Offline and Privacy plugins

Package versions

• Python: Python 3.10.0
• MkDocs: mkdocs, version 1.2.3
• Material: Version: 8.2.5+insiders.4.11.0

Configuration

site_name: 'My Test Project'
site_description: 'Test Project Description'
site_author: 'Tester'
site_url: ''

# Copyright
copyright: 'Copyright © 2022 Tester'

# If serving from a website you would want 'true', for offline you want false
use_directory_urls: false

nav:
  - Home:
    - Introduction: index.md
    - Layer 1: layer1/test1.md
    - Layer 2: layer1/layer2/test2.md
    - Layer 3: layer1/layer2/layer3/test3.md
    - Layer 4: layer1/layer2/layer3/layer4/test4.md
    - Layer 5: layer1/layer2/layer3/layer4/layer5/test5.md
    - Layer 6: layer1/layer2/layer3/layer4/layer5/layer6/test6.md

theme:
  name: 'material'
  font:
    text: 'Roboto'
    code: 'Roboto Mono'
  icon:
    admonition:
      note: octicons/tag-16
      abstract: octicons/checklist-16
      info: octicons/info-16
      tip: octicons/squirrel-16
      success: octicons/check-16
      question: octicons/question-16
      warning: octicons/alert-16
      failure: octicons/x-circle-16
      danger: octicons/zap-16
      bug: octicons/bug-16
      example: octicons/beaker-16
      quote: octicons/quote-16
  features:
    - content.tabs.link
    - navigation.indexes
    - navigation.tabs
    - navigation.tabs.sticky
    - navigation.top
    - navigation.tracking
    - search.highlight
    - search.share
    - search.suggest
    - toc.autohide

extra:
  generator: false

markdown_extensions:
  - abbr
  - admonition
  - attr_list
  - def_list
  - footnotes
  - meta
  - pymdownx.details
  - pymdownx.emoji:
      emoji_index: !!python/name:materialx.emoji.twemoji
      emoji_generator: !!python/name:materialx.emoji.to_svg
  - pymdownx.highlight:
      use_pygments: true
  - pymdownx.inlinehilite
  - pymdownx.keys
  - pymdownx.superfences:
      custom_fences:
        - name: mermaid
          class: mermaid
          format: !!python/name:pymdownx.superfences.fence_code_format
  - pymdownx.snippets:
      base_path: ext_md
  - pymdownx.tabbed:
      alternate_style: true
  - pymdownx.tasklist:
      custom_checkbox: true
  - toc:
      permalink: '#'
      toc_depth: 5

plugins:
  - search
  - git-revision-date-localized:
      fallback_to_build_date: true
  - tags:
      tags_file: tags.md
  - privacy:
      externals: bundle
  - offline

System information

• Operating system: Mac OS
• Browser: Brave & Google Chrome

[squidfunk]

Thanks for reporting. Very likely related to #3742

[Vasperous]

You are correct, just realized that if I remove from a page the Mermaid diagram then the search is working. :)

[squidfunk]

Thanks for testing – closing as (symptomatic) duplicate then.