Cypress拖拽React Flow节点在网格上移动失败的问题求助

我现在碰到个棘手的问题：没法在网格上拖拽React Flow的节点。先给大家看看这个节点的HTML结构：

<div class="react-flow__node react-flow__node-Activity nopan selected selectable" data-id="Node_27xlm59hv" data-testid="rf__node-Node_27xlm59hv" tabindex="0" role="button" aria-describedby="react-flow__node-desc-1" style="z-index: 1000; transform: translate(150px, 150px); pointer-events: all; visibility: visible;"> 
  <div class="sc-lgholE jdAQqh"> 
    <div class="connection-anchor"></div> 
    <div data-nodeid="Node_27xlm59hv" data-handlepos="top" data-id="Node_27xlm59hv-null-target" class="react-flow__handle react-flow__handle-top nodrag nopan target connectablestart connectableend" style="position: absolute; top: 0.3rem; left: 50%; width: 0.6rem; height: 0.6rem; transform: translate(-50%, -50%); z-index: 2; background: rgb(248, 251, 248); border: 0.1rem solid rgb(102, 108, 141);" ></div> 
    <div class="icon-wrapper"> 
      <svg xmlns="http://www.w3.org/2000/svg" width="2rem" height="2rem" fill="#fcf8f8" viewBox="0 0 256 256" class="icon"> 
        <path d="M200,88V200a16,16,0,0,1-16,16H40a16,16,0,0,1-16-16V88A16,16,0,0,1,40,72H184A16,16,0,0,1,200,88Zm16-48H64a8,8,0,0,0,0,16H216V176a8,8,0,0,0,16,0V56A16,16,0,0,0,216,40Z"></path> 
      </svg> 
    </div> 
    <div class="process-name"> 
      <p class="label">Section</p> 
      <p class="title"><input class="sc-gelMue fAwOCC process" placeholder="Section Name" value="New Section" /></p> 
    </div> 
    <div data-nodeid="Node_27xlm59hv" data-handlepos="bottom" data-id="Node_27xlm59hv-null-source" class="react-flow__handle react-flow__handle-bottom nodrag nopan source connectable connectablestart connectableend connectionindicator" style="position: absolute; bottom: -0.3rem; left: 50%; width: 0.6rem; height: 0.6rem; transform: translate(-50%, -50%); z-index: 2; background: rgb(248, 251, 248); border: 0.1rem solid rgb(102, 108, 141);" ></div> 
  </div>

它的样子就是标准的React Flow活动节点样式。

我写了这段Cypress代码，尝试把节点拖到网格的另一个位置：

cy.get('.react-flow__node')
  .dragBy({ x: 100, y: 100 }, { force: true });

但运行这段代码的时候报错了，没法完成拖拽操作。

想请教下各位，有没有别的办法可以实现移动这个节点？

另外附上包含该节点的网格完整HTML结构：

<div class="process-container"> 
  <div class="react-flow" data-testid="rf__wrapper" style="width: 100%; height: 100%; overflow: hidden; position: relative; z-index: 0;"> 
    <div class="react-flow__renderer" style="position: absolute; width: 100%; height: 100%; top: 0px; left: 0px;"> 
      <div class="react-flow__pane" style="position: absolute; width: 100%; height: 100%; top: 0px; left: 0px;"> 
        <div class="react-flow__viewport react-flow__container" style="transform: translate(0px, 0px) scale(1);"> 
          <svg width="860" height="545" class="react-flow__edges react-flow__container" style="z-index: 0;"> 
            <defs></defs> 
            <g></g> 
          </svg> 
          <div class="react-flow__edgelabel-renderer"></div> 
          <div class="react-flow__nodes" style="position: absolute; width: 100%; height: 100%; top: 0px; left: 0px;"> 
            <div class="react-flow__node react-flow__node-Activity nopan selectable" data-id="Node_lxmypthad" data-testid="rf__node-Node_lxmypthad" tabindex="0" role="button" aria-describedby="react-flow__node-desc-1" style="z-index: 0; transform: translate(150px, 150px); pointer-events: all; visibility: visible;"> 
              <div class="sc-lgholE iXNWnB"> 
                <div class="connection-anchor"></div> 
                <div data-nodeid="Node_lxmypthad" data-handlepos="top" data-id="Node_lxmypthad-null-target" class="react-flow__handle react-flow__handle-top nodrag nopan target connectablestart connectableend" style="position: absolute; top: 0.3rem; left: 50%; width: 0.6rem; height: 0.6rem; transform: translate(-50%, -50%); z-index: 2; background: rgb(248, 251, 248); border: 0.1rem solid rgb(102, 108, 141);"></div> 
                <div class="icon-wrapper"> 
                  <svg xmlns="http://www.w3.org/2000/svg" width="2rem" height="2rem" fill="#fcf8f8" viewBox="0 0 256 256" class="icon"> 
                    <path d="M200,88V200a16,16,0,0,1-16,16H40a16,16,0,0,1-16-16V88A16,16,0,0,1,40,72H184A16,16,0,0,1,200,88Zm16-48H64a8,8,0,0,0,0,16H216V176a8,8,0,0,0,16,0V56A16,16,0,0,0,216,40Z"></path> 
                  </svg> 
                </div> 
                <div class="process-name"> 
                  <p class="label">Section</p> 
                  <p class="title"> 
                    <p class="sc-gXnjX dvWRYS"><span>New Section</span></p> 
                  </p> 
                </div> 
                <div data-nodeid="Node_lxmypthad" data-handlepos="bottom" data-id="Node_lxmypthad-null-source" class="react-flow__handle react-flow__handle-bottom nodrag nopan source connectable connectablestart connectableend connectionindicator" style="position: absolute; bottom: -0.3rem; left: 50%; width: 0.6rem; height: 0.6rem; transform: translate(-50%, -50%); z-index: 2; background: rgb(248, 251, 248); border: 0.1rem solid rgb(102, 108, 141);"></div> 
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

内容来源于stack exchange