Visiting a page via an anchor link interferes with tabs
Steps to reproduce
- Visit a page that contains tabs via an anchor link, like this: https://docs.gitlab.com/ee/ci/pipelines/downstream_pipelines.html?#view-a-downstream-pipeline
- Scroll down to the tabbed content and click a tab
- The page scrolls you back up to the anchor you arrived on
Expected behavior
- Tab opens and does not scroll you back to the anchor
Why this happens
In a past MR (!3067 (comment 1085608893)), we removed the query strings from tabs to discourage linking directly to them. The first tab in tab groups does not get a query string, so it felt inconsistent to rely on, and we did not have a way to avoid broken links if the titles changed.
However, without query strings, the tabs collide with anchor links, and the anchor behavior overrides the tabs.
We can restore query strings to fix the scrolling issue, but the issues we noted before would come back. We could address those by:
- Figuring out how to get a query string for the first tab (open question: is this a bug with GitLab UI that would be worth submitting there?)
- Consider adding linting to check tab links (we have an existing check for anchors that might be similar)
Edited by Sarah German