Cypress - 提示彈出視窗

Cypress 可以處理提示彈出視窗，使用者可以在其中輸入值。提示視窗包含一個文字欄位，用於獲取輸入。要處理提示彈出視窗，可以使用 cy.window() 方法。

它獲取提示（遠端視窗）物件的值。在確認/警報彈出視窗中，我們必須觸發瀏覽器事件。但是對於提示彈出視窗，我們必須使用 cy.stub() 方法。

示例

讓我們看下面的示例，點選“點選獲取 JS 提示”按鈕後，會顯示一個提示彈出視窗，如下所示：

顯示以下帶有使用者輸入欄位的提示。在提示彈出視窗中輸入 Tutorialspoint，如下所示。

您輸入 - Tutorialspoint 顯示在“結果”下方。

這可以在下面顯示的螢幕中看到：

實現

下面是 Cypress 中顯示提示彈出視窗的命令實現：

describe('Tutorialspoint Test', function () {
   // test case
   it("Scenario 1", function () {
      //URL launch
      cy.visit("https://the-internet.herokuapp.com/javascript_alerts")
      //handling prompt alert
      cy.window().then(function(p){
         //stubbing prompt window
         cy.stub(p, "prompt").returns("Tutorialspoint");
         // click on Click for JS Prompt button
         cy.get(':nth-child(3) > button').click()
         // verify application message on clicking on OK
         cy.get('#result').contains('You entered: Tutorialspoint')
      });
   });
});   

執行結果

輸出如下：

輸出日誌顯示文字驗證成功。

您輸入 - Tutorialspoint，在點選提示彈出視窗上的“確定”按鈕後生成。此外，應用於提示視窗的存根在輸出日誌中可見。