Tampermonkey waitForKeyElements refreshes page after click and creates endless loop?

Question

I am trying to automatically click the "Still watching? Video Will Pause Soon" button on YouTube so that my videos don't stop after X amount of time. I have created a Tampermonkey/Greasemonkey script to click the button when it appears using waitForKeyElements. It seemed to work, as it clicks the popup. But sometimes it goes into an endless loop where it clicks the popup button and then refreshes the page. The button will pop up again after the refresh and then the button will get clicked again and repeat ad infinitum.

I have provided a screenshot of what I'm talking about. Notice the YouTube popup in the bottom left corner:

Here's the code for the Tampermonkey script:

// ==UserScript==
// @name     YouTube Yes 4
// @include  https://www.youtube.com/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// ==/UserScript==

waitForKeyElements (
    ".yt-button-renderer", click
);

function click (TargetLink) {
TargetLink = $("a:contains('Yes')")

if (TargetLink.length)
    window.location.href = TargetLink[0].href
}

Edit: Here is an updated script using .click()

waitForKeyElements (
    "tp-yt-paper-button#button.style-scope.yt-button-renderer.style-blue-text.size-default", clicks
);

function clicks () {
    $("tp-yt-paper-button#button.style-scope.yt-button-renderer.style-blue-text.size-default:contains('Yes')").click();
}

Any and all help would be deeply appreciated. Happy holidays!

You trigger the reload (`window.location.href = ..`). `.click()` the element instead. — double-beep, Dec 15 '21 at 13:08
Thanks for the response. Do you think the code in the edit of this post would suffice? also found here: https://jsfiddle.net/wjap3hdr/ — theCrabNebula, Dec 15 '21 at 21:03
`.click()` doesn't have a return value, so why do you assign it to a variable? The `.yt-button-renderer` selector is a bit broad (so is `a:contains('Yes')`) - there probably are quite a few elements that match. — double-beep, Dec 16 '21 at 04:54
Thanks, I recently edited the code with your suggestions. I tried using a much more specific set of selectors, as well. Sorry for any simple errors, my JavaScript skills are still pretty raw. Here's the updated code: https://jsfiddle.net/46zem9ag/. I also updated the code in the post. — theCrabNebula, Dec 16 '21 at 08:34
I recently updated my script and would be thrilled if you could take a look and comment on it. I'm still early in my JavaScript learning, so I'm not quite sure if my syntax with regards to the function and a lack of variable/argument is correct. I also added a much more specific selector, as you recommended. Here's the new script: https://jsfiddle.net/7do9ystp/2/. Does anything seem off to you? — theCrabNebula, Jan 02 '22 at 12:07
`$(...)` returns a jQuery object, while `$(...)[0]` returns an `Element` (a JS object). Use `document.querySelector(...).click()` instead. You should also consider saving the selector in a variable instead of reusing it again and again. — double-beep, Jan 02 '22 at 12:11
Thanks for all the help. Here's the updated script using `document.querySelector()`: https://jsfiddle.net/5fxc3myu/1/. I'll save the selector as a variable shortly, just want to make sure everything else looks good. — theCrabNebula, Jan 02 '22 at 12:56

score 0 · Accepted Answer · answered Dec 29 '21 at 21:11

With the help of another Stack Overflow thread and the comments here, I was able to get a solution using a selector with contains() and the word "Yes," which appears in the popup button:

// ==UserScript==
// @name     YouTube Yes
// @include  https://www.youtube.com/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// ==/UserScript==

waitForKeyElements ("a.yt-simple-endpoint.style-scope.yt-button-renderer:contains('Yes')", clicks);

function clicks (jNode) {
    var clickEvent  = document.createEvent ('MouseEvents');
    clickEvent.initEvent ('click', true, true);
    jNode[0].dispatchEvent (clickEvent);
}

Tampermonkey waitForKeyElements refreshes page after click and creates endless loop?

1 Answers1