如何在同一選項卡中繼續？

Question

我正在處理一個非常棘手的按鈕，它應該打開一個新文檔。 默認情況下，它會在新選項卡中打開文檔，但我需要使用它，因此它會在同一頁面中打開 URL。 不幸的是，這不是在 Cypress 中有多種處理方法的href元素。 相反，按鈕看起來像這樣：

<button class="header-add-button k-button">
    <svg class="svg-inline--fa fa-plus fa-w-14" aria-hidden="true" focusable="false" data-prefix="fad" data-icon="plus" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg="">
        <g class="fa-group">
            <path class="fa-secondary" fill="currentColor" d="M176 448a32 32 0 0 0 32 32h32a32 32 0 0 0 32-32V304h-96zm64-416h-32a32 32 0 0 0-32 32v144h96V64a32 32 0 0 0-32-32z"></path>
            <path class="fa-primary" fill="currentColor" d="M448 240v32a32 32 0 0 1-32 32H32a32 32 0 0 1-32-32v-32a32 32 0 0 1 32-32h384a32 32 0 0 1 32 32z"></path>
        </g>
    </svg>
    <!-- <i class="fad fa-plus"></i> -->
    <span class="span_hover_effect" style="top: 8.9375px; left: 8.28125px;"></span>
</button>

我可以在 Cypress 中單擊此按鈕，但使用在同一選項卡中打開href鏈接的方法不適用於此處。

這是我嘗試應用在同一選項卡中繼續搜索時發現的一種方法的代碼。

cy.get('.header-add-button').invoke('removeAttr', 'target', '_blank').click()

它單擊按鈕，但頁面仍然在新選項卡中打開。

{edit} 根據開發人員的說法，按鈕通過 AJAX 調用重定向您。 不知道該怎么做，但這就是我得到的全部答案。

Answer 1

當您單擊該按鈕時，您可以檢查您的 function 是否被調用。 您必須查看 javascript 才能看到您的應用程序的名稱。 如果您需要在新選項卡上進行更多測試，我不確定如何獲得 url，但基本上它看起來像這樣：

cy.visit('./index.html') 
cy.window().then((win) => {
  // spy on 'open' function, yours might be called differently
  cy.spy(win, 'open').as('redirect');
  // or stub on 'open' function so no actually redirect occurs
  // cy.stub(win, 'open').as('redirect');
})



// click on button with ajax call

cy.get('@redirect')
  .should('be.calledWith', '_blank', '/about');

參考：

菲利普·赫里克博客

柏樹配方示例

Answer 2

將 jjhelguero 的答案與此鏈接相結合，我找到了解決方案！

    it('add contract ', function () {
      cy.window().then(win => {
         cy.stub(win, 'open').as('open')
      })
      cy.get('.header-add-button').click()
      cy.get('@open').should('be.calledWith', Cypress.sinon.match.string).then(stub => {
         cy.visit(Cypress.env('url') + stub.args[0][0]);
         stub.restore;
      })
   })

這將在同一選項卡中打開所需的鏈接，以便我可以繼續測試:)