YouTube-Enhancer / extension

A browser extension to enhance YouTube
MIT License
115 stars 8 forks source link

[Bug Report] Extension fails to load / have effect on YouTube with new layout. #526

Closed sjclayton closed 1 week ago

sjclayton commented 3 weeks ago

Describe the bug

Extension fails to load or take effect on YouTube pages with the new layout. Sometimes it will load after a page refresh, sometimes it won't... It is completely random. Sometimes you can refresh the page 6 times and it still won't load, and then hit refresh again and it's fine. I've tried disabling any other extensions that are running that would affect YouTube pages, eg. ad-block and style related extensions, both have no effect on whether or not Enhancer will load.

To Reproduce

Open any video on YouTube.

Expected behavior

Extension should work as intended.

Desktop (please complete the following information):

VampireChicken12 commented 3 weeks ago

@sjclayton I haven't had that issue, I've been testing the new layout with my YouTube premium subscription for a week and haven't had any issues. I can try to reproduce the issue.

What version of the extension are you using?

VampireChicken12 commented 3 weeks ago

I use chrome so it is possible the issue is related to firefox

sjclayton commented 3 weeks ago

What version of the extension are you using?

Latest

VampireChicken12 commented 3 weeks ago

What version of the extension are you using?

Latest

latest being what version... I ask because people have confused this extension for another extension

sjclayton commented 3 weeks ago

What version of the extension are you using?

Latest

latest being what version... I ask because people have confused this extension for another extension

Version 1.25.0, people confuse this extension with the old extension of basically the same name that was awesome, and the extension you are developing has the potential to be just as awesome, but YouTube and Google seem to be consistently hampering your ability to actually get there.

VampireChicken12 commented 3 weeks ago

What version of the extension are you using?

Latest

latest being what version... I ask because people have confused this extension for another extension

Version 1.25.0, people confuse this extension with the old extension of basically the same name that was awesome, and the extension you are developing has the potential to be just as awesome, but YouTube and Google seem to be consistently hampering your ability to actually get there.

thanks, true at the time of coming up with the name of my extension I didn't know about Enhancer for YouTube but I'll admit it is similar. That they do

VampireChicken12 commented 3 weeks ago

@sjclayton can you attach logs from the extension when it fails to load, if there are any logs that is.

VampireChicken12 commented 3 weeks ago

I'm testing with Firefox version 127 on Windows 10, currently the extension is enabling fine. I don't have a machine to test with Linux unfortunately.

MooWantFree commented 2 weeks ago

I have encountered the same issue. My device is Windows 11, using the Chrome browser, and the extension version is v1.25.0. you can see that this is the new YouTube layout, the extension do works, because it has remaining time and I can use scroll wheel to control volume, but there is no feature menu. image After I returned my Youtube to the old version of the layout, the feature menu appears. image I used uBlock with some code provided on Reddit, thus reverting the layout of YouTube to the old version. I hope my description above can help you pinpoint the issue.

VampireChicken12 commented 2 weeks ago

@MooWantFree There are a few known bugs with the new layout I have yet to fix. Not complete

Working:

VampireChicken12 commented 2 weeks ago

Automatic theater mode

here is the working version, two detection methods are used here

  1. API call isTheater_()
  2. compare player/screen width

Activation occurs through emulation of pressing a global key. A few months ago I was digging through the youtube code and discovered that the API had been renamed from setPlayerTheaterMode_() in updateTheaterModeState_() but I don’t remember why I left it. There is also a way to detect and influence via cookies, but it is inert and I have not found a way to trigger the page without updating the page

NOVA.waitSelector('.ytd-page-manager[video-id]:not([player-unavailable])')
        .then(el => {
           if (isTheaterMode()) return;

           NOVA.waitUntil(() => isTheaterMode() ? true : toggleTheater(), 1000);

           function isTheaterMode() {
              return (
                 // (el.hasAttribute('theater') // old
                 (typeof el.isTheater_ === 'function' && el.isTheater_())
                 || approximatelyEqual(movie_player.clientWidth, window.innerWidth, .05)
                 // || (NOVA.cookies.get('wide') === '1') // unreliable inert method
              );

              function approximatelyEqual(num1 = required(), num2 = required(), tolerance_pt = .05) {
                 // Calculate the absolute difference between the numbers
                 const absDiff = Math.abs(num1 - num2);
                 // Get the larger number's absolute value
                 const largerAbs = Math.max(Math.abs(num1), Math.abs(num2));
                 // Check if the absolute difference is less than the tolerance (5%) times the larger number
                 return absDiff < (tolerance_pt * largerAbs);
              }
           }

            function toggleTheater() {
              // Strategy 1 (API)
              // document.body.querySelector('.ytd-page-manager[video-id]').setPlayerTheaterMode_(); // Doesn't work
              // el.updateTheaterModeState_(true);

              // Strategy 2 (Hotkey)
              (typeof movie_player === 'object' ? movie_player : document) // window.dispatchEvent - Doesn't work!
                 .dispatchEvent(
                    // Keyboard code - https://docs.microsoft.com/en-us/dotnet/api/android.views.keycode?view=xamarin-android-sdk-12
                    new KeyboardEvent(
                       'keydown',
                       {
                          keyCode: 84,
                          key: 't',
                          code: 'KeyT',
                          which: 84,
                          // target: document.body,
                          bubbles: true,
                          cancelable: false,
                       }
                    )
                 );

              // Strategy 3 (Emulate button press)
              // document.body.querySelector('.ytp-chrome-bottom .ytp-size-button').click();

              // Strategy 4 (Cookie) (Doesn't work without refreshing the page)
              // document.cookie = 'wide=1;domain=.youtube.com';
              // NOVA.cookie.set('wide', 1, 99);
           }

my code works I just need to fix what is causing it to not work with the new layout

VampireChicken12 commented 2 weeks ago

try adding highlight markers Which page elements does the script click on

sizeButton.click();
sizeButton.style.border = '2px solid blue'; // mark for test

I believe the problem is either that the click occurs on another hidden element. or the listener has not yet connected to the button

not sure I haven't even started trying to fix any of the broken features

VampireChicken12 commented 1 week ago

I'm going to start working on fixing broken features in the new layout later today

VampireChicken12 commented 1 week ago

fixed:

VampireChicken12 commented 1 week ago

Fixed in 742be90