Saltar al contenido

¿Cómo simular arrastrar y soltar HTML5 en Selenium Webdriver?

Por fin después de mucho batallar hemos encontrado la contestación de este atascamiento que algunos los usuarios de nuestro sitio web tienen. Si tienes algo que aportar puedes dejar tu conocimiento.

Solución:

Sí, HTML5 “arrastrar y soltar” actualmente no es compatible por selenio:

  • Problema 3604: Arrastrar y colocar HTML5 con Selenium Webdriver

Una de las soluciones sugeridas es simular HTML5 arrastrar y soltar a través de JavaScript:

  • descargar drag_and_drop_helper.js
  • ejecutar el script a través de execute_script() vocación simulateDragDrop() función en un source elemento que pasa el target elemento como un dropTarget

Código de muestra:

with open("drag_and_drop_helper.js") as f:
    js = f.read()

driver.execute_script(js + "$('#one').simulateDragDrop( dropTarget: '#bin');")

El problema es que no funcionará en su caso “tal cual” ya que requiere jQuery.


Ahora tenemos que averiguar cómo cargar dinámicamente jQuery. Afortunadamente, hay una solución.

Ejemplo de trabajo completo en Python:

from selenium import webdriver

jquery_url = "http://code.jquery.com/jquery-1.11.2.min.js"

driver = webdriver.Firefox()
driver.get("http://html5demos.com/drag")
driver.set_script_timeout(30)

# load jQuery helper
with open("jquery_load_helper.js") as f:
    load_jquery_js = f.read()

# load drag and drop helper
with open("drag_and_drop_helper.js") as f:
    drag_and_drop_js = f.read()

# load jQuery
driver.execute_async_script(load_jquery_js, jquery_url)

# perform drag&drop
driver.execute_script(drag_and_drop_js + "$('#one').simulateDragDrop( dropTarget: '#bin');")

dónde jquery_load_helper.js contiene:

/** dynamically load jQuery */
(function(jqueryUrl, callback) 
    if (typeof jqueryUrl != 'string') 
        jqueryUrl = 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js';
    
    if (typeof jQuery == 'undefined') 
        var script = document.createElement('script');
        var head = document.getElementsByTagName('head')[0];
        var done = false;
        script.onload = script.onreadystatechange = (function() );
        script.src = jqueryUrl;
        head.appendChild(script);
    
    else 
        callback();
    
)(arguments[0], arguments[arguments.length - 1]);

Resultado antes/después:

Ejemplo de trabajo encontrado en python (sin usar jquery_load_helper.js) – https://gist.github.com/rcorreia/2362544#gistcomment-2708388

Créditos: Kelanmomo

Como mencionó alecxe: descargue drag_and_drop_helper.js

# coding = utf-8
from selenium import webdriver
import os
from time import sleep

driver = webdriver.Chrome()
driver.implicitly_wait(10)
driver.get('http://the-internet.herokuapp.com/drag_and_drop')

with open(os.path.abspath('drag_and_drop_helper.js'), 'r') as js_file:
    line = js_file.readline()
    script = ''
    while line:
        script += line 
        line = js_file.readline()

driver.execute_script(script + "$('#column-a').simulateDragDrop( dropTarget: '#column-b');")
sleep(2)
driver.quit()

Valoraciones y comentarios

Si para ti ha resultado útil este artículo, agradeceríamos que lo compartas con otros entusiastas de la programación de esta manera nos ayudas a difundir nuestro contenido.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *