x/pkgsite: cannot see type methods in sidebar if there are examples nearby

[madelynnblue]

What is the URL of the page with the issue?

https://pkg.go.dev/time#Ticker

What is your user agent?

Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/139.0.0.0 Safari/537.36

Screenshot

No response

What did you do?

Clicked on the down arrow next to Types, then the down arrow next to Ticker.

What did you see happen?

When clicking on the arrow next to Ticker, its method types briefly expand, then the sidebar jumps to the Examples section highlighting NewTicker, and the Types -> Ticker sidebar is collapsed.

This actually is happening more than half the time when just clicking on the arrow next to Types. It takes many clicks to get the Types section to stay expanded.

What did you expect to see?

The sidebar to remain expanded on the thing I clicked.

[gabyhelp]

Related Issues

• x/pkgsite: auto-expand left sidebar #40577 (closed)

_{(Emoji vote if this was helpful or unhelpful; more detailed feedback welcome in this discussion.)}

[mrkfrmn]

cc @golang/pkgsite

[kbolino]

This may have something to do with screen size, [edit: or maybe how much/what kinds of things are on the screen at the same time]. Compare https://pkg.go.dev/log/slog#WarnContext in two different sized browser windows:

Note that, in the larger window, it insists I'm on Examples>Group while in the smaller window it recognizes that I'm on Functions>WarnContext. Also, it takes fewer repeat clicks to browse the sidebar on the smaller window, though I can't say that number ever gets consistently down to 1 before the window gets so small that the sidebar disappears.

[Merovius]

This has been bothering me as well. I believe this is a regression introduced by @matttproud in 395738c to make examples more prominent. In fact, I can reproduce the issue by running pkgsite locally and opening the time package and clicking on "Types". Before that commit, the "Types" TOC section opens and lets me browse the types, after it, the "Examples" section opens.

I'm on Firefox, User-Agent is Mozilla/5.0 (X11; Linux x86_64; rv:142.0) Gecko/20100101 Firefox/142.0, on a 1080p Laptop screen (though I'm seeing the same issues on a 4K monitor).

[bitlux]

I can reproduce this in Chrome on Windows and Chrome 139.0.7258.140 on macOS. I can provide a screen recording if that would help.

When I click on a heading in the nav section (such as Types), not only does the Examples dropdown expand and the nav section jumps to it, but the Types dropdown doesn't even expand.

[ct1n]

The TOC is a little frustrating to use. If I click on Functions or Types in the TOC it briefly expands, then the Examples TOC entry expands, closing the initial TOC entry I wanted to see.
Chrome 137.0.7151.119 on Linux.

[joao-enzian]

I've been using this bookmarklet to "fix" the documentation:

javascript:document.querySelectorAll('.js-exampleContainer').forEach(x => x.parentElement.removeChild(x));

(this removes all Examples, but stops the auto collapsing)

Repro steps to trigger this bug:

• Open https://pkg.go.dev/flag
• On the left side, click on Types
• Notice that Types collapses immediately, and jumps to an Example instead
• Click on Types again, and then click on Type Flag. Same issue.

[gopherbot]

Change https://go.dev/cl/721720 mentions this issue: static/shared/outline: preserve document order when updating tree