1212839 - Notification popup icon box padding is larger when forward button is disabled, leading to visual "jump" when clicking the forward button (and keeping it hovered)

Status: NEW

(Firefox :: Theme, defect)

Description

[:Gijs (he/him)]

(In reply to :Gijs Kruitbosch from bug 1173744 comment #20)
> >  @conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #notification-popup-box {
> > +  padding-left: calc(var(--backbutton-urlbar-overlap) + 3px);
> 
> Unrelated bug I noticed:
> 1. new tab
> 2. open html5demos.org/geo
> 3. append "#foo" to the URL and hit enter
> 4. click the back button
> 5. click the forward button and keep the mouse hovering over it
> 
> Note how the left padding has now increased significantly. This issue
> predates your patch. I'm not really sure how hard fixing this would be, but
> there we are. Depending on how you feel, maybe you want to file a followup?
> (I imagine the noticeability/severity of the bug depends on how high the
> backbutton-urlbar-overlap is...)

So basically, the issue is that following the steps above, the geolocation icon (and you could do this with pretty much anything that ends up in the notification-popup-box, like the passwords icon, or the pointer lock one, or ...) and everything else in the location bar shifts to the right because the forward-button has become disabled but hasn't animated out of the way yet.

I don't know if we can catch this situation in a neat CSS selector right now, or if there is some way of fixing the different overlap/padding values such that there isn't such a large difference.

Maybe just :not(:hover) on the #forward-button could do it?