Search Issue with Hash Router

[ankur-vunet]

Have you read the Contributing Guidelines on issues?

• I have read the Contributing Guidelines on issues.

Prerequisites

• 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.
• I have read the console error message carefully (if applicable).

Description

I have created a docusaurus project with algolia search and hash router. But observed a strange behavior of search not working properly with Enter button on keyboard. Whereas it works smoothly with mouse click. Later I observed same on official sample page also.

https://facebook.github.io/docusaurus/#/

GO to any page on this website, and then do a search and select with mouse click. It returns the result correctly.
Next, make the search again from this page, and use Enter on keyboard, and you will be navigated to Page not found since, URL redirected is improper. Please make a fix for this. I want algolia to work smoothly with hash router for my project.

Reproducible demo

No response

Steps to reproduce

https://facebook.github.io/docusaurus/#/

GO to any page on this website, and then do a search and select with mouse click. It returns the result correctly.
Next, make the search again from this page, and use Enter on keyboard, and you will be navigated to Page not found since, URL redirected is improper. Please make a fix for this. I want algolia to work smoothly with hash router for my project.

Expected behavior

On both, search with either mouse click or Enter on keyboard, functionality should be similar.

Actual behavior

On actuals, on mouse click it is working fine. But on Keyboard Enter, Page not found. This issue isexplicitly with hash router only. If I remove hash router, it is working perfectly fine.

Your environment

• Public source code:
• Public site URL: https://facebook.github.io/docusaurus/#/
• Docusaurus version used:
• Environment name and version (e.g. Chrome 89, Node.js 16.4):
• Operating system and version (e.g. Ubuntu 20.04.2 LTS):

Self-service

• I'd be willing to fix this bug myself.

[slorber]

Please be precise: tell us what's the exact url after clicking with a mouse, and what's the exact URL after pressing tab.

For both our website, and your Docusaurus project.

I suspect what is going on for our own website is that we only deploy the "current" version so that CI runs faster. This means that the indexed /#/docs/next routes do not exist there.

[slorber]

Hmmm it looks like you are right, I also get a weird URL only when using search with keyboard controls.

Repro:

• Open https://facebook.github.io/docusaurus/#/docs/cli
• Type happy
• Select the blog post Happy 1st birthday Slash

Result:

• ✅ Html Link: https://facebook.github.io/docusaurus/#/blog/2018/12/14/Happy-First-Birthday-Slash
• ✅ When using mouse: https://facebook.github.io/docusaurus/#/blog/2018/12/14/Happy-First-Birthday-Slash
• ❌ When using keyboard controls: https://facebook.github.io/docusaurus/#/docs/blog/2018/12/14/Happy-First-Birthday-Slash

This is a valid bug to fix.

Looks like it only happens with the hash router.

[slorber]

Unrelated but worth mentioning: I'm not sure how Algolia is able to index Docusaurus when it's using the experimental hash router.

@shortcuts any idea? With the hash router, Docusaurus becomes a full client-side CSR/SPA app, not SSG/SSR anymore.

An example hash router deployment: https://facebook.github.io/docusaurus/#/

More info here:

• https://docusaurus.io/blog/releases/3.4#hash-router---experimental
• feat(core): hash router option - browse site offline (experimental) #9859

Worth mentioning: in hash router mode, we do not emit a sitemap.xml (but we could eventually add that if it's useful). This probably means that Algolia crawler would have to run the JS and crawl links on its own. I'm not sure the default Algolia Docusaurus config is suited for that.

Note: if search works on the example hash router deployment, it's only because it's using the same Algolia as our main website (https://docusaurus.io), which is the one being indexed. It's not proof that the Algolia crawler can index a hash-based Docusaurus website.

[ankur-vunet]

If somehow behavior of pressing Enter can mimick what mouse click does in backend. It will solve the use case for me. Yes, I have crawled on algolia index without hash router and then using that index inside search with hash router. Everything is working perfectly for me except this strange behavior on pressing Enter.

…

On Tue, 13 Aug, 2024, 20:43 Sébastien Lorber, ***@***.***> wrote: Unrelated but worth mentioning: I'm not sure how Algolia is able to index Docusaurus when it's using the experimental hash router. @shortcuts <https://github.com/shortcuts> any idea? With the hash router, Docusaurus becomes a full client-side CSR/SPA app, not SSG/SSR anymore. An example hash router deployment: https://facebook.github.io/docusaurus/#/ More info here: - https://docusaurus.io/blog/releases/3.4#hash-router---experimental - #9859 <#9859> Worth mentioning: in hash router mode, we do not emit a sitemap.xml (but we could eventually add that if it's useful). This probably means that Algolia crawler would have to run the JS and crawl links on its own. I'm not sure the default Algolia Docusaurus config is suited for that. Note: if search works on the example hash router deployment, it's only because it's using the same Algolia as our main website ( https://docusaurus.io), which is the one being indexed. It's not proof that the Algolia crawler can index a hash-based Docusaurus website. — Reply to this email directly, view it on GitHub <#10399 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AZTKI3EN2JTDWXEJ3R5HVDDZRIPALAVCNFSM6AAAAABMOEUC4KVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDEOBWGQ4TSOJQGA> . You are receiving this because you authored the thread.Message ID: ***@***.***>

[ankur-vunet]

@slorber, are you planning to fix this bug in the next few days?

[Josh-Cena]

I'm very curious how search can ever work with hash router, since I assumed that the site would then not be crawlable by Algolia. Plus hash routers were implemented so the site could work offline without a server, and that idea seems incompatible with an online search service. But I'll defer the investigation and explanation to @slorber

[ankur-vunet]

The search is working smoothly except for this issue on pressing enter on the search bar. I understand your concern of offline access.

[shortcuts]

Unrelated but worth mentioning: I'm not sure how Algolia is able to index Docusaurus when it's using the experimental hash router.

@shortcuts any idea? With the hash router, Docusaurus becomes a full client-side CSR/SPA app, not SSG/SSR anymore.

The default DocSearch's docusaurus config does not enable javascript rendering, one would need to enable it: https://www.algolia.com/doc/tools/crawler/apis/configuration/render-java-script/

I believe it would be worth setting it by default? It would also mean a migration on our side if we want this to be retroactively applied

Worth mentioning: in hash router mode, we do not emit a sitemap.xml (but we could eventually add that if it's useful). This probably means that Algolia crawler would have to run the JS and crawl links on its own. I'm not sure the default Algolia Docusaurus config is suited for that.

A sitemap is always better for consistency but the Crawler will still discover links on its own

[slorber]

@shortcuts

I believe it would be worth setting it by default? It would also mean a migration on our side if we want this to be retroactively applied

I don't think it's necessary, most sites will keep using the browser router and rendering JS is probably more expensive.

We can just document users should enable it if needed if they want to use the hash router (a minority of users).

A sitemap is always better for consistency but the Crawler will still discover links on its own

Yes, I understand that, at the same time the sitemap is supposed to help with SEO and I don't think it is expected to contain anchors. Although it probably doesn't harm, if we implement this it's probably only for Algolia crawlers. It's hard to find relevant info online on how to index a hash-based site.

[slorber]

@ankur-vunet @Josh-Cena even if the site is distributed as an offline-first archive, it doesn't necessarily mean that the user won't have access to internet, so the Algolia search engine may still work in that scenario.

If the search should work offline, someone will have to build a local search plugin that supports the hash router.