Keydown Event Triggered Only Once

The following script is aimed to run on facebook.com's conversations page (the page in which a user can see all its conversations). The script's purpose is to automize the 'delete

Solution 1:

As written, function dC(), it does 4 actions:

The problem was in action #3:

Seemingly, every click on 'settings' menu (action #2), a new 'settings-menu' instance is created (new object added to the DOM), thus this line won't work:

document.querySelector('.uiContextualLayer > [id^="js"] > div > ul > li:nth-child(4)').click();

On the one hand, querySelector returns the first element that answers the given pattern.

On the other hand, Facebook creates a new '.uiContextualLayer' each time the settings button is clicked (target the menu chainwheel link and stretch up your devtool window to note the new element added).

Hence, what we do is to check all chainwheel elements after and then work with the newest (last) element each time:

let menu = document.querySelectorAll('.uiContextualLayer._5v-0._53il');
menu = menu[menu.length-1];

---

Here is the final code.
(I added few more timeouts to make sure drawing the UI is finished)

let dC = ()=>
{
  // clicking the 'settings'
  document.querySelector('._5blh._4-0h').click();
  setTimeout(() => {
    // taking the last instance of 'menu popup':
    let menu = document.querySelectorAll('.uiContextualLayer._5v-0._53il');
    menu = menu[menu.length-1];

    // finding 'delete' button inside the menu popup
    let lis = menu.querySelectorAll('ul > li');
    let target = null;
    for (let i=0;!target && i<lis.length;++i)
    {
        let span = lis[i].querySelector('a span span');
        if (!span) continue;
        if (span.innerHTML.contains('Delete'))
            target = lis[i];
    }
    if (!target) {console.log('cannot find delete btn'); return;}


    // clicking 'delete' button in menu
    setTimeout(() => {
        target.click();

        setTimeout(()=>{ 
            // clicking delete in modal
            document.querySelector('._3quh._30yy._2t_._3ay_._5ixy').click(); 
        }, 500);

    }, 10);
  },10);
};

Solution 2:

Push the key values into arrays and unset these arrays after the event was over.

// Create two empty arrays
    var map = [];
    var down = [];

    $(document).on('keydown', 'body', function(e) {
// Check whether the map having any key values
      if (!map[e.which]) {
// Set the keydown value to down array
        down.push(e.which);

        if (down[0] === 68) {
          // Events to be done
        }
      }

    map[e.which] = true;
// Once the key-down pressed and event done ,the keyup unset the array while key up 
    }).keyup(function(e) {
      map[e.which] = false;

      // unset(down,e.which);  
      down = [];
      e.which = [];
    });