0

I try to build a Bumble auto swiper extension for chrome but can't get the .click() function to work. I did some tests on the like button in the console. Here is the Button Element:

<div class="encounters-controls__action">
   <div class="encounters-action tooltip-activator encounters-action--like" role="button" data-qa-role="encounters-action-like" tabindex="0" aria-label="Like">
      <div class="encounters-action__icon">
         <span class="icon icon--size-stretch" role="presentation" data-qa-role="icon" data-qa-icon-name="floating-action-yes">
            <svg data-origin="pipeline" viewBox="0 0 78 78" fill="none">
               <path fill-rule="evenodd" clip-rule="evenodd" d="M35.759 43.024l11.82-11.82a2.387 2.387 0 113.376 3.378L37.448 48.089a2.388 2.388 0 01-3.377 0l-6.754-6.752a2.388 2.388 0 013.377-3.377l5.065 5.065z" fill="currentColor"></path>
            </svg>
         </span>
      </div>
      <div class="tooltip" data-direction="top" data-align="center" data-qa-role="tooltip">
         <div class="tooltip__content">
            <div class="p-3 text-color-white">Like</div>
         </div>
      </div>
   </div>
</div>

enter image description here

This is the code I try to call in the console to trigger the .click() event:

var likeButtonInterval = setInterval(function() {
  var likeButton = document.querySelector(".encounters-action--like");
  if (likeButton) {
    clearInterval(likeButtonInterval);
    try {
      // Scroll the button into view
      likeButton.scrollIntoView();
     
      // Trigger the click event
      likeButton.click();
    } catch (error) {
      console.error("Error clicking like button:", error);
    }
  }
}, 500);

Nothing happens, yesterday out of a sudden this exact code worked and then it stopped again. Its super random. On other websites it works perfectly fine.

I even tried to simulate a real mouseclick like this:

var likeButton = document.querySelector(".encounters-action--like")
if (likeButton) {
    //--- Simulate a natural mouse-click sequence.
    triggerMouseEvent (likeButton, "mouseover");
    triggerMouseEvent (likeButton, "mousedown");
    triggerMouseEvent (likeButton, "mouseup");
    triggerMouseEvent (likeButton, "click");
}
else
    console.log ("*** Target node not found!");

function triggerMouseEvent (button, eventType) {
    var clickEvent = document.createEvent ('MouseEvents');
    clickEvent.initEvent (eventType, true, true);
    button.dispatchEvent (clickEvent);
}
HavanaSun
  • 446
  • 3
  • 12
  • 39
  • Does not work unfortunately – HavanaSun Mar 18 '23 at 08:05
  • Try likeButton.dispatchEvent(new MouseEvent('click', {bubbles: true})) - also check in devtools which events are used by the site, maybe it's mousedown. – wOxxOm Mar 18 '23 at 10:02
  • Where do I see the events in the devtools? – HavanaSun Mar 18 '23 at 10:24
  • But yeah I tried both, mousedown and what you send me, both is not working. I never thought extension development is this hard. Can't even perform a simple mouseclick lol and no matter where I ask no one knows a solution. – HavanaSun Mar 18 '23 at 10:28
  • I updated my question, i tried to simulate a real mouse click but even this does not work – HavanaSun Mar 18 '23 at 10:47
  • It's in devtools -> Elements -> Event listeners panel. – wOxxOm Mar 18 '23 at 11:38
  • Have you tried [this approach](https://stackoverflow.com/questions/55059006/simulate-a-real-human-mouse-click-in-pure-javascript/55068681#55068681)? – Iván Nokonoko Mar 18 '23 at 12:44

0 Answers0