[Bug]: Internal links grayed out / displayed as class=" not found" on GH Pages

AudioLotus commented 6 months ago

Material General discussion

[X] My issue is not a question relative to Material Mkdocs nor Mkdocs (You can open a discussion to get more help!)
[X] I checked the issue to prevent duplicate
[X] I checked my configurations files and the documentation
[X] My issue is not relative to the actions/github Workflow. If it's the case, you must open an issue here.
[X] My issue is not relative to the Obsidian Plugin. If it's the case, you must open an issue here.

Error

GET
https://audiolotus.github.io/FlwrzD2/assets/meta/favicons.png
[HTTP/2 404  36ms]

GET
[https://audiolotus.github.io/assets/img/Wishing%20Wall.jpeg](https://audiolotus.github.io/assets/img/Wishing%2520Wall.jpeg)
[HTTP/2 404  38ms]

Empty string passed to getElementById(). [0 - Intro to Last Wish:601:29](https://audiolotus.github.io/FlwrzD2/Raids/Last%20Wish/0%20-%20Intro%20to%20Last%20Wish/)
GET
https://audiolotus.github.io/FlwrzD2/assets/meta/favicons.png
[HTTP/2 404  42ms]

GET
[https://audiolotus.github.io/assets/img/Wishing%20Wall.jpeg](https://audiolotus.github.io/assets/img/Wishing%2520Wall.jpeg)
[HTTP/2 404  44ms]

Source map error: Error: NetworkError when attempting to fetch resource.
Resource URL: https://unpkg.com/@popperjs/core@2/dist/umd/popper.min.js
Source Map URL: popper.min.js.map

Source map error: Error: NetworkError when attempting to fetch resource.
Resource URL: https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js
Source Map URL: tippy-bundle.umd.js.map

XHRGET
[https://audiolotus.github.io/FlwrzD2/Raids/0 - Intro to Last Wish.mdencounters](https://audiolotus.github.io/FlwrzD2/Raids/0%20-%20Intro%20to%20Last%20Wish.mdencounters)
[HTTP/2 404  56ms]

TypeError: e.split is not a function
    calculateHeight https://cdn.jsdelivr.net/gh/ObsidianPublisher/assets@main/dist/javascript.js:1
    onShow https://cdn.jsdelivr.net/gh/ObsidianPublisher/assets@main/dist/javascript.js:1
    promise callback*onShow https://cdn.jsdelivr.net/gh/ObsidianPublisher/assets@main/dist/javascript.js:1
    show https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:1406
    scheduleShow https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:1260
    onTrigger https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:1034
    on https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:952
    on https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:951
    addListeners https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:977
    addListeners https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:972
    setProps https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:1335
    setInternalProps https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:2345
    addModifier https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:2351
    invokeHook https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:780
    invokeHook https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:778
    createTippy https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:702
    instances https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:1621
    tippy https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js:1620
    <anonymous> https://cdn.jsdelivr.net/gh/ObsidianPublisher/assets@main/dist/javascript.js:1
[javascript.js:1:7261](https://cdn.jsdelivr.net/gh/ObsidianPublisher/assets@main/dist/javascript.js)
GET
https://audiolotus.github.io/FlwrzD2/assets/meta/favicons.png
[HTTP/2 404  0ms]

Source map error: Error: NetworkError when attempting to fetch resource.
Resource URL: https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js
Source Map URL: tippy-bundle.umd.js.map

Bug description

Links are unable to be clicked on the published GH Page.

Steps to reproduce

Initial Steps

Use wikilinks in file with Obsidian option for relative path to file turned on
Within the GH Publisher plugin, turn on Internal links and Wikilinks to MD Links
Publish note

When using filenames with a "." this initially cause additional entities to appear in the html such as %2520, which caused errors. The issue happened after changing the links to pure markdown []() , as well as after changing the filenames to include "-" instead.

Expected behavior

The links from various pages should send me to the proper page. I'll use an example of just one page to make things easier though.

Here's one of the pages with a link that doesn't work and what it looks like HTML wise in the inspector:

Here is the page that link is supposed to go to:

https://audiolotus.github.io/FlwrzD2/Raids/Last%20Wish/Morgeth/

Screenshots

In case it's relevant:

Additional context

This is in reference to the bug I initially filed over in the plugin repo: https://github.com/ObsidianPublisher/obsidian-github-publisher/issues/304 in case it helps provide any additional help.

The errors listed above are from the inspector in FireFox when viewing this specific page

I've tried naming the files different things with no success.

For example This page has been called:

3. Morgeth, the Spirekeeper 3 - Morgeth, the Spirekeeper 3 - Morgeth the Spirekeeper and now, just "Morgeth"

Changing the naming to remove spaces / punctuation did not work in any form. I will note that in the GH Repo itself, the internal links work.

Here is a link to the repo: https://github.com/AudioLotus/FlwrzD2

To the main site itself: https://audiolotus.github.io/FlwrzD2

(Pardon the mess, just wanted to get things set up before I work on formatting and customizing haha)

Thanks again for everything!

Requirements

mkdocs==1.5.3
mkdocs-material==9.5.7
mkdocs-ezlinked-plugin==0.3.3
mkdocs-awesome-pages-plugin==2.9.2
mdx_breakless_lists==1.0.1
mkdocs-embed-file-plugins==2.0.9
mkdocs_custom_fences==0.1.2
mkdocs-git-revision-date-localized-plugin==1.2.4
mkdocs-encryptcontent-plugin==3.0.3
mkdocs-callouts==1.10.0
mkdocs-custom-tags-attributes==0.3.3
mkdocs-meta-descriptions-plugin==3.0.0
mkdocs-glightbox==0.3.7
obsidiantools==0.10.0
pyvis==0.3.2
cairosvg==2.7.1
pillow==10.2.0

Mkdocs.yml

site_name: MrFlwrz Destiny 2 Guides # Change this to your site name
site_description: Sherpa advice and guides for activities!
site_url: https://audiolotus.github.io/FlwrzD2 # Change this to your site URL
site_author: Flowers

theme:
    name: 'material'
    logo: assets/meta/favicons.png
    favicon: assets/meta/favicons.png
    custom_dir: overrides
    font:
        text: Ubuntu
        code: Ubuntu Mono
    language: en
    palette:

    # Light mode
    - media: "(prefers-color-scheme: light)"
      scheme: default
      primary: teal
      accent: light blue
      toggle:
        icon: material/toggle-switch-off-outline
        name: Switch to dark mode

    # Dark mode
    - media: "(prefers-color-scheme: dark)"
      scheme: slate
      primary: blue
      accent: indigo
      toggle:
        icon: material/toggle-switch
        name: Switch to light mode

    features:
        - navigation.indexes
        - navigation.top
        - navigation.tabs
        - navigation.tabs.sticky
        - navigation.expand

# Extensions
markdown_extensions:
  - footnotes
  - nl2br
  - attr_list
  - sane_lists
  - meta
  - smarty
  - tables
  - mdx_breakless_lists
  - def_list
  - pymdownx.arithmatex:
      generic: true
  - pymdownx.details
  - pymdownx.magiclink
  - pymdownx.critic
  - pymdownx.caret
  - pymdownx.keys
  - pymdownx.mark
  - pymdownx.tilde
  - pymdownx.highlight:
      use_pygments: true
      anchor_linenums: true
  - pymdownx.tasklist:
       custom_checkbox: true
  - pymdownx.emoji:
      emoji_index: !!python/name:material.extensions.emoji.twemoji
      emoji_generator: !!python/name:material.extensions.emoji.to_svg
  - admonition
  - toc:
      permalink: true
  - pymdownx.inlinehilite
  - pymdownx.snippets
  - pymdownx.superfences:
      custom_fences:
        - name: mermaid
          class: mermaid
          format: !!python/name:pymdownx.superfences.fence_code_format
plugins:
  - search
  - meta-descriptions
  - ezlinks:
        wikilinks: true
  - awesome-pages
  - embed_file:
      callouts: true
      custom-attributes: 'assets/css/custom_attributes.css'
  - custom-attributes:
      file: 'assets/css/custom_attributes.css'
  - encryptcontent:
      title_prefix: '🔐'
      summary: 'Private page'
      placeholder: 'Password'
      decryption_failure_message: 'Invalid password'
      encryption_info_message: "You don't have access to this page."
      search_index: 'encrypted'
      password_button: True
      password_button_text: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" height="1em" width="1em"><!--! Font Awesome Pro 6.1.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M416 32h-64c-17.67 0-32 14.33-32 32s14.33 32 32 32h64c17.67 0 32 14.33 32 32v256c0 17.67-14.33 32-32 32h-64c-17.67 0-32 14.33-32 32s14.33 32 32 32h64c53.02 0 96-42.98 96-96V128C512 74.98 469 32 416 32zM342.6 233.4l-128-128c-12.51-12.51-32.76-12.49-45.25 0c-12.5 12.5-12.5 32.75 0 45.25L242.8 224H32C14.31 224 0 238.3 0 256s14.31 32 32 32h210.8l-73.38 73.38c-12.5 12.5-12.5 32.75 0 45.25s32.75 12.5 45.25 0l128-128C355.1 266.1 355.1 245.9 342.6 233.4z"/></svg>'
  - callouts
  - glightbox
hooks:
  - overrides/hooks/on_page_markdown.py
  - overrides/hooks/on_env.py
  - overrides/hooks/on_files.py
extra_javascript:
  - https://cdn.jsdelivr.net/gh/ObsidianPublisher/assets@main/dist/javascript.js
  - https://polyfill.io/v3/polyfill.min.js?features=es6
  - https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js
extra_css:
    - https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css
    - https://cdn.jsdelivr.net/gh/ObsidianPublisher/assets@main/dist/styles.css
    - assets/css/admonition.css
    - assets/css/custom_attributes.css
    - assets/css/customization.css
extra:
  SEO: assets/meta/SEO.png
  comments: False #disable comments globally
  generate_graph: false #generate the graph of the site
  attachments: 'assets/img' #path to the folder where the attachments are stored
  no-auto-h1: False #disable the automatic generation of h1 if no h1 is found

  hooks:
    strip_comments: true
    fix_heading: true

Mara-Li commented 6 months ago

Thanks, will take a look to it this week

Mara-Li commented 6 months ago

Can i get one of the original file, so I can try to check / differenciate with the plugin and the blog.

Mara-Li commented 6 months ago

Hm, it seems that your website not initialize search correctly :

I don't know if this is the cause of the bug

AudioLotus commented 6 months ago

Thanks for the update on this!

0 - Intro to Last Wish.md

Here is one of the main pages with links to internal pages and anchor links as well (those didn't seem to be working at the time).

As far as the search goes, I set it to enabled: false in the .yml file, not realizing it wouldn't actually remove the bar hahaha. I'll get on fixing that soon, but that shouldn't be related to the issue itself. If you'd like, I can re-enable it for testing.

Mara-Li commented 6 months ago

Okay, so I found some bugs with my javascript. But, also in Mkdocs. Like the linkt to 5 - Riven of a Thousand Voices that leads to an incorrect path (give a 404 even without my JS) and I don't know why.

The most funny is that the bug disappear when using wikilinks. Maybe it's a mkdocs issue?

At last, I advice you to use wikilinks in your configuration, and the javascript will be updated asap. You will need to just wait to the cdn to be propaged.

AudioLotus commented 6 months ago

So I re-uploaded all my notes after switching off the conversion toggle for wikilinks in the plugin in obsidian but I'm still unable to click on the links both on mobile and desktop.

However I discovered something interesting.

On mobile, if I press hold the links and select "open in new tab", the pages open.

Even more interesting, the anchor links are now clickable.

The screenshots above show how things look in my obsidian and repo for one of the links in the index to show they're both set up wiki link style.

Do you think that will be fixed with the js update?

Thanks!

Mara-Li commented 6 months ago

Yes, it will. I tested with cloning and testing your repository. After locally updating the JS, the links are not greyed (when switched to wikilinks)

AudioLotus commented 6 months ago

Ah awesome! Thank you so much for all of your hard work on this!

Enveloppe / template-overrides