Problem with drag and drop

[jt7777777]

So I am basically trying to move item 1 from left row to beggining on right row. My closest win was moving item on second position or under item 1 on right row. I would be really happy if someone could help me with this. Its in iframe so maybe thats a problem but i dont have much skills thats why i am seeking for help.
Here is my main code:
describe('Drag and Drop Test', () => {
Cypress.on('uncaught:exception', (err, runnable) => {
// Ignore exceptions that we don't care about
return false;
});

it('should perform drag and drop', () => {
cy.visit('https://www.globalsqa.com/demo-site/sorting/');
cy.get('li#Multiple\ Lists.resp-tab-item').click();
cy.wait(5000); // Wait for iframe content to load

cy.get('iframe.demo-frame.lazyloaded').then($iframe => {
  const doc = $iframe.contents();
  const body = doc.find('body');

  cy.wrap(body).find('#sortable1 > li:nth-child(1)').should('contain.text', 'Item 1').then($source => {
    // Store the source element for later use
    const source = $source;

    cy.wrap(body).find('#sortable2').then($targetList => {
      // Define the target spot for the drop, which is before the first child of sortable2
      const target = $targetList.find('li:nth-child(1)');

      // Simulate drag and drop
      cy.wrap(source).trigger('mousedown', { which: 1 });
      cy.wrap(target).trigger('mousemove').trigger('mouseup', { force: true });

      // After the drag-and-drop, we should check that the element is now in the new position
      cy.wrap(body).find('#sortable2 > li').then($itemsAfterDrop => {
        // Assert that the list of items in the second column includes 'Item 1' at the first position
        expect($itemsAfterDrop.eq(0)).to.contain('Item 1');
      });
    });
  });
});

});
});

[samelawrence]

I ended up using a plugin for my drag-and-drop implementation. Here's a blog post demonstrating the method I use. I hope it's helpful.

[samelawrence]

@jt7777777 Did you resolve your issue?

[jupudi77]

cy.get('.Sourceelement').drag('Target', {
source: { x: 100, y: 300 },
target: { position: 'center' },
force: true,
});

you should be able to drag and drop the element by using the code above. I added the plugin for drag drop

But, the same code which works for me to drag the element, doesn't work when i try to add connectors (draw a line) between two elements.