Testing drag and drop with Rubaxa

jennifer-shehane commented 6 years ago

Hi, I'm using Rubaxa into an Angular6 project and I'm trying to interact with the Ui to drag and drop elements. I've been trying a lot of things and I never succeed. Could it be possible to add an example in the documentation for testing drag and drop with Rubaxa.

Current behavior: No example for Rubaxa, example for query-ui sortable is not working.

Desired behavior: Add an example in the documentation for testing drag and drop with Rubaxa.

https://github.com/cypress-io/cypress/issues/2082

jpsear commented 6 years ago

I'm also struggling with this. I thought I would post some resources I've found:

I'm still yet to write a working solution.

MatthiasGrandl commented 5 years ago

@jpsear did you get it working by now? I am really struggling with getting sortable.js to work in cypress.

jpsear commented 5 years ago

@MatthiasGrandl Unfortunately, I did not really achieve a reliable result that I was happy with. I've since had success using Test Cafe Studio (https://www.devexpress.com/products/testcafestudio/) for drag and drop testing. I can confirm that this works well with both sortable (react) and beautiful dnd (react). There are pros and cons really. I prefer Cypress as a whole—but yeah—the dnd support isn't that great.

PradumanMehta commented 4 years ago

Hi There, I have been having drag and drop issue and I have tried with drag and drop plugin '@4tw/cypress-drag-drop', with this method the widget(link) can be seen in the mouse but it couldn't able to drop it, When I move my mouse over the browser it shows and after clicking anywhere on the browser it drops the widget. Please see this is my code in the command.js

cy.waitUntil(()=> cy.get("#QuickWidgetMenu > div.flex-container > div:nth-child(2) > div:nth-child(22) > div.menu-item.bg-image.adv-search-widget")
                          .drag('#container2 > div').focus())

The other method I have used , it's with trigger, with this approach mousedown happens on object 10 , mousemove on object 11 but then mouseup or mouse release is back on object 10

cy.waitUntil(()=> cy.get("#QuickWidgetMenu > div.flex-container > div:nth-child(2) > div:nth-child(22) > div.menu-item.bg-image.adv-search-widget"))
     .trigger("mousedown", {button:0})

     .trigger("mousemove", {clientX:500, clientY: 200})
    //cy.get('#container1') tried without the coordinates
    .trigger("mouseup", {force:true})

I have spent like a week working on it, overall it's been two weeks on cypress, finding it quite alright apart from the above issue. Any help suggestion would be greatly appreciated

shwethakay commented 3 years ago

Did this above issue get resolved. I am facing the same, any workarounds appreciated.

cypress-io / cypress-example-recipes

Testing drag and drop with Rubaxa #166