Greasy Fork

Instead of using a MutationObserver which runs the page-change-check whenever any part of the page changes even slightly, you could use YouTube's built-in event dispatched when navigation finishes. I use this in a script I wrote and it is reliable. Below is an example I wrote, which works identically to this script without wasted/excessive background activity through the MutationObserver method:

const customLog = (...v) => console.log('Youtube shorts redirect:', ...v)

function main() {
    const l = window.location
    customLog('Running check against...', l)
    if(l.pathname.startsWith('/shorts/')) window.location.replace(l.href.replace('/shorts/', '/watch?v='))
}

window.addEventListener('yt-navigate-finish', main)
main()
customLog('Initialized.')

The above isolated the check to the main() command and then adds it with the aforementioned event listener, as well as running the check initially. Technically there is the issue of this running twice on initial loads and after switching from a short (since that causes a hard reload). Ideally the code could cause a soft page change to the "watch" version, but that's not something I'd enjoy unraveling, either.

Anyway, feel free to do whatever with the above. My goal was to discourage MutationObserver checking every element change everywhere just to see if the page changed.

This code worked for me while the original script did not.

Instead of using a MutationObserver which runs the page-change-check whenever any part of the page changes even slightly, you could use YouTube's built-in event dispatched when navigation finishes. I use this in a script I wrote and it is reliable. Below is an example I wrote, which works identically to this script without wasted/excessive background activity through the MutationObserver method:

const customLog = (...v) => console.log('Youtube shorts redirect:', ...v)

function main() {
    const l = window.location
    customLog('Running check against...', l)
    if(l.pathname.startsWith('/shorts/')) window.location.replace(l.href.replace('/shorts/', '/watch?v='))
}

window.addEventListener('yt-navigate-finish', main)
main()
customLog('Initialized.')

The above isolated the check to the main() command and then adds it with the aforementioned event listener, as well as running the check initially. Technically there is the issue of this running twice on initial loads and after switching from a short (since that causes a hard reload). Ideally the code could cause a soft page change to the "watch" version, but that's not something I'd enjoy unraveling, either.

Anyway, feel free to do whatever with the above. My goal was to discourage MutationObserver checking every element change everywhere just to see if the page changed.

you have good idea, but use more fantasy :)


function Convert_to_Real_Video() {
let css = document.createElement('style');
css.innerHTML = `
/*================================
AIO created element CSS
==================================*/
.Mylogo2 {
font-size: 16px !important;
font-weight: bold !important;
text-align: center !important;
border: 1px solid transparent;
background-color: transparent;
/*border: none!important;*/
height: 30px !important;
width: auto !important;
cursor: pointer !important;
display: inline-block !important;
float: left !important;
justify-content: flex-start !important;
padding-top: 18px

}

/*================================
AIO element end
==================================*/

.svg-text {
margin-top: -8px !important;
margin: 0px;
animation: livefont 3s linear infinite;
}

@keyframes livefont {

0% {
fill: #ffd600;
}
25% {
fill: #FF7500;
}
50% {
fill: #FF0300;
}
75% {
fill: #FF7500;
}

100% {
fill: #ffd600;
}

`;
document.head.appendChild(css);
let btn = document.createElement("AIO");
btn.className = "Mylogo2";
btn.id = "MylogoID2";
btn.title = "Redirecting shorts to real video";
btn.innerHTML = "Show Real Video";
btn.addEventListener("click", Go_To);
function Go_To() {

const customLog = (...v) => console.log('Youtube shorts redirect:', ...v)

function main() {
const l = window.location
customLog('Running check against...', l)
if (l.pathname.startsWith('/shorts/')) window.location.replace(l.href.replace('/shorts/', '/watch?v='))
}

window.addEventListener('yt-navigate-finish', main)
main()
customLog('Initialized.')
}
document.querySelector("#navigation-button-down").appendChild(btn);

}

setInterval(function () {
// search
if (document.querySelector(".svg-text")) {
// console.info("AIO exist");
} else {
console.info("AIO not found - Restart Function");
Convert_to_Real_Video();
}

}, 1000);


I wouldn't advise have the code like that, as it introduces issues and walks back the purpose of my original suggestion.

Instead of using a MutationObserver which runs the page-change-check whenever any part of the page changes even slightly, you could use YouTube's built-in event dispatched when navigation finishes. I use this in a script I wrote and it is reliable. Below is an example I wrote, which works identically to this script without wasted/excessive background activity through the MutationObserver method:

Your code works but when you click on a shorts video the audio plays for like a second before it redirects. It's a bit annoying. Any way to fix that?

This script doesn't do that.

Instead of using a MutationObserver which runs the page-change-check whenever any part of the page changes even slightly, you could use YouTube's built-in event dispatched when navigation finishes. I use this in a script I wrote and it is reliable. Below is an example I wrote, which works identically to this script without wasted/excessive background activity through the MutationObserver method:

Your code works but when you click on a shorts video the audio plays for like a second before it redirects. It's a bit annoying. Any way to fix that?

This script doesn't do that.

you could use document.querySelector('video').ondurationchange = { code }
instead for instant change

you could use document.querySelector('video').ondurationchange = { code }
instead for instant change

where do I put that?