Перетаскивание Cypress тест не проходит только в браузере Electron
У меня есть тест перетаскивания, основанный на команде, которая, кажется, работает для людей. Команда запускает события мыши, которые react-beautiful-dnd
понимает как перетаскивание взаимодействия. Он прекрасно работает в графическом интерфейсе Cypress. Я вижу, как элемент списка перетаскивается правильно и тест проходит успешно. Однако когда я запускаю браузер Cypress Electron, который мы используем в CI, он не работает. Я не вижу перемещения элемента списка, несмотря на то, что Cypress правильно находит перетаскиваемый элемент с помощью моего селектора и вызывает те же триггеры событий мыши без каких-либо сообщений об ошибках.
Я предполагаю, что кипарис trigger
Метод имеет некоторые проблемы при запуске определенных событий в браузере Electron. Любые советы или предложения с благодарностью!
зависимости:
"cypress": "^3.1.4",
"react-beautiful-dnd": "^10.0.3",
"react": "^16.6.0"
Код:
/*
* Drag and Drop
*
* Based on https://github.com/atlassian/react-beautiful-dnd/issues/162#issuecomment-448982174
*/
Cypress.Commands.add(
'dragAndDrop',
{ prevSubject: 'optional' },
(subject, offset = { x: 0, y: 0 }) => {
const BUTTON_INDEX = 0;
const SLOPPY_CLICK_THRESHOLD = 10;
cy
.wrap(subject)
.first()
.then(element => {
const coords = element[0].getBoundingClientRect();
// Use { force: true } to prevent Cypress from scrolling and interfering with the drag behavior.
cy
.wrap(element)
.trigger('mousedown', {
button: BUTTON_INDEX,
clientX: coords.x,
clientY: coords.y,
force: true
})
.trigger('mousemove', {
button: BUTTON_INDEX,
clientX: coords.x + SLOPPY_CLICK_THRESHOLD,
clientY: coords.y,
force: true
});
cy.get('body', { force: true }).trigger('mousemove', {
button: BUTTON_INDEX,
clientX: coords.x + offset.x,
clientY: coords.y + offset.y,
force: true
});
cy.get('body', { force: true }).trigger('mouseup');
});
}
);