从赛普拉斯测试中调用组件功能

Question

我有一个angular 7应用程序。我正在使用cypress测试一些画布/地图组件。我需要在组件内调用一个函数，以验证在地图上显示的geojson。

在Chrome中，我通过控制台调用ng.probe($0).componentInstance.draw.getAll()，我的数据被记录到控制台，但是当我在赛普拉斯测试中进行相同的调用时：

cy.window().then((win) => {
    const res = win.ng.probe($0).componentInstance.draw.getAll();
    console.log(res);
})

我得到ReferenceError: $0 is not defined

我该如何在cypress中调用我的角度函数？

Answer 1

变量$0仅存在于chrome-devtools内部。它是对您在“元素”面板中选择的元素的引用，如下所示（请注意== $0）：

您需要通过cy.get获得对实际元素的引用。

cy.get('.some-ng-element').then(($el) => {
  const el = $el[0]  // get the DOM element from the jquery element
  const win = el.ownerDocument.defaultView // get the window from the DOM element
  const component = win.ng.probe(el).componentInstance
})