YT Code change broke it

[MikeSummit]

Hi Erkam,

I am a novice JS coder and a total noob github user. I riffed on your ad skipper code to make a set of bookmarklets that I find highly convenient. Here it is: https://github.com/MikeSummit/VideoBookmarklets/tree/main

A recent YT code change broke the ad skipper code I found in your project. I would like to contribute, but I have not figured out how to discover new querySelector and getElementsByClassName that are needed when YT code changes. How do you find these? If you tell me I will help you keep them up to date.

Thanks

[erkamguresen]

Hi Mike, I see that

• you started a profile recently
• you only committed to the above
• your repo is private
• the repo noted different repos for selector to skip ads
• Could not easily find any info on you.

Thus I would say with a high probability, you are a youtube red team employee or a ads skipper product employee, trying be up to date ad skipping methods.

Anyway this repo was education/demo proposes only, thus it will not be further developed.

Regards

[MikeSummit]

Hi Erkam,

• I do not work at google or any other affiliated company. Frankly I think they are evil. I do not work at any ad skipping company or affiliate.
• I made this account 6+ years ago but didnt use it and it got nullified so I had to reestablish as if new.
• Mike Summit is not my real name. I never use my real name on the web. I dont do facebook, or twitter, or instagram or any other social media because I prefer real life in the real world.
• I used to be a professional developer a long time ago (C++, VB6, Java), but now I am just a hobbyist and thus I dont know Github etiquette.
• I made the repo private because if too many people start using these ideas, YT will probably easily find ways to make it impossible to anonymously watch videos and skip annoying ads. I have shared it only with a few close friends who promised not to re-share it. - Could you see my code ( 1 file with several bookmarklets in it)? I invited you to the private repo but I am not a skilled github user and dont know if I did this right.

I understand your hesitance to share improvements that overcome recent YT code changes. Can you at least help me figure out how to find the new element names? If I get it working I will keep it private and share it only with you.

Conceptually, I tried the following, but have never been able to find the element names you and others used:

• list all elements with a click
• listen to all clicks
• listen to all events

Here is some of the code I tried, but it never bore fruit:

// https://stackoverflow.com/questions/2878445/get-all-elements-with-onclick-in-them javascript:(() => { var allElements = document.getElementsByTagName('*'); for (var i = 0; i < allElements.length; i++) { if ($._data(allElements[i])['events'] != undefined && $._data(allElements[i])['events']['click'] != undefined) { console.log(allElements[i]); for (var ii = 0; ii < $._data(allElements[i])['events']['click'].length; ii++) { console.log($._data(allElements[i])['events']['click'][ii].handler); } } }})();

// https://stackoverflow.com/questions/2878445/get-all-elements-with-onclick-in-them javascript:(() => { var allElements = document.getElementsByTagName('*'); for ( var i = 0; i<allElements.length; i++ ) { if ( typeof allElements[i].onclick === 'function' ) { console.log( allElements[i] ); console.log( allElements[i].onclick ); } }})();

javascript:(() => { document.addEventListener('click', function(e) { console.log( e.target.id );})})();

javascript:(() => { console.log(document.innerHTML().id);})();
javascript:(() => { console.log(document.querySelectorAll('*[id]').id);})();
javascript:(() => { console.log(document.querySelectorAll('ytp-ad*[id]').id);})();
javascript:(() => { console.log(document.querySelector('[id^=ytp]').id).click();})();
javascript:(() => { console.log(document.querySelector('[class^=ytp]').id);})();
javascript:(() => { document.querySelector('[id^=ytp]').click();})();

[erkamguresen]

I would use dev tools (F12) for chrome to inspect it. Left corner there is a selector you can click that then some element on the page. It will open the html document. There you can find the elements. First I would look for id, if no id is there I would look for "data" attribute or a class name. But class name or data might not be unique, thus I would search for a unique one. Then I would try it on console to see if it is selecting correctly. Note that for security reasons bokmarklets or js injection will not work on iframe (and whats inside). They are blocked by web browser. Thats the reason I would check in console. If it works in console then it works. You can also copy paste the js code to the console, to try if it works.

[MikeSummit]

Hi Erkam,

Thanks for the tip! I didnt know about that left corner tool. I knew I could mouse over code in F12 to see the element highlighted on the rendered page, but I never knew about the tool to do the other direction. Simple gaps in knowledge can be so debilitating!

The recent bookmarklet code that had been working and then stopped working, started working again, so YT must have reverted their code.

While it was not working, I used your suggestion above and found two slightly modified names that I was not catching before: [ytp-preview-ad, ytp-skip-ad-button]. I intended to try to incorporate these new names over the weekend, but the old bookmarklet started working again so I did not make any changes.

If it breaks again I will try to fix and post the fix in my private repo so you can see the fix. I will keep the repo private.

Thanks Mike

[MikeSummit]

Hi Erkam,

I made some(big?!?) improvements. I hope you like. Please keep it private. I would appreciate:

1. Your full criticism of my evolving .JS coding skills
2. Am i communicating with you correctly according to github etiquette?

Thanks Mike