Greasy Fork

Hey,
So I wanted to cleate a script to automatically always open youtube 'Chapters' if a video has them as youtube doesnt have it as an option.
So dont laugh too hard but I repurposed a tiny script(I imagine this is a terrible way to do this lmao):

var timesRun = 0;
var interval = setInterval(function(){
timesRun += 1;
if(timesRun === 20){
clearInterval(interval);
}
document.getElementsByClassName("ytp-chapter-title ytp-button")[0].click();
}, 100);

but it was almost enough but it needs to be able to check for hash changes so it reruns when not fully refreshing a page.
If anyone can help me to knowing what Im doing I would appreciate it.

window.addEventListener("hashchange", checkForValidUrl, true);

Thanks guys

Use MutationObserver, here's the entire script:

let lastBtn; 
new MutationObserver(() => {
  const btn = document.querySelector('ytp-chapter-title ytp-button');
  if (btn && lastBtn !== btn) {
    lastBtn = btn;
    btn.click();
  }
}).observe(document, {subtree: true, childList: true});

Also make sure your @match covers the entire site e.g. @match https://www.youtube.com/*

Hey,
Seems just a little better then my solution, thank you.
Unfortunately doesn't seem to work though, any ideas?
I tried changing the Selected Div because I just picked one that worked in the first place and didn't know which level would be best.
Yeah I blacklisted youtube, thank you.

*Doesnt seem to work in any case that is sorry

Indeed, I made a mistake.

Anyway here's another approach, the entire script:

document.addEventListener('yt-navigate-finish', () => {
  const container = document.querySelector('.ytp-chapter-container');
  const mo = new MutationObserver(() => {
    container.querySelector('button')?.click();
    mo.disconnect();
  });
  mo.observe(container, {attributes: true, attributeFilter: ['style']});
});

Oh wow well done. Looks like it'll work flawlessly.

There's an easy Script you can add to your collection.

I really appreciate it. Thanks a bunch.
Take care,
Hayden.