facebook / facebook/docusaurus

auto-translated hash-links fail to route correctly

Open
#11,386 9 comments 0 reactions 0 assignees View on GitHub
bug
Dominant language
TypeScript
Stars
66.2k
Forks
10k
Avg merge
1d 3h
Merged PRs (30d)
52

Description

### Have you read the Contributing Guidelines on issues?

- [x] I have read the [Contributing Guidelines on issues](https://github.com/facebook/docusaurus/blob/main/CONTRIBUTING.md#issues).

### Prerequisites

- [x] I'm using the latest version of Docusaurus.
- [ ] I have tried the `npm run clear` or `yarn clear` command.
- [ ] I have tried `rm -rf node_modules yarn.lock package-lock.json` and re-installing packages.
- [ ] I have tried creating a repro with https://new.docusaurus.io.
- [x] I have read the console error message carefully (if applicable).

### Description

When auto-translating a Docusaurus generated page, the left hand side bar links work correctly but the right hand Table of Contents fail to route and translation ceases. This also applies to hash-link anchors at the ends of contents titles and to hash-links in the text body. The link route may also route back to a completely different but previously viewed page.

See attached file. The first tab shows a page working correctly in English then moves on to several tabs each with different failure examples.

https://github.com/user-attachments/assets/971f2c38-c012-41b4-820e-742a29d1277c

### Reproducible demo

_No response_

### Steps to reproduce

Go to [this page](https://docusaurus-io.translate.goog/blog/releases/3.8?_x_tr_sl=auto&_x_tr_tl=it&_x_tr_hl=en&_x_tr_pto=wapp) in any browser

This page has the latest build code and reflects the fixes made with #11360 for issue #11358

### Expected behavior

The links should route correctly and the translation should be maintained.

Other documenting systems are able to demonstrate correct behaviour with hash-links eg. [Qemu](https://qemu.readthedocs.io/en/v10.0.3/system/introduction.html)

There is an npm module called [react-router-hash-link](https://www.npmjs.com/package/react-router-hash-link) which shows how this should work. This may also hold a possible solution?

See demo of this module at work:

https://github.com/user-attachments/assets/bf5e539d-78e3-4d58-959d-c8bb12c5d441

### Actual behavior

The actual behaviour is fully documented in the initial video.

This shows, for example, the auto-translated Docusaurus blog for release 3.7, in French, routing to the 3.8 blog in English, when the ToC link for 'Souligner' is clicked.

### Your environment

The reproducible example links all have the latest Docusaurus builds and the behaviour is the same in all browsers and across different Operating systems.

### Self-service

- [ ] I'd be willing to fix this bug myself.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.