Comments (2)
This happens as Registry.js doesn't consume hash parameter from useLocation()
https://github.com/denoland/deno_website2/blob/38c5c441d9562f9e9617a52f9509e70493b5ea33/src/Registry.js#L19
Registry.js can consume hash parameter for useLocation()
, and scroll to that section on the page on load.
Documentation: https://reacttraining.com/react-router/web/api/Hooks/uselocation
from dotland.
For example, the CONTRIBUTING.md links to contributing section of manual.md
* Source: https://github.com/denoland/deno/blob/master/CONTRIBUTING.md * Link: https://deno.land/std/manual.md#contributing
When website loads https://deno.land/std/manual.md#contributing, it doesn't scroll to the contributing section
This happens as Registry.js doesn't consume hash parameter from
useLocation()
Registry.js can consume hash parameter for
useLocation()
, and scroll to that section on the page on load.
Documentation: https://reacttraining.com/react-router/web/api/Hooks/uselocation
This is correct, but it is not related to the non-consumption of the hash - useLocation only makes the location available in the component, it does not actually trigger any logic when running the hook.
The root cause of the issue is actually that browsers like Chrome and Firefox, who handle the hash anchoring, only do this within a certain time period or before a certain browser specified metric trips. Because the content of the page is loaded asynchronously - because the page is client rendered - either the time period is over or the metric trips before the content is loaded. After this happens the browser stops trying to find the anchor and scroll it into view.
Anchoring does work if the content is there right away. You can see this yourself by going to the mentioned link and after the content has loaded, click on the url bar again and just press enter. This will re-trigger the anchoring process. The element should now be scrolled into view.
In any case we should definitely fix this as this is not intended behavior. I actually mentioned this exact issue in #70. A way to fix it would be to manually to do the anchoring in JS after the content has been loaded and rendered to the DOM. We need to implement this as a trigger on actual DOM render, which is not super fun in React.
More info: https://medium.com/@gajus/making-the-anchor-links-work-in-spa-applications-618ba2c6954a
from dotland.
Related Issues (20)
- footer iframe broken
- deno-gfm should load typescript on all deno.land/x pages HOT 3
- How to change a third party module github repo? HOT 1
- Version tagged latest is not the most recent version HOT 4
- Search result leading to a removed page
- https://deno.land/add_module not working HOT 3
- Link to GitHub on source code pages are sometimes broken HOT 1
- Background colors not matching (with GFM?) HOT 4
- heymi's website in the artwork page leads to NSFW ads
- [low priority] Code expample on docs pages incomplete HOT 9
- Broken links HOT 6
- Confusion about Sub Process Manual section. HOT 1
- Add built with ... to README.md HOT 3
- update versions.json for 1.33.2 HOT 3
- refactor: doc view HOT 1
- Turn off "old" Google Analytics (UA)
- emphasize on typescript HOT 1
- Std latest version redirects to an old version HOT 2
- 0.189.0 version for deno_std packages are not suggesting the latest version HOT 2
- Community column missing in Deno.land footer HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from dotland.