Top tab border wrong size with Pinned Tab Sizing shrink when scrolling/wrapping

[bpasero]

Testing #193991

Enable workbench.editor.highlightModifiedTabs and make a pinned editor dirty. Notice how the blue color appears over the entire tab bar:

VS in stable:

[benibenj]

My investigation: workbench.editor.highlightModifiedTabs is not causing this but the pinned tab sizing. It causes the tabBorderTopContainer to have the wrong width only when the tab bar starts scrolling/wrapping. Not sure how having two tab rows is causing this. Still working on it...

[benibenj]

So the bug is actually also in stable, however, it's likelier to occur when using the two tab bars feature.

[benibenj]

I believe that position static is causing the problem. .tab-border-top-container has width 100% and is set to position absolute (left: 0;), .tab is set to position relative. However, when .tab changes to position static, the reference point changes and the left:0; doesn't point to the left of the tab but the entire tab container as well as the width...

[bpasero]

Hm, from my memory position: static is to let pinned tabs stay positioned even when a scrollbar is needed. In that case, essentially all unpinned tabs would scroll "under" the pinned tabs.

But when tabs wrap, I believe we would not need position: static at all unless there are so many tabs that we fallback to scrolling.

Were you able to reproduce when only 1 tab bar shows?

[benibenj]

This is stable release

[bpasero]

Wow! I wonder why nobody reported this so far 🤔