Greasy Fork is available in English.

Youtube - Fix channel links in sidebar recommendations

Fixes the channel links for the "Up next" and recommended videos below it on youtube.

< Feedback on Youtube - Fix channel links in sidebar recommendations

Question/comment

§
Posted: 22.3.2022

I wrote a script that takes a different approach for fixing the channel links, and it seems to work really well so far. I don't want to publish it, but I figured I should at least share it here in case you or someone else find it useful.

const DEFAULT_TAB_ENDPOINT_PARAMS = encodeURIComponent(btoa(String.fromCharCode(0x12, 0x06) + "videos")); // Magic for going directly to the videos tab without page reload

document.addEventListener('mouseover', event => {
let hovering = event.target
try {
if (hovering.__data.text.runs[0].navigationEndpoint.commandMetadata.webCommandMetadata.webPageType === "WEB_PAGE_TYPE_CHANNEL") { // If hovering a channel name
let titleElement = hovering.offsetParent.children[0].children[1].children[0].children[0] // Finding the element with the video link we need to modify
let url = hovering.__data.text.runs[0].navigationEndpoint.commandMetadata.webCommandMetadata.url + "/videos" // The channel name element contains all the link info
titleElement.data.commandMetadata.webCommandMetadata.url = url // Changing the whole title element to take us to the channel instead of the video
titleElement.href = url // because I can't figure out how to just allow the channel name itself to be the link.
titleElement.data.commandMetadata.webCommandMetadata.webPageType = "WEB_PAGE_TYPE_CHANNEL"
titleElement.data.browseEndpoint = hovering.__data.text.runs[0].navigationEndpoint.browseEndpoint
try {
titleElement.data.browseEndpoint.params = DEFAULT_TAB_ENDPOINT_PARAMS; // browseEndpoint.param magic to make the link take us to the channel without page reload
}catch (e) {}
return
}
}catch(e){}

try { // This changes the video title links back to normal, when we're not hovering the channel name
if (hovering.offsetParent.children[0].children[1].children[0].children[0].children[0].children[1].id === 'video-title') { // If hovering a video title in the sidebar
let titleElement = hovering.offsetParent.children[0].children[1].children[0].children[0] // Finding the element with the video link we need to modify
let url = "/watch?v=" + titleElement.data.watchEndpoint.videoId // The link can conveniently be restored this way, without having to store the original link
titleElement.data.commandMetadata.webCommandMetadata.url = url
titleElement.href = url
titleElement.data.commandMetadata.webCommandMetadata.webPageType = "WEB_PAGE_TYPE_WATCH"
}
}catch(e){}
})

1N07Author
§
Posted: 30.3.2022

Nice work!

Looks like you are using event delegation by binding a mouseover event listener directly to the document, which lets us not have to worry about the fancy ways that YT loads pages without a full page load since the element you are binding to is never removed (document).
However, that does mean that the script is being run constantly over and over again whenever hovering over any element. It's not like the script is heavy, so it's probably fine, but still...

That being said, it's still better than the clumsy way I did it back when I wrote my script.

Since you aren't publishing it, if you'll allow me, I might use this later when I find the time (might try to improve a few things). With attribution of course.

Post reply

Sign in to post a reply.