如何在qunit中测试html5拖放

Fun*_*nly 5 javascript jquery html5 qunit backbone.js

我想测试一个html 5拖放我会工作的东西:

从测试文件

var event = new Event('drop',{
    'originalEvent':{
        'dataTransfer':{
            'getData': function(){
                return 'tr#0.sprint'
             }
         }
     },
     stopPropagation': function() {return;}
}
$('tr#0.sprint').trigger(event);
Run Code Online (Sandbox Code Playgroud)

这样就可以触发事件并将所有功能设置为返回我想要测试的内容.

实际脚本:

骨干框架

myView = Backbone.View.extend({

    ...

    drop : function(event)
    {
        event.stopPropagation();
        var data = event.originalEvent.dataTransfer.getData('element');

        // some code

    },

    ...

};
Run Code Online (Sandbox Code Playgroud)

可悲的是这个错误 Illigal function call

如果我删除该dataTransfer对象并尝试自己设置它我得到一个未定义的错误

Fun*_*nly 2

如果你把它设置得稍微不同一点,就会产生天壤之别:

var event = new Event('drop',{
     stopPropagation: function() {return;}
});
event['originalEvent'] ={
    'dataTransfer':{
        'getData': function(){
            return 'tr#0.sprint'
        }
    }
};
$('tr#0.sprint').trigger(event);
Run Code Online (Sandbox Code Playgroud)

这是一种更“手动”的设置 javascript 对象属性的方法。添加到事件构造函数的参数由事件对象的构造进行检查。