No possibility to drag and drop to the top of the window when cypress scrolls down for the element

[kapalkat]

Current behavior:

Not able to drag and drop an element to the top of the document when window is scrollable and the element is at the very bottom.

Desired behavior:

There should be some possibility to make this scenario working.

Steps to reproduce:

1. I have a list of interactive elements. The list is quite long and the window is changed to scrollable to navigate through all those elements.
2. I want to get the element which is in the very bottom, drag it, scroll up and drop it to the top of the list. Manually it looks like below:

Cypress behaviour: a. cy.get() --> scrolls down to get the element b. When I now try to drag and drop up, it's not possible as I am already at the top of the page: c. There is no way to scroll up the window when dragging the element!

Versions

Cypress 3.1.0 MacOS Chrome

[kapalkat]

Hey, could you send some information regarding this? Maybe there is some workaround which I don't know about?

[kapalkat]

According to this: https://docs.cypress.io/guides/core-concepts/interacting-with-elements.html#Scrolling, you always scroll into elements view when action is applied on it, so my question is how the hack I should scroll it back now holding the element to move it up?

I have already tried this:

        cy.get('tr > .dest-width > div.pull-right.drag-element:eq(3)',)
          .trigger('mousedown', { which: 1, force: true })
          .trigger('mousemove', { clientY: NEW_POSITION_Y, force: true })
          .trigger('mouseup', { force: true })

and this:

        cy.get('tr > .dest-width > div.pull-right.drag-element:eq(3)')
          .trigger('mousedown', { which: 1 })
          .then(() => {
            cy.scrollTo('top')
          })
          .trigger('mousemove', { clientY: NEW_POSITION_Y })
          .trigger('mouseup', { force: true })

and this:

        cy.get('tr > .dest-width > div.pull-right.drag-element:eq(3)')
          .trigger('mousedown', { which: 1 })
          .then(() => {
            cy.wrap($tbody).scrollTo('top')
          })
          .trigger('mousemove', { clientY: NEW_POSITION_Y })
          .trigger('mouseup', { force: true })

But none of this works. I can't move the elmenet up as it's Y coordinate is around 0.

[kapalkat]

Hey, team any updates regarding this? I haven't found any workaround so far.

[jennifer-shehane]

No updates have been made to this issue. We do have some work coming on being able to change the scroll behavior, but...I'm not sure that would help this scenario. https://github.com/cypress-io/cypress/issues/871

[cypress-app-bot]

This issue has not had any activity in 180 days. Cypress evolves quickly and the reported behavior should be tested on the latest version of Cypress to verify the behavior is still occurring. It will be closed in 14 days if no updates are provided.

[Szymon-dziewonski]

Im also looking into how to in my case drag scrollbar, and I can't do it

Cypress version 12.12.0

[nagash77]

@Szymon-dziewonski have you had a chance to check out our community chat? It can be helpful for debugging or answering questions on how to use Cypress. If you have a reproducible example to share please do and we can investigate.

[Szymon-dziewonski]

@nagash77 Thank you for swift reply, will try to work a bit with it and if no result I will contact community chat, at the end I will probably create reproduction. Sorry, I possibly wrote comment too fast :)

[nagash77]

@Szymon-dziewonski , thank you for the reply. I am going to close this issue for the time being. If/When you create a reproduction comment back here on this ticket and we can reopen and investigate.