Come posso testare l'interfaccia utente JQuery con Cucumber

Question

Sto provando a scrivere un test cetriolo/capibara per riordinare alcuni elementi e quindi salvarli nuovamente. Qualche idea su come fare al meglio?

Answer 1

sto usando un passo web come questo e funziona benissimo:

When /^I drag "([^"]*)" on top$/ do |name| 
    item = Item.find_by_name(name) 
    sleep 0.2 
    src = find("#item_id_#{item.id}") 
    dest = find("div.title") 
    src.drag_to(dest) 
end 

Answer 2

metodo drag_to non ha funzionato per me. Ma io ero in grado di provocare il primo elemento nella mia lista per essere trascinato all'ultima posizione inserendo la seguente nella mia jquery.simulate.js capibara prova selenio utilizzando:

page.execute_script %Q{ 
    $.getScript("/javascripts/jquery.simulate.js", function(){ 
    distance_between_elements = $('.task:nth-child(2)').offset().top - $('.task:nth-child(1)').offset().top; 
    height_of_elements = $('.task:nth-child(1)').height(); 
    dy = (distance_between_elements * ($('.task').size() - 1)) + height_of_elements/2; 

    first = $('.task:first'); 
    first.simulate('drag', {dx:0, dy:dy}); 
    }); 
}     

Answer 3

ho sviluppato un plugin jQuery per risolvere questo problema, controlla jquery.simulate.drag-sortable.js che include un plugin con una suite di test ed esempi.

Spero che trovi utile! Il feedback è benvenuto

Matt

Answer 4

Per me, #drag_to ha funzionato, tuttavia, i suoi poteri sembrano essere limitati.

Per spostare una riga della tabella UI-ordinabili giù, ho dovuto creare una tabella con tre righe, quindi eseguire questo passaggio Cucumber:

# Super-primitive step 
When /^I drag the first table row down$/ do 
    element = find('tbody tr:nth-child(1)') 
    # drag_to needs to drag the element beyond the actual target to really perform 
    # the reordering 
    target = find('tbody tr:nth-child(3)') 

    element.drag_to target 
end 

Questo sarebbe scambiare la prima con la seconda fila. La mia interpretazione è che Capibara non trascina abbastanza lontano, così ho dato un obiettivo oltre il mio obiettivo reale.

Nota: ho configurato l'interfaccia utente con tolerance: 'pointer ".