在 Cypress 中测试拖动 Mapbox GL 地图

Question

这个问题类似于以下问题：

1. 在 Cypress 中测试拖动 Leaflet 地图
2. Cypress 和 Google 地图拖动移动元素，而不是地图

我希望能够模拟用户单击并拖动以将Mapbox GL JS地图平移一定距离。虽然这看起来是正确的方法，但使用cypress 触发器功能似乎不起作用。对于 Leaflet 链接，使用了一个单独的插件来操作 html 画布。使用 Mapbox 进行平移是否有类似的解决方法？

我在这里创建了一个独立的存储库，其中还有一个针对标记操作的测试： https: //github.com/brianbancroft/example-mapbox-cypress-e2e

这是测试本身：

  it("drags ", () => {
    const map = cy.get("#map");
    map.should("exist");

    const canvas = cy.get(".mapboxgl-canvas");

    map
      .trigger("mouseenter", 700, 250)
      .trigger("mousedown", 700, 250, {
        bubbles: true,
        waitForAnimations: true,
        // which: 1,
        // pageX: 700,
        // pageY: 250,
      })
      // .wait(100)
      .trigger("mousemove", {
        bubbles: true,
        waitForAnimations: true,
        pageX: 550,
        pageY: 250,
        which: 1,
      })
      .wait(100)
      .trigger("mouseup", {
        bubbles: true,
        waitForAnimations: true,
        which: 1,
        pageX: 550,
        pageY: 250,
      })
      .wait(100);

});
   

我想看到的： cypress 浏览器环境中的地图平移 我看到的： 地图未平移