Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Relative alias redirects fail when using SPA and navigating up directories #1241

Open
joequincy opened this issue Jun 28, 2024 · 1 comment
Labels
bug Something isn't working

Comments

@joequincy
Copy link

joequincy commented Jun 28, 2024

Describe the bug
I am authoring long-form content that does not use an index.md. Instead, the entrypoint .md for a given dir has frontmatter like

...
aliases:
  - index

This allows me to have a content/ file structure like

content/
  chapters/
    chapter-1-name.md <--(this is aliased to index)
    chapter-2-name.md
    ...
  main-title-of-content.md <--(this is aliased to index)
  other-arbitrary.md
  metadata-pages.md

However when using enableSPA: true, links such as the breadcrumbs that point up one or more directories behave incorrectly. In the example above, the "Home" breadcrumb on /chapters/chapter-n-name will result in the browser navigating to /chapters/main-title-of-content instead of /main-title-of-content.

This appears to be because the content of the redirect is fetch'd and then patched into the current page using minimorph without rewriting the url in the meta tag, causing the redirect to be applied relative to the current path instead of the path the alias resides at.

To Reproduce
Steps to reproduce the behavior:

  1. Ensure quartz.config.ts has enableSPA: true
  2. Have a content/ root without index.md
  3. Add a file (e.g. faux-index.md) with frontmatter containing aliases: [index] (or multiline version)
  4. Add a file to a subdirectory (e.g. demo/child-page.md)
  5. Start local server with npx quartz build --serve
  6. Visit the child page in your browser, then click the "Home" breadcrumb

Expected behavior
Quartz navigates to the aliased content at the unnested path.

Screenshots and Source
I have created a minimal reproduction joequincy/quartz-spa-repro@b646592 with two pages. Just run npx quartz build --serve on the repro branch.

Desktop (please complete the following information):

  • Quartz Version: 4.2.3
  • node Version: 20.9.0
  • npm version: 10.8.1
  • OS: Ubuntu (via Windows 11 WSL2)
  • Browser: Chrome

Additional context
I have also found what appears to be the source of the issue, and produced a potential fix on my reproduction. joequincy/quartz-spa-repro@36703fe is on a separate potential-fix branch for local testing.

@joequincy joequincy added the bug Something isn't working label Jun 28, 2024
@jackyzha0
Copy link
Owner

index is a special file and can't normally be used as an alias target like you are trying to do

aliasing just creates a file with that name that redirects the browser to the original page so in your case the browser fetches and redirects to /demo/main as you saw in your reproduction

this is working as intended albeit could be warned better

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants