Testing drag and drop with behat and mink

Question

I'm trying to emulate drag and drop UI behaviour in a behat test. So far with no success, despite mink allegedly supporting that interaction.

Weirdly enough it was hard for me to find any relevant blog posts about the subjects. Ones I've found (this and http://www.pix-art.be/post/testing-drag-and-drop-with-behat-and-guzzle ) did not help me much. Especially the latter one.

Does anyone have any suggestions on how to approach the problem or has experience with actually testing that interaction?

Have you checked this? https://medium.com/@smartgamma/how-to-test-drag-and-drop-elements-with-behat-selenium-5a56154fecfe#.55iyeur4q — lauda, Mar 20 '17 at 10:32
Do you have a link to some public demo/website with this type of functionality? — lauda, Aug 18 '17 at 07:23
](No, unfortunately I cannot disclose the code. It's basically a UI for dragging stuff between columns. Built using [dragular](https://github.com/luckylooke/dragular) and angular 1.6.* — guessimtoolate, Aug 18 '17 at 12:03

INDIVIDUAL-IT · Answer 1 · 2020-01-15T09:48:09.357

you can find an working example in the ownCloud test code, it does move files into folders via drag-and-drop:

    public function moveFileTo(
        $name, $destination, Session $session, $maxRetries = STANDARD_RETRY_COUNT
    ) {
        $toMoveFileRow = $this->findFileRowByName($name, $session);
        $destinationFileRow = $this->findFileRowByName($destination, $session);
        $this->initAjaxCounters($session);
        $this->resetSumStartedAjaxRequests($session);
        for ($retryCounter = 0; $retryCounter < $maxRetries; $retryCounter++) {
            $toMoveFileRow->findFileLink()->dragTo(
                $destinationFileRow->findFileLink()
            );
            $this->waitForAjaxCallsToStartAndFinish($session);
            $countXHRRequests = $this->getSumStartedAjaxRequests($session);
            if ($countXHRRequests === 0) {
                \error_log("Error while moving file");
            } else {
                break;
            }
        }
        if ($retryCounter > 0) {
            $message
                = "INFORMATION: retried to move file $retryCounter times";
            echo $message;
            \error_log($message);
        }
    }

from: https://github.com/owncloud/core/blob/47396de109965110276deb545a9bd09f375c9823/tests/acceptance/features/lib/FilesPageCRUD.php#L243

First it finds the NodeElement of the file that has to be moved, then then NodeElement of the destination and calls $fileToBeMovedElement->dragTo($destinationElement)

Because it proved to be flaky there is an retry loop around the dragTo function. To test if the drag-and-drop operation worked the code checks if any AJAX calls were set off or not (in this particular app this drag-and-drop operation sets off an WebDAV request)

Testing drag and drop with behat and mink

1 Answers1