背景

項目中需要拖拽操作，使用drag and drop，經測試并不生效，沒有實現拖動，但是robotframework并不報錯，原來是因為selenium并不支持對html5的拖拽操作，所以我們需要使用javascript來處理。

[drag_and_drop.js]

var dataTransfer =
    {
        dropEffect: '',
        effectAllowed: 'all',
        files: [],
        items: {},
        types: [],
        setData: function (format, data) {
            this.items[format] = data;
            this.types.append(format);
        },
        getData: function (format) {
            return this.items[format];
        },
        clearData: function (format) {
        }
    };
var emit = function (event, target) {
    var evt = document.createEvent('Event');
    evt.initEvent(event, true, false);
    evt.dataTransfer = dataTransfer;
    target.dispatchEvent(evt);
};

var DragNDrop = function (src, tgt) {
    src = document.getElementById(src);
    tgt = document.getElementById(tgt);
    emit('dragstart', src);
    emit('dragenter', tgt);
    emit('dragover', tgt);
    emit('drop', tgt);
    emit('dragend', src);
    return true;
}

• 在robotframework中這樣使用

Drag And Drop Element
    [Arguments]     ${src}  ${tgt}
    ${js}        Get File              drag-n-drop.js
    ${result}    Execute Javascript    ${js}; return DragNDrop("${src}", "${tgt}");
    Capture Page Screenshot

• 可以看到我們參數是只支持id的，不過也不必緊張，我們可以使用robotframework自帶的方法Assign Id To Element來生成一個臨時id。這個臨時id我們自己建個方法生成唯一的更好。

• 所以改進后的代碼如下，可以支持selenium支持的所有方式，而且id是唯一的，不用再去糾結id取值。

get uuid
    ${uuid}     evaluate    (uuid.uuid3(uuid.NAMESPACE_DNS, time.strftime("%Y-%m-%d %H:%M:%S", time.localtime()) + str(random.random()))).hex            modules=random, time, uuid
    [Return]        ${uuid}

Drag And Drop Element
    [Arguments]     ${src}  ${tgt}
    ${src_id}       get uuid
    ${tgt_id}       get uuid
    Assign Id To Element        ${src}           ${src_id}
    Assign Id To Element        ${tgt}           ${tgt_id}
    ${js}        Get File              drag-n-drop.js
    ${result}    Execute Javascript    ${js}; return DragNDrop("${src_id}", "${tgt_id}");
    Capture Page Screenshot