Manual refresh needed to run script when Watch List is opened via YouTube ☰ Menu

[alvinchitena]

Platform: Windows 11 x64 Browser: Brave Browser [Version 1.66.118 Chromium: 125.0.6422.147] Extension: Tampermonkey 5.2

When I open the YT Watch List page by opening YouTube dot com, then clicking on Watch List in the ☰ Menu, the script doesn't run. It only runs after a manual page reload. This doesn't happen though if I go directly to the Watch List URL without opening YouTube dot com. I know that this has something to do with "fake navigation," backed up by the following warning I got when I tested the script on Violentmonkey:

I don't mind the reload to run the script, but I was just curious if there is a technical solution to this issue? Thanks for the great script!

[alvinchitena]

Here is a link to a discussion on the Violentmonkey repo about the same issue. My web dev technical proficiency is average, but I figured the in-depth technical discussion about SPAs is useful to someone like you.

Here is a link to an answer that someone provided on Stack Overflow that they claim can be a workaround to the SPA issue. Curious to hear what you think about that, too. Sorry if this is too much work for you.

[KohGeek]

Hi, sorry for the delays, I'm a little swamped in life and work, I'll try to see if I can get this working in the next month.

Seems to me the change is relatively approachable, but you never know, thanks for the report.

[richardmtl]

And as of today, the Manual Refresh doesn't work anymore for me on Canary (Mac) : Version 129.0.6628.0 (Official Build) canary (arm64) nor on production Chrome either : Version 127.0.6533.89 (Official Build) (arm64)

[Shatteredhelix42]

As of today, the first of August 2024, there's nothing I can do to get the script to work. Direct linking my watch later list, refreshing, nothing is working. It did work fine yesterday.

Browser version information: Microsoft Edge Version 127.0.2651.74 (Official build) (64-bit) Tampermonkey 5.1.1

[KohGeek]

You spoke the forbidden word, "nothing is working" and now I'm here. Let me see.

[KohGeek]

Using VioletMonkey and Edge, I have issues with detecting whether the playlist is fully loaded, but I'm not sure that's the case here for everyone else. In both of your cases is it just it won't start loading at all? Where is the script stuck at?

[richardmtl]

I don't know how to answer you exactly. For me, the buttons just don't appear, even after multiple refresh. Let me know what I can do to get you more useful information.

[KohGeek]

This seems to be an issue with TamperMonkey again, can you try ViolentMonkey and let me know the results? I'll check on my end when I'm free

Edit: See Issue #3 for when this was reported in Chrome Canary, I believe as part of Manifest v3 changes

[richardmtl]

No go. Multiple Refreshes on the WL or other playlist, and no buttons appear.

[szebrowski]

For me, on one account I can see UI from the script, on another it doesn't see it, but I could see it like yesterday.

Maybe YT pushed some UI changes on WL page and the selector doesn't work anymore?

I'm testing it on Violentmonkey.

edit: I can see that every time the video is moved to another position in WL playlist, YT is trimming the the list of loaded videos. And because of that script is stuck on the "Playlist is not fully loaded, waiting...".

[Shatteredhelix42]

This seems to be an issue with TamperMonkey again , can you try ViolentMonkey and let me know the results? I'll check on my end when I'm free

Okay, I got it working using Tampermonkey in Firefox. I just sorted an 81-video playlist and had no issues except that I had to use Firefox, not my preferred browser by a long shot. However, it's better than nothing if it'll let me sort videos again. I still had no luck getting it to work in Edge with either Tampermonkey or Violentmonkey, there just aren't any buttons no matter how many times I refresh. Everything is up to date.

[Darkle]

I get the following error in edge:

TypeError: Failed to set the 'innerHTML' property on 'Element': This document requires 'TrustedHTML' assignment.
    at addCssStyle (Sort Youtube Playlist by Duration.user.js:387:23)
    at Sort Youtube Playlist by Duration.user.js:519:9
    at Sort Youtube Playlist by Duration.user.js:69:17
    at Sort Youtube Playlist by Duration.user.js:39:9
    at NodeList.forEach (<anonymous>)
    at queryForElements (Sort Youtube Playlist by Duration.user.js:36:17)
    at MutationObserver.<anonymous> (Sort Youtube Playlist by Duration.user.js:67:13)

