量角器：拖放功能的Mozilla和Chrome，但不工作与Internet Explorer 11 [英] Protractor: Drag-Drop function working with Mozilla and chrome but not with Internet Explorer 11

问题描述

我试图用自动化量角器拖放动作。
元素的属性是：

I am trying to automate a drag-drop action using protractor. The element's properties are:

的元素需要被拖入：的结果

<li id="activities-test123" class="ng-binding ng-scope ng-isolate-scope draggable" tooltip-placement="right" ng-attr-tooltip="{{activity.name.length > relationships.nameLimit ? activity.name : ''}}" draggable="true" ng-class="{'draggable-disabled': activity.entityHasActivity, 'draggable': !activity.entityHasActivity}" ng-repeat="activity in relationships.activities | toArray:false | filter:searchActivities:strict" tooltip="">

的当元素需要的位置被丢弃：的结果

<div class="tree-view ng-isolate-scope" drop="relationships.handleDrop" datasource="relationships" droppable="">
<p class="content-help-text ng-hide" ng-hide="relationships.hasEntity()">Drag an entity here</p>
<div ui-tree="relationships.options">
<ol class="top-level ng-isolate-scope" droppable="" ui-tree-nodes="">
<!-- ngRepeat: item in relationships.tree -->
</ol>
</div>
</div>

我使用我在GitHub上发现了一个拖放辅助脚本本土

I am using a drag-drop-helper native script which I found in GitHub

module.exports =function simulateDragDrop(sourceNode, destinationNode) {
var EVENT_TYPES = {
    DRAG_END: 'dragend',
    DRAG_START: 'dragstart',
    DROP: 'drop'
}

function createCustomEvent(type) {
    var event = new CustomEvent("CustomEvent")
    event.initCustomEvent(type, true, true, null)
    event.dataTransfer = {
        data: {
        },
        setData: function(type, val) {
            this.data[type] = val
        },
        getData: function(type) {
            return this.data[type]
        }
    }
    return event
}

function dispatchEvent(node, type, event) {
    if (node.dispatchEvent) {
        return node.dispatchEvent(event)
    }
    if (node.fireEvent) {
        return node.fireEvent("on" + type, event)
    }
}

var event = createCustomEvent(EVENT_TYPES.DRAG_START)
dispatchEvent(sourceNode, EVENT_TYPES.DRAG_START, event)

var dropEvent = createCustomEvent(EVENT_TYPES.DROP)
dropEvent.dataTransfer = event.dataTransfer
dispatchEvent(destinationNode, EVENT_TYPES.DROP, dropEvent)

var dragEndEvent = createCustomEvent(EVENT_TYPES.DRAG_END)
dragEndEvent.dataTransfer = event.dataTransfer
dispatchEvent(sourceNode, EVENT_TYPES.DRAG_END, dragEndEvent)

}

问题是，拖放动作在Mozilla和Chrome浏览器的工作。但是，让错误：
不明错误：JavaScript错误（警告：服务器没有提供任何堆栈跟踪信息）。在Internet上运行的browser.executeScript命令浏览器11

我执行code以下列方式：

I am implementing the code in following way:

var DragAndDrop = require("./../native_js_drag_and_drop_helper.js");
var input = element(by.xpath("XPATH OF ELEMENT TO BE MOVED"));
var target = element(by.xpath("XPATH OF THE TARGET LOCATION"));
browser.executeScript(DragAndDrop, input.getWebElement(), target.getWebElement());

我运行验证browser.executeScript命令 browser.executeScript（'的javascript：localStorage.clear（）;警报（HelloWorld的）;'）; 及其做工精细用IE11。结果
有人可以给我一个想法是什么我是缺少在这里？

I verified the browser.executeScript command by running browser.executeScript('javascript:localStorage.clear(); alert("HelloWorld");'); and its working fine with IE11.
Can someone give me an idea what i am missing here?

推荐答案

我得到这个错误修复。结果
在IE 11浏览器不支持自定义事件的构造函数中的行： VAR事件=新的自定义事件（自定义事件）。结果更改自定义事件到createEvent。 VAR的事件= document.createEvent（自定义事件）; 。就像一个魅力！

I got this error fixed.
The IE 11 browser doesn't support CustomEvent constructor in the line:var event = new CustomEvent("CustomEvent").
Change CustomEvent to createEvent. var event=document.createEvent("CustomEvent");. Works like a Charm!!

这篇关于量角器：拖放功能的Mozilla和Chrome，但不工作与Internet Explorer 11的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！