anchor-tagged URL not jumping to correct place on dwc.tdwg.org/terms and dwc.tdwg.org/list

[debpaul]

Greetings,

Please note that clicking on a URL like the following one (with an anchor tag) https://dwc.tdwg.org/terms/#dwc:higherClassification does not produce the desired result of jumping to that exact spot on the page. (see screenshot)

Thanks for help @tdwg/dwc

---

@peterdesmet: the same happens on the /list page (described in #291), where clicking on e.g. https://dwc.tdwg.org/list/#dwc_higherClassification initially jumps to the correct position, but then moves away.

[MattBlissett]

Clicking the URL bar and pressing "Enter" then goes to the correct place, see #291.

Who maintains this site? I don't know how it's built, and it hasn't been changed for years.

[AbbyBenson]

Clicking the link in this ticket works as expected for me- it takes me to the correct place in the documentation. I'm on a PC using Chrome.

[deepreef]

Also works as expected for me. Also on a PC using Chrome.

[baskaufs]

This is a similar to Issue #291 which is unresolved. @MattBlissett It is built with this script and is updated with each term change to DwC. Last updated 22 days ago

[MattBlissett]

Ah, sorry, I was looking at the gh-pages branch, which is obsolete. The master branch is used.

I see the problem with Firefox and Chrome, on Linux and MacOS.

[peterdesmet]

Blame me. I created the layout for the site, but never encountered this issue (Chrome, Mac). I do see it on Safari, Mac though. The sidebar menu is created with this include: https://github.com/tdwg/tdwg-theme-jekyll/blob/master/_includes/toc.html, which I did not write myself. I'll see if it can be resolved by updating from https://github.com/allejo/jekyll-toc.

[MattBlissett]

It looks like you were aware: https://github.com/tdwg/tdwg-theme-jekyll/issues/1

I think the JavaScript is only highlighting the current section in the list on the right, and adding a line before LivingSpecimen. If we can't fix it, we could probably disable it.

[peterdesmet]

Yeah, I also realized it probably has nothing to do with the sidebar.

[peterdesmet]

I've investigated this a bit further and it works fine (i.e. jumps to the correct position) when:

• the page is already loaded and you click an anchor link (e.g. the buttons above each section)
• or when no css is applied to the page

So I think it is the result of lagging styling on page load, pushing the content up and down. Not sure how debug it further or fix it.

[MortenHofft]

It might not be the solution, but https://www.tdwg.org/theme/js/theme.js restyles the page as the last action. If the anchor has executed before that (and it might very well), then the position on the page is lost.

So I would think: either add those classes server side. Or if you need to do it in js, then you have to refresh the anchor with js as well.

[peterdesmet]

@MortenHofft you are right, disabling the theme.js solves the issue. Since that Javascript only adds css classes, I might be able to solve that directly in the main.css, with something like:

table {
  @extend .table
}

Will have to investigate. Will take some time because it affects all css for all TDWG sites.

[helemork]

I also encountered this issue when trying to link directly to the terms, where it always jumps to higher taxa instead of what I'm linking to on page load, but goes correctly when re-entering the url. Another fix could be to re-run the action, or give the action a very short delay which will usually let other things load first. Looking forward to an update/fix for this :)

Also quick question, Is there a simple api version of the glossary or plans on making one? Now we're linking each word, but optimally I'd prefer to obtain the definition of the words and display on hover as well so the user don't need to leave our site to get the definition (and a reference) for each word and get disrupted in whatever they are doing.

[peterdesmet]

Can one of you (@debpaul @tucotuco @baskaufs @pzermoglio) who reported this issue test if it still occurs on the updated site? By "verify" below I mean "verify the page scrolls to the right position (and not higher or lower)".

1. Use a browser different than Chrome on Mac OS (the issue was reported for Firefox and Safari)
2. Go to https://dwc.tdwg.org/terms/#taxon, click on the higherClassification button and verify
3. Click http://rs.tdwg.org/dwc/terms/namePublishedIn and verify
4. Click https://dwc.tdwg.org/terms/#dwc:sampleSizeValue and verify
5. Click https://dwc.tdwg.org/list/#dwc_measurementType and verify
6. Go to https://dwc.tdwg.org/list/#31-index-by-term-name, click the dwc:EventMeasurement link and verify

[tucotuco]

I have verified correct behavior on Safari 16, Mac OS 12.6.

[peterdesmet]

Can someone else verify on Firefox (on e.g. Windows)?

[AbbyBenson]

I tested in Firefox on Windows 10 and all links work as expected.

[peterdesmet]

Excellent, we can close this issue then. And I can close the browser tab I've kept open for it for over a year. ✅

[baskaufs]

Works for me on most recent versions of Firefox and Safari on Mac. I think I may be the one who reported this, so I'm really happy to see this resolved!