Vuepress: next / previous page links are incorrect

[songololo]

• [x] I confirm that this is a issue rather than a question.

Bug report

next / previous links are generating the incorrect page names.

However, clicking on the next or previous link will still go to the correct (next or previous) page.

Version

1.0.0-alpha.39

Steps to reproduce

Docs Repo: https://github.com/cityseer/cityseer/tree/master/docs
Docs Site: https://cityseer.github.io/cityseer
Theme: https://github.com/cityseer/vuepress-theme-cityseer

What is expected?

That the next or previous page names will match the names for the next or previous pages.

What is actually happening?

It will get stuck on the first "next" page's name for all subsequent prev / next links on all pages.

Other relevant information

• Your OS: MacOS
• Node.js version: v11.9.0
• Browser version: Latest Safari and latest Chrome.
• Is this a global or local install? Local
• Which package manager did you use for the install? Yarn

[Shigma]

PR created at #1335.

Very wierd. If we use

<router-link
  class="prev"
  :to="prev.path"
>
  {{ prev.title || prev.path }}
</router-link>

The path of router-link will be updated when page updates, however this innerText will be never changed.

If we use

<router-link
  class="prev"
  :to="prev.path"
  v-text="prev.title || prev.path"
/>

instead, everything go on smoothly. I don't understand what caused this.

[jjyyxx]

It seems that the auto-renderer of the Katex lib is doing weird things to these two router-link.

Before more deep investigation, if you block

https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js

when loading the page (can be achieved in developer tool), you will find that these links work correctly again.

So it is most likely not a bug of the default-theme. It's either a bug of the auto-renderer or a problem of better integration between vuepress and katex.

This piece of code could be a start point to find out why textContent works but innerHTML does not.

[jjyyxx]

auto-renderer uses replaceNode to render formulas. After replacing a vue-generated node with a katex-generated node, Vue still updates the content of the old node which is offscreen.

auto-renderer has known incompatibility with responsive frameworks including angular, react and vue. You could refer to this issue about react.

[Shigma]

@songololo

I recommend installing an ssr-friendly latex plugin instead of using ketax directly in responsive pages.