Changing between code tabs on long page results in scrolling

[zaneselvans]

Describe the bug

context

I have a long page with many instances of grouped code tabs. It documents the ~200 tables in a database. We want to show people how to read the table being documented directly from cloud storage using pandas, polars, duckdb, or R.

expectation
I expected my view of the page to remain anchored to my current location, regardless of what code tab I clicked on.

bug
Switching between tabs that take up a different amount of vertical space on the page results in disorienting scrolling, as the length of every displayed code tab above my current location on the page simultaneously expands or contracts. Ultimately the page is automatically scrolls back to its starting point, but only after a visual scrambling.

On MacOS this happenss with:

• Chrome (v139.0.7258.138)
• Safari (v18.6)

It does not happen with

• Firefox (v142.0.1)

problem
This is a problem for people trying to show many code snippets on a single page because it disorients the user as soon as they click on a tab to change language being displayed in the tabbed interface.

Reproduce the bug

• Create a sphinx docs page with 100+ code snippets in tabs.
• Display each code snippet in 2 different languages in the tabbed interface.
• Ensure that the vertical space taken up by the 2 different languages in the different tabs differs.
• Scroll down to the middle of the page somewhere and switch between tabs.
• Observe the frantic scrolling on Chrome & Safari, but not Firefox.

List your environment

This is happening in a normal Sphinx deployment, not a Jupyter Book.

MacOS 15.6.1

Problem happens with:

• Chrome (v139.0.7258.138)
• Safari (v18.6)

It does not happen with

• Firefox (v142.0.1)

[zaneselvans]

One possible solution here would be to allow code tabs to be ungrouped with a parameter, so all the other tabs on the page don't try to re-render simultaneously.