1

我们的 Angular 应用程序包含不同的页面，其中一个显示与mapbox-gl-js集成的地图。

由于我们集成了 mapbox，我们的量角器 e2e 测试失败。一旦测试到达显示地图的页面，下一次单击同一页面上的任何其他 HTML 元素会导致以下错误：超时 - 在 jasmine.DEFAULT_TIMEOUT_INTERVAL 指定的超时内未调用异步回调。

在测试之前工作得很好。

看来，量角器在页面上找不到任何 HTML 元素进行验证。唯一可能的方法是单击页面上的另一个元素，然后页面会冻结，直到发生超时错误。

例如：

  1. e2e-test到达地图
  2. 我可以点击带有地图的页面上的按钮
  3. 超时错误

对此的任何帮助将不胜感激。

// the map.component.html
<div class="container">
    <div #map id="map" class="dt-map"></div>
</div>

// the dt-map.component.js
@Component({
  selector: 'dt-map',
  templateUrl: './dt-map.component.html',
  styleUrls: ['./dt-map.component.scss'],
})
export class DtMapComponent implements AfterViewInit, OnDestroy {
  public map: mapboxgl.Map;

  @ViewChild('map')
  public mapElement: ElementRef;

  constructor(private dtMapService: DtMapService) {
  }

  public ngAfterViewInit(): void {
   this.map = this.dtMapService.getDtMap();
  }
}

// the working e2e test
expect(await page.isMapVisible()).toBe(true, `MapBox is not visible`);

public async isMapVisible(): Promise<boolean> {
  const el = await element(by.css('.mapboxgl-map'));
  await Expection.visibilityOf(el);
  return await el.isDisplayed();
}
4

0 回答 0