angular - 如何使用 cypress 在 Angular 应用程序中拖放元素？

Question

我想从列表中拖放元素以使用移动图标对其重新排序。

所以，我添加了 3 个项目，并尝试了这个功能：array-form.po.ts：

export const dragdropItem = (dragedElSelector) => {
const dataTransfer = new DataTransfer();
if(dragedElSelector == null){
  console.log(dragedElSelector)
}
cy.get(dragedElSelector).then(($form) => {
  const coordsDrag = $form[0].getBoundingClientRect();
  cy.wrap($form)
    .trigger('dragstart', {
      clientX: coordsDrag.left,
      clientY: coordsDrag.top,
      which: 1,
      dataTransfer
    })
    .trigger('mousemove', {
      dataTransfer
    });
  cy.get(dragedElSelector).trigger('drop', {
    dataTransfer
  });
});

};

数组-form.spec.ts ：

it('should add item and reorder the list of arrayForm with dragdrop', () => {
  getAddItemButton().click();
  getArrayFormRows().should('have.length', 3);
  getCollapsedButton().eq(2).click();
  getArrayFormTextFieldThird().type('3');
  getPassengerComboBox().should('be.visible');
  getPassengerComboBoxThird().click({force:true});
  getPassengerComboBoxValueThird().click({force:true});
  getPassengerComboBoxThird().should('contain', 'Gauss Capital');
  getPassengerComboBoxThird().click({force:true});
  cy.wait(2000);
  dragdropItem(
    getMoveIcon().eq(0)
  );
  cy.wait(1000);             
});

但我收到了这个错误：

$form[0].getBoundingClientRect is not a function

谁能帮帮我。

标签： angularcypress