TrustedHtml seems to be this: https://developer.mozilla.org/en-US/docs/Web/API/TrustedHTML

[KohGeek]

I get the following error in edge:

TypeError: Failed to set the 'innerHTML' property on 'Element': This document requires 'TrustedHTML' assignment.
    at addCssStyle (Sort Youtube Playlist by Duration.user.js:387:23)
    at Sort Youtube Playlist by Duration.user.js:519:9
    at Sort Youtube Playlist by Duration.user.js:69:17
    at Sort Youtube Playlist by Duration.user.js:39:9
    at NodeList.forEach (<anonymous>)
    at queryForElements (Sort Youtube Playlist by Duration.user.js:36:17)
    at MutationObserver.<anonymous> (Sort Youtube Playlist by Duration.user.js:67:13)

TrustedHtml seems to be this: https://developer.mozilla.org/en-US/docs/Web/API/TrustedHTML

Jackpot find, related to https://github.com/violentmonkey/violentmonkey/issues/1873

I'll try to push up a fix when I'm free in around 6 hours.

[KohGeek]

To everyone having issues, try 3.0.2, just uploaded. Totally didn't just code things up on a phone 😂

Edit: oh shit, I use innerHTML in a lot of places, I don't think 3.0.2 will fix everything. I confused innerText with innerHTML while on the phone haha, please let me know if it works.

[szebrowski]

UI works again for me

[richardmtl]

Works for me as well! Thank you!

[KohGeek]

Added with latest commit

[Shatteredhelix42]

Confirmed working again in Edge with Tampermonkey AND I don't have to refresh the page anymore to get the buttons to pop up, great work that you totally didn't do on your phone.

[alvinchitena]

I have bad news... The buttons now show up on hot navigation to "Watch List" without refresh, but they don't work. If you click Sort, it scrolls down to the bottom of the page and displays "Loading more videos - x videos loaded." Nothing happens. If you click Sort again, nothing happens.

If you navigate away from the Watch List page, then come back and click Sort, it gets stuck in a loop of "Loading more videos - x videos loaded" and "Playlist not fully loaded, waiting..." In both scenarios, the scroll down to the bottom of the page is persistent, meaning if you try to scroll up, the page keeps scrolling down. Manual refresh fixes everything, as always.

Tested on Brave and Edge with both Tamper and ViolentMonkey. @Shatteredhelix42 @KohGeek can you confirm on your end if this is the behavior?

[richardmtl]

@alvinchitena sounds similar to my #7 . Note that for me, the buttons DO work as expected on my Watchlist https://www.youtube.com/playlist?list=WL

[KohGeek]

Youtube broke the way I detect the end of loading, so I gotta come up with a new way, but this is unrelated to this change, should be related to #7 and #6 both.

[Shatteredhelix42]

@alvinchitena I have had this exact behavior in the past, and the workaround I have found is to scroll down all the way to the bottom of the list first and make sure all of the thumbnails load, then you can scroll back up to the top and hit the button with no issues. I also use sort only loaded instead of sort all.

[alvinchitena]

@richardmtl Do you navigate directly to the YT Watch Later URL? If you do, that counts as a "manual refresh," as the browser loads the WL page from scratch, as opposed to the "hot navigation" Single-Page Application magic it does otherwise, e.g. open YT Homepage then click Watch Later. It's either that or something to do with you being on macOS instead of Win 11.

@Shatteredhelix42 I tried your suggestion, and it doesn't work (anymore). Switching to "Sort only loaded" and scrolling to the bottom doesn't change the behavior for me. Hopefully it's all just related to the end of loading detection issue and will be fixed when that's solved.

[KohGeek]

My code, albeit edited, is working with hot navigation. So let's see if the WIP update will fix everything

[alvinchitena]

The latest version of the script (3.1.0) works on all playlists. Buttons load on hot navigation and sort works without manual refresh. Test on Brave and Chrome Canary Browser. Your commit notes suggest you will continue to work on it. I'll try my best to promptly provide feedback on any changes you make. Thank you very much for your effort @KohGeek.