1

Я создаю несколько тестов для приложения ionic с помощью protractor, чтобы проверить, может ли пользователь успешно перетащить элемент на chrome. Я попробовал сначала с mouseDown(), mouseMove() и mouseUp(), как в следующем случае:Создание некоторых тестов для ионного приложения с транспортиром для проверки, может ли пользователь успешно перетащить элемент на хром

it ('should destroy card after swipe', function() { 
    var card1Move = {x: 200, y: 0}; 

    browser.actions() 
     .mouseMove(card1) 
     .mouseDown() 
     .mouseMove(card1Move) 
     .mouseUp() 
     .perform(); 

    browser.sleep(500); 
    expect(card1.isPresent()).toBeFalsy(); 
}); 

Но это не сработало. Тогда я попытался со встроенным dragAndDrop() метод, как это:

it ('should destroy card after swipe', function() { 
    var card1Move = {x: 200, y: 0}; 

    browser.actions() 
     .dragAndDrop(card1, card1Move) 
     .mouseUp() 
     .perform(); 

    browser.sleep(500); 
    expect(card1.isPresent()).toBeFalsy(); 
}); 

Но это не сработало. Вы знаете, в чем проблема с моим кодом? Заранее благодарю за ваши ответы!

+0

browser.actions() DragAndDrop (элем, цель). MouseUp() выполняет(). попробуйте –

+0

Спасибо за ваш ответ! Но в чем разница с моим кодом? Потому что он не работает. –

ответ

1

Если перетаскивание является реализация HTML5, то ваш лучший шанс, вероятно, для имитации события с executeScript:.

browser.executeScript(dragAndDrop, card1.getWebElement(), 200, 0); 
var dragAndDrop = function(source, offsetX, offsetY){  
    var rect = source.getBoundingClientRect(); 
    var dragPt = {x: rect.left + (rect.width >> 1), y: rect.top + (rect.height >> 1)}; 
    var dropPt = {x: dragPt.x + offsetX, y: dragPt.y + offsetY}; 
    var target = source.ownerDocument.elementFromPoint(dropPt.x, dropPt.y); 
    var dataTransfer = { 
    items: {}, 
    types: [], 
    files: [], 
    setData: function (format, data) { 
     this.items[format] = data; 
     this.types.push(format); 
    }, 
    getData: function (format) { return this.items[format]; }, 
    clearData: function (format) { delete this.items[format]; } 
    }; 

    emit(source, 'mouseover mouseenter mousedown dragstart dragenter drag dragover dragleave', dragPt); 
    emit(target, 'dragenter dragover drop', dropPt); 
    emit(source, 'dragend', dropPt); 

    function emit (element, events, pt, data) { 
    events.split(' ').forEach(function(event){ 
     var evt = source.ownerDocument.createEvent('MouseEvent'); 
     evt.initMouseEvent(event, !0, !0, window, 0, 0, 0, pt.x, pt.y, !1, !1, !1, !1, 0, null); 
     if (/^drag|^drop/.test(event)) evt.dataTransfer = dataTransfer; 
     element.dispatchEvent(evt); 
    }); 
    }; 
}; 
+0

Эй, парень! Благодарим вас за ответ, но он все еще не работает. Может ли проблема быть связана с Chrome? –

+0

Чтобы узнать, связано ли это с Chrome, попробуйте Firefox. Я также буду слушать события при выполнении DnD вручную, а затем адаптировать сценарий для отправки тех же событий. –

+0

Спасибо, человек! Я попробую, и я вернусь к тебе –