Cypress - 子窗口


Cypress 没有专门处理子窗口的命令。它通过 jQuery 提供了一种变通方法来处理子窗口。在 HTML 代码中,链接或按钮由于 target 属性而打开子窗口。

如果 target 属性的值为空白,它将打开一个子窗口。Cypress 使用 jQuery 方法 removeAttr,该方法由 Cypress 中的 invoke 命令调用。removeAttr 删除属性,该属性作为参数之一传递给 invoke 方法。

删除 target=blank 后,链接/按钮将在父窗口中打开,执行操作后,我们可以使用 go 命令返回父 URL。

在 Cypress 中打开子窗口的 HTML 代码如下:

Opening a New Window

实现

以下是 Cypress 中子窗口命令的实现:

describe('Tutorialspoint', function () {
   // test case
   it('Scenario 1', function (){
      // url launch
      cy.visit("https://the-internet.herokuapp.com/windows")
      // delete target attribute with invoke for link
      cy.get('.example > a')
      .invoke('removeAttr', 'target').click()
      // verify child window url
      cy.url()
      .should('include', 'https://the-internet.herokuapp.com/windows/new')
      // shift to parent window
      cy.go('back');
   });
});

执行结果

输出如下:

New Window

输出日志显示 target 属性的删除以及在父窗口内启动子窗口。

广告