Cannot do drag and drop test in cypress

Question

How to automate the drag and drop feature in an application using cypress? I am not able to pick a file using cypress. I have tried using cypress-file-upload

Answer 1

there are some solutions:

1. First option: I recommend using cypress-drag-drop plugin you can know more about this option in the following link https://github.com/4teamwork/cypress-drag-drop

2. Second option: You can use cypress-file-upload plugin you can know more about this option in the following link https://www.npmjs.com/package/cypress-file-upload in this case you will need to something similar to:

cy.get('your-element').attachFile('myfixture.json', { subjectType: 'drag-n-drop' });

or

cy.get('your-element').attachFile('image.jpg', 
            {
                subjectType: 'drag-n-drop', events: ['dragenter', 'drop']
            })

3. Third option: You can check this article in the following link where the author have created a new command from scratch: https://jayashanigunarathne.medium.com/uploading-drag-drop-images-in-cypress-943c9db9957e