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?

Neurilemma

Have you checked this? medium.com/@smartgamma/… – Farmer

Yes, it's also linked in my question. – Neurilemma

Do you have a link to some public demo/website with this type of functionality? – Farmer

](No, unfortunately I cannot disclose the code. It's basically a UI for dragging stuff between columns. Built using dragular and angular 1.6.* – Neurilemma

Answer 1

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)

Spurt