量角器。 DragAndDrop不起作用

时间:2016-06-15 14:46:50

标签: drag-and-drop protractor action autotest

DragAndDrop对我不起作用。我尝试移动列表的项目,它移动了一点,但仍然在同一个地方。 当我移动元素时,会创建一个新的列表项,请查看图像。 你有什么想法吗? 这是我的代码:

var dragElement = element(by.id("i3"));
var dropElement = element(by.id("i1"));
browser.actions().dragAndDrop(dragElement, dropElement).perform();

这是我的页面:

<ol ui-tree-nodes="" ng-model="$ctrl.items" class="list-group canSorting ng-pristine ng-untouched ng-valid ng-scope angular-ui-tree-nodes ng-not-empty">
    <!-- ngRepeat: item in $ctrl.items --><li collapsed="true" ng-repeat="item in $ctrl.items" ui-tree-node="" class="list-group-item p0 ng-scope angular-ui-tree-node">
        <table width="100%">
            <tbody><tr>
                <td style="vertical-align: middle !important;" class="text-center p0" width="1">
                    <i id="i0" class="btn btn-sm glyphicon glyphicon-resize-vertical angular-ui-tree-handle ng-scope" ui-tree-handle=""></i>
                </td>
                <td class="ng-binding" style="border-left: 1px solid #ccc; padding-left: 6px;">
                    Раздел 1
                </td>
            </tr>
        </tbody></table>
    </li><!-- end ngRepeat: item in $ctrl.items --><li style="" collapsed="true" ng-repeat="item in $ctrl.items" ui-tree-node="" class="list-group-item p0 ng-scope angular-ui-tree-node">
        <table width="100%">
            <tbody><tr>
                <td style="vertical-align: middle !important;" class="text-center p0" width="1">
                    <i id="i1" class="btn btn-sm glyphicon glyphicon-resize-vertical angular-ui-tree-handle ng-scope" ui-tree-handle=""></i>
                </td>
                <td class="ng-binding" style="border-left: 1px solid #ccc; padding-left: 6px;">
                    Раздел 2
                </td>
            </tr>
        </tbody></table>
    </li><!-- end ngRepeat: item in $ctrl.items --><li style="" collapsed="true" ng-repeat="item in $ctrl.items" ui-tree-node="" class="list-group-item p0 ng-scope angular-ui-tree-node">
        <table width="100%">
            <tbody><tr>
                <td style="vertical-align: middle !important;" class="text-center p0" width="1">
                    <i id="i2" class="btn btn-sm glyphicon glyphicon-resize-vertical angular-ui-tree-handle ng-scope" ui-tree-handle=""></i>
                </td>
                <td class="ng-binding" style="border-left: 1px solid #ccc; padding-left: 6px;">
                    Раздел c пройденным тестом
                </td>
            </tr>
        </tbody></table>
    </li><!-- end ngRepeat: item in $ctrl.items --><li style="" collapsed="true" ng-repeat="item in $ctrl.items" ui-tree-node="" class="list-group-item p0 ng-scope angular-ui-tree-node">
        <table width="100%">
            <tbody><tr>
                <td style="vertical-align: middle !important;" class="text-center p0" width="1">
                    <i id="i3" class="btn btn-sm glyphicon glyphicon-resize-vertical angular-ui-tree-handle ng-scope" ui-tree-handle=""></i>
                </td>
                <td class="ng-binding" style="border-left: 1px solid #ccc; padding-left: 6px;">
                    Раздел 3
                </td>
            </tr>
        </tbody></table>
    </li><!-- end ngRepeat: item in $ctrl.items -->
</ol>

screenshot

1 个答案:

答案 0 :(得分:2)

你可以试试下面的代码并检查它是否有效,

browser.actions().mouseMove(dragElement).mouseDown().mouseMove(dropElement).mouseUp().perform();