Memory track hover dot affects scrollable size in header

[mstange]

Steps to reproduce:

1. Go to https://perfht.ml/2CpYC2S
2. Scroll down in the header to the very bottom.
3. Hover the memory track for Web Content (2/2) in the right half of the track, where the orange graph is very low.
4. Without moving the mouse, scroll down.
5. Unhover.

Expected results:
At step 4 you shouldn't be able to scroll down more.
So that step 5 doesn't make the header jerk.

┆Issue is synchronized with this Jira Task

[mstange]

I think we need to make the graph overflow:hidden so that the dot doesn't extend beyond the graph's size. Additionally, we need to shift the graph itself a little bit inwards so that the dot isn't clipped off.
We already have code for this inward shifting:

profiler/src/components/timeline/TrackMemoryGraph.js

Lines 149 to 155 in 5881060

	// Add on half the stroke's line width so that it won't be cut off the edge
	// of the graph.
	const unitGraphCount = (accumulatedCounts[i] - minCount) / countRange;
	y =
	innerDeviceHeight -
	innerDeviceHeight * unitGraphCount +
	deviceLineHalfWidth;

[Tch4lla]

I've tried to reproduce this issue but I don't get the same expected results in my Firefox browser. Has it been resolved?

[mstange]

I can still reproduce this. Make sure that your mouse is in the "low" part of the orange graph while you scroll down, so that the "hover dot" is as low as possible.