Save & Share Buttons Go Missing

[sliceanddice9]

Have you tried to find similar issues (open or recently closed)?

• Yes, this issue is not a duplicate

Browser

Mozilla Firefox

Browser Version

129.0.2

Extension or Userscript?

Extension

Extension/Userscript Version

3.0.0.17

Video link where you see the problem

https://www.youtube.com/watch

What happened?

The row of buttons under the video player like Save and Clip sometimes get automatically collapsed/redirected into the overflow menu when Return YouTube Dislikes is enabled.

When this happens only the Share button in the UI remains visible on-screen. A simple refresh of the page brings back the Save & Clip buttons, but it' annoying having to do this to bring the buttons back.

This issue does not occur when the Return YouTube Dislikes extension is disabled, or when using the KellyC Show YouTube Dislikes extension.

How to reproduce/recreate?

Click a video thumbnail from your home feed or subscription feed, and once the https://www.youtube.com/watch page loads up - the Clip & Save buttons are missing.

Will you be available for follow-up questions to help developers diagnose & fix the issue?

Yes

[Gomido]

With ReturnDislikeButton

without

I only use the save button, the rest are hidden by the filter in adblock. After disabling adblock and enabling retundislike, the buttons hide in the 'more' menu (3 dots). Only the share button remains.

[jpa102]

that's because of the issue #1074, the extension now hides the "extra" buttons so the youtube page does not break

browse comments in the issue to see why is this extension now doing that

[sliceanddice9]

that's because of the issue #1074, the extension now hides the "extra" buttons so the youtube page does not break

browse comments in the issue to see why is this extension now doing that

Oh okay.

The 'KellyC Show YouTube Dislikes' extension does not have this same issue. All the "extra" buttons show up on the YouTube page perfectly fine, and the YouTube page itself never breaks.

[GitGitu79]

that's because of the issue #1074, the extension now hides the "extra" buttons so the youtube page does not break
browse comments in the issue to see why is this extension now doing that

Oh okay.

The 'KellyC Show YouTube Dislikes' extension does not have this same issue. All the "extra" buttons show up on the YouTube page perfectly fine, and the YouTube page itself never breaks.

Just want to inform that KellyC do have the same issue as reported here NC22/KellyC-Show-YouTube-Dislikes#28

I don't know if they will fix it as the last commit in their repository is 4 months ago

[jpa102]

Just want to inform that KellyC do have the same issue as reported here NC22/KellyC-Show-YouTube-Dislikes#28

i also commented on that issue

copy pasting the screenshots with zoom percentage set to 50% (nc22's extension and anarios's extension)

even when zoomed out to 33%, the screenshot with anarios's extension will still not make the extra buttons show up even though there's enough space

oddly enough, the userscript version doesn't have this behavior, unless you resize the browser window small enough that the yt code is making the extra buttons hidden

[mastermajorman]

Hey All,

I'm not a great frontend dev, but the reason this seems to be happening is due to the expected behavior of the like, dislike, share, thanks, save, and more buttons. As you can see, without the extension installed they are all located under the ytd-menu-renderer element:

With the first three having their own separate inner div:

The next two having their own separate div:

And the more button having its own custom element:

The default behavior of the ytd-menu-renderer is as follows:

• On page load, determine if there is enough real estate on the screen to display all buttons
• If there is enough room for all buttons, then display them
• If there is not, then only display the like, dislike, and share buttons
• If ytd-menu-renderer loses real estate, collapse each button one at a time starting on the right
• If the ytd-menu-renderer gains real estate, expand whatever is hidden in the "more" section besides the report button

Now, back to the issue at hand. As you can see, we position the like/dislike bar inside of the like, dislike, and share div which is the first element in the ytd-menu-renderer:

The styling applied is position: absolute, bottom: -10px, display: block, height: 2px, which should allow the like/dislike bar to be added without interfering with the button renderer. However, it seems the ytd-menu-render does more than just check for available real estate as hinted at by the attributes below:

The safe-area, has-items, and has-flexible-items attributes are custom attributes Youtube likely uses to handle internal functionality / dynamic styling. And, unfortunately, we seem to be intermittently breaking that functionality. I'm still looking into how we can avoid doing this...

[jpa102]

due to the expected behavior of the like, dislike, share, thanks, save, and more buttons

On page load, determine if there is enough real estate on the screen to display all buttons

• If there is enough room for all buttons, then display them
• If there is not, then only display the like, dislike, and share buttons
• If ytd-menu-renderer loses real estate, collapse each button one at a time starting on the right
• If the ytd-menu-renderer gains real estate, expand whatever is hidden in the "more" section besides the report button

that's indeed true. if you were to resize the browser window / zoom in & out the page (no matter if the page is loading or completely loaded), the other buttons go in the three-dots "more" button

as a "temporary fix", now it has a js file "menu-fixer.js" that makes it only display the like, dislike, share, and three-dots button

[mastermajorman]

Gotcha, so here?

I'll spend a couple hours tonight to see if I can't get a better solution here. I still haven't seen what is meant by "endless loop," but then again I haven't debugged at all.