有條件的測試繞過與Testcafe彈出

Question

我使用testcafe在電子商務頁面中運行一些測試，但隨機彈出正在打破測試。當它出現在窗口上時，Testcafe無法點擊下一個選擇器並隨着測試向前移動，然後失敗。

目前，我正在使用的.js文件來保存選擇，如：

import { Selector } from 'testcafe'; 

    export default class Checkout { 
     constructor() { 
      //address 
      this.addressName = Selector('input#CC-checkoutCepAddressBook-sfirstname'); 
      this.addressLastname = Selector('input#CC-checkoutCepAddressBook-slastname'); 

//Rest of selectors... 
} 

然後，我將其導入到另一個.js文件和申報測試，如功能：

import { ClientFunction } from 'testcafe'; 
import { Selector } from 'testcafe'; 
import Fixture from '../../../DesktopModel/Chrome/fixture.js'; 
import Home from '../../../DesktopModel/Chrome/home.js'; 
import Cart from '../../../DesktopModel/Chrome/cart.js'; 
... 
const fixtureUrlBase = new Fixture(); 
const home = new Home(); 
const pdp = new Pdp(); 
const cart = new Cart(); 
... 

export async function checkoutLoggedBoleto(t) { 

await t 
    .click(pdp.addToCartBtn) 
    .click(home.finishOrderBtn) 
    .click(cart.finishOrderBtn) 

    //Rest of the test actions...} 

最後，我正在執行另一個.js，在此我使用測試命令聲明測試：

test 
    .before(async t => { 
     await login(t); 
    }) 

('Desktop - User Login + Checkout with Invoice', async t => { 

    // Function Login => Search => PDP => Checkout with Invoice 
    await checkoutLoggedBoleto(t); 
}); 

由於它是一個隨機事件（它發生在不同時刻，例如有時在產品頁面中，有時在結帳頁面中），可以使用一些有條件的測試繞過此彈出框，就像彈出'x'一樣在屏幕上點擊'關閉彈出'並繼續測試，否則繼續測試。

我在testcafe Test API中搜索並沒有找到這樣的功能。

我正在使用testcafe 0.17.0。

Answer 1

TestCafe不爲此提供API。爲了處理你的情況，你可以檢查彈出窗口是否出現在每個動作之前。 可選，使你的代碼更清潔，您可以通過以下方式包裹TestCafe API操作：

import { t, Selector } from 'testcafe'; 

const closePopupBtn = Selector('.close-popup'); 

async function checkPopup() { 
    if(await closePopupBtn.exists) 
     await t.click(closePopupBtn); 
} 

const tc = { 
    click: async selector => { 
     await checkPopup(); 
     await t.click(selector); 
    } 
} 

test('my test', async() => { 
    await tc.click('.btn1'); 
    await tc.click('.btn2'); 
});