javascript - How to convert a jQuery filter for use with waitForKeyElements?

Question

This code removes tweets with less than 3 retweets, but now I have the refresh (AJAX) issue. How can I add the waitForKeyElements function to fix it?

$('.js-stream-item:has(span.ProfileTweet-action--retweet)').filter(function() {
    return parseInt($(this).find('span.ProfileTweet-actionCount').attr('data-tweet-stat-count')) < 3;
}).remove();

Answer 1

To convert a static jQuery filter, like that, to an AJAX-aware waitForKeyElements() use is not too hard:

1. Your base selector just becomes the selector parameter. EG:
   waitForKeyElements (".js-stream-item:has(span.ProfileTweet-action--retweet)"...

2. The filter(function() internals transfer to the waitForKeyElements callback almost as-is. See the script, below.

Note that when using parseInt(), you should always specify the base to avoid unexpected ("time bomb") behavior.

Here's a complete script showing the port, of that filter, to waitForKeyElements:

// ==UserScript==
// @name     _Remove or hide nodes based on jQuery filter
// @include  http://YOUR_SERVER.COM/YOUR_PATH/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// ==/UserScript==
/*- The @grant directive is needed to work around a design change
    introduced in GM 1.0.   It restores the sandbox.
*/
waitForKeyElements (
    ".js-stream-item:has(span.ProfileTweet-action--retweet)", removeFilteredNode
);

function removeFilteredNode (jNode) {
    var twtCnt  = parseInt ( 
        jNode.find ('span.ProfileTweet-actionCount').attr ('data-tweet-stat-count')
        , 10
    ) 
    if (twtCnt < 3)
        jNode.remove ();
}