En Gmail, si hizo clic para seleccionar un mensaje, esto mostrará una barra en la parte superior de la tabla de mensajes, para realizar acciones masivas en los mensajes seleccionados (consulte la foto GIF adjunta).
Estoy tratando de hacer clic en el ícono de eliminar en esta barra, pero no puedo hacerlo porque su marcado cambia una vez que lo pasas.
Su primer sorteo en el DOM es así:
<div class="TI J-J5-Ji nX TI-ax7 TI-Js-Gs mA" act="10" title="Delete" role="button" tabindex="0"> <div class="asa"> <div class="ar9 TI-J3 J-J5-Ji"></div> </div> </div>Y una vez que lo pasas manualmente, cambia para ser así:
<div class="TI J-J5-Ji nX TI-ax7 TI-Js-Gs mA" act="10" role="button" tabindex="0" data-tooltip="Delete" aria-label="Delete" style="user-select: none;"> <div class="asa"> <div class="ar9 TI-J3 J-J5-Ji"></div> </div> </div>Para seleccionarlo, uso su primer marcado, así:
let $delBtn1 = $('[title="Delete"]'); let $delBtn2 = $('[data-tooltip="Delete"]'); Pero no puedo hacer clic en él y hacer que active su función onclick , porque supongo que escucha el evento onclick DESPUÉS de un desplazamiento manual sobre él primero.
¿Cómo puedo activar el desplazamiento manual y luego activar un clic?
Traté de hacer:
$($delBtn1).mouseenter(); $($delBtn1).trigger('mouseenter'); $($delBtn1).mouseover(); $($delBtn1).trigger('mouseover'); $($delBtn1).mouseup(); $($delBtn1).mousedown(); $($delBtn1).focus(); $($delBtn1).select();¡Nada de esto funcionó!
Incluso trató de esperar:
$($delBtn1).mouseenter(); setTimeout(function () { $($delBtn2).click(); }, 1000);Estoy intentando esto a través de una extensión de Chrome y a través de la consola, ¡y ninguno de los dos funciona!
Cualquier dirección, ¿cómo puedo activar su función onclick ?
Lo hice usando el método dispatchEvent() , así:
let mouseoverEvent = new MouseEvent('mouseover', { view: window, bubbles: true, cancelable: true }); let mousedownEvent = new MouseEvent("mousedown", { view: window, bubbles: true, cancelable: true }); let mouseupEvent = new MouseEvent("mouseup", { view: window, bubbles: true, cancelable: true }); document.querySelector('div[title="Delete"]').dispatchEvent(mouseoverEvent); document.querySelector('div[data-tooltip="Delete"]').dispatchEvent(mousedownEvent); document.querySelector('div[data-tooltip="Delete"]').dispatchEvent(mouseupEvent);