Console Script to Trigger 3,000+ Consecutive Click-enabled Front-end Actions

Question

The Problem

Pushbullet, due to some bug caused by the outdated version of Android on my Asus Nexus 7, erroneously added the device thousands of times.

I need to delete all of these entries in a programatic way (via a script) because the sheer number of deletions (each requiring multiple clicks) is just too much to do manually. (And I've contacted Pushbullet but they will not help -- no beef. Seriously, I completely understand. Also PushBullet is awesome.)

The Code As It Is on Pushbullet's Device Listing Page

Originally, the buttons I need to click appear like this:

  <table class="crud" style="width:100%;white-space:nowrap">
    <tr>
      <td><input type="text" placeholder="nickname" value="Sony D5803" name="nickname" onchange="window._handler[12].apply(null, arguments);" onblur="window._handler[13].apply(null, arguments);" onkeypress="window._handler[14].apply(null, arguments);" /></td>
      <td>added 6 days ago</td>
      <td><button class="hover-red" onclick="window._handler[15].apply(null, arguments);">Delete</button></td>
    </tr>

    <tr>
      <td><input type="text" placeholder="nickname" value="Firefox" name="nickname" onchange="window._handler[20].apply(null, arguments);" onblur="window._handler[21].apply(null, arguments);" onkeypress="window._handler[22].apply(null, arguments);" /></td>
      <td>added 4 months ago</td>
      <td><button class="hover-red" onclick="window._handler[23].apply(null, arguments);">Delete</button></td>
    </tr>

    <-- I need to delete THESE entries below -->    
    <-- I need to delete THESE entries below -->    
    <-- I need to delete THESE entries below -->    
    <tr>
      <td><input type="text" placeholder="nickname" value="Asus Nexus 7" name="nickname" onchange="window._handler[28].apply(null, arguments);" onblur="window._handler[29].apply(null, arguments);" onkeypress="window._handler[30].apply(null, arguments);" /></td>
      <td>added 6 months ago</td>
      <td><button class="hover-red" onclick="window._handler[31].apply(null, arguments);">Delete</button></td>
    </tr>

    <tr>
      <td><input type="text" placeholder="nickname" value="Asus Nexus 7" name="nickname" onchange="window._handler[32].apply(null, arguments);" onblur="window._handler[33].apply(null, arguments);" onkeypress="window._handler[34].apply(null, arguments);" /></td>
      <td>added 6 months ago</td>
      <td><button class="hover-red" onclick="window._handler[35].apply(null, arguments);">Delete</button></td>
    </tr>
    <-- I need to delete THESE entries above -->    
    <-- I need to delete THESE entries above -->    
    <-- I need to delete THESE entries above -->    
    ...

After clicking the "Delete" button, A "Cancel" button goes in place of the "Delete" button, and the "Delete" button is moved to the side, next to the "Cancel" button.

In order for an item/device to be deleted, I need it to click the first "Delete" button, and then the second "Delete" button. I refer to them as "first" and "second" because originally the "Delete" button has the class ".hover-red" but after clicking it, the updated "Delete" button has class ".red" like so:

<tr>
    <td><input type="text" placeholder="nickname" value="Asus Nexus 7" name="nickname" onchange="window._handler[32].apply(null, arguments);" onblur="window._handler[33].apply(null, arguments);" onkeypress="window._handler[34].apply(null, arguments);" /></td>
    <td>added 6 months ago</td>
    <td>
<-- this is what the button code changes to once clicking a "Delete" button -->
        <button class="red" onclick="window._handler[39].apply(null, arguments);">Delete</button> 
        <button class="gray" onclick="window._handler[40].apply(null, arguments);">Cancel</button>
    </td>    
</tr>

What I've Tried So Far

I've tried many scripts, some simpler, some more convoluted, but none seem to work. So far, this gives best results. It clicks the buttons (though I can't tell in which order) but it does not delete any entries. This code is limited to 5 entries as when I do the whole list, it goes on for like 5 minutes without results -- at least this way I find out quickly that it's not working.

My selectors are correct because when I do console.logging, all the right stuff is selected, but the clicking still fails. Also to note, my code always leaves one of the buttons in the list open (as in, it successfully clicks the buttons, and the last "Delete" button clicked leaves a "Delete" button and a "Cancel" button in its place once the code is done running).

function deleteAsus() {
    var n;
    $('.crud input[value="Asus Nexus 7"]').each(function(){
        n++;
        if (n =< 5) {
            //console.log(this); //works!
            //console.log($(this).parent().parent().find('.hover-red')); //works!
            //console.log($(this).parent().parent().find('.red')); //works!
            $(this).parent().parent().find('.hover-red').click().delay(3000).parent().parent().find('.red').click();
            //$(this).parent().parent().find('.red').click();
        } else {
            return;
        }
    });
}
deleteAsus();

As you see in the code above, my latest attempt is in putting a delay between clicking "first Delete" button and "second Delete" button, but this seems to do nothing and the delay doesn't even seem to work at all.

I know it's difficult to help with this as it's not really possible to recreate the "Pushbullet device screen" code unless you have your own Pushbullet account, so if there is any way I can help you help me, please let me know (And show me the money!)

Could you delete your account and re-create it? That would delete all your devices. — Chris Pushbullet, Aug 01 '15 at 05:46
If that doesn't work I can write a script that does this for you. — Chris Pushbullet, Aug 01 '15 at 05:48
That probably would work and seems like a clean solution to cleanup PB, and if all else fails, I'll definitely do that. Pushbullet is def worth the trouble. But now, I really want to understand why my code doesn't work and how to make a front-end console script like this work. — Andre Bulatov, Aug 01 '15 at 05:57
Have you tried contacting PushBullet? They can probably do this with much greater ease. — Huey, Aug 01 '15 at 06:13
We have an API at https://docs.pushbullet.com/ and you can actually access it with javascript (this is what the website is doing). There's no need to perform click actions on the UI. — Chris Pushbullet, Aug 02 '15 at 18:32
@christopherhesse that sounds like an even better solution than your first suggestion, thank you. But I really want to know why my code is not working. Might you give some hints or explain why its not working? — Andre Bulatov, Aug 07 '15 at 02:32
Your code doesn't use the API, it uses click events, so I really have no idea. I don't work on the frontend javascript, and it's not meant to be used in that fashion. — Chris Pushbullet, Aug 07 '15 at 16:56
I know what you mean. My goal here is simply twofold, 1. learn how to make it work, 2. fix PB. 1 takes priority over 2, and I figure--with your suggestions--2 is already solved and I simply need to implement. In regards to API, I know there is an easy way to do this, but technically speaking, if I only had, say, 20 unnecessary devices, I would just manually click-delete them. I just want to learn how to emulate that user behavior and why my code is not accomplishing it, hopefully giving me a much better understanding of front end. — Andre Bulatov, Aug 08 '15 at 21:28

score 0 · Accepted Answer · answered Aug 23 '15 at 07:08

I've finally figured out a way to write this code to

Click first "Delete" button
Wait for 1.5 seconds for DOM to change --> the first button's class and position/CSS changes
Then to press the new Red "Delete" button
Finally, it waits another 1.5 seconds for good measure and restarts the process
This continues until all the devices with the duplicate name are deleted

It's deleting the duplicate devices, 1 per 3 seconds, as we speak. The total was at 1420 when I started and as I type this I am down to about 1300.

The code:

var assNex7 = $('.crud input[value="Asus Nexus 7"]');
var n = 0;
function clickRed() {
    n++;
    setTimeout(function() {
        $('.red').click();
        setTimeout(function() {
            deleteDevice();
        }, 1500);
    }, 1500);
}
function clickDelete() {
    $('.crud input[value="Asus Nexus 7"]').eq(0).parent().parent().find('.hover-red').click();
    clickRed();
}
function deleteDevice() {
    if (n < assNex7.length) clickDelete();
}
deleteDevice();

Console Script to Trigger 3,000+ Consecutive Click-enabled Front-end Actions

The Problem

The Code As It Is on Pushbullet's Device Listing Page

What I've Tried So Far

1 Answers1