Testcafe，如何單擊模式彈出窗口上的按鈕？

Question

我正在努力在 TestCafe 中定義一個選擇器，該選擇器單擊左側名為“開始汽車損壞索賠”的按鈕。 此按鈕出現在模態彈出窗口中。

我的代碼看起來像

class PortalDashboard {

constructor(){
    //Selectors Portal
    this.welcome_user_message = Selector('#welcomeBack') 
    this.topbar = Selector('#stateNavbar')
    this.footer = Selector('.row footerSectionOne')   
    this.policy_summary = Selector('#policySummaryList') 
    this.logout_button = Selector('.logoutBtn')
    this.my_claims = Selector('a[href="./claims"]')  
    this.view_motor_policy_details_link = (Selector('#policySummaryDetails_M0014157733').find('#claimLink_0'))
    
    //Start a claim - Modal popup
    this.motor_claim_modal = Selector ('#carAccidentDialog')
    this.property_claim_modal = Selector('.claimDialog')
    this.call_us_button = Selector('#callUsDesktop')
    this.start_claim_button = Selector('#defaultFocus')
    this.modal_popup=Selector('panel-body center')
}
async clickStartClaim(claimtype){
    await t
    .expect(this.modal_popup.exists).ok('Element not found', { timeout: config.general.shortTimeout })
    .expect(this.call_us_button.exists).ok('Element not found', { timeout: config.general.shortTimeout })
    .expect(this.start_claim_button.innerText).contains(claimtype)
    .click(this.start_claim_button)
    .setPageLoadTimeout(config.general.shortTimeout )

}

TestCafe 目前無法在彈出窗口中找到選擇器modal_popup 。

我可以使用哪個選擇器，以便 Testcafe 可以找到彈出窗口，然后單擊按鈕？

顯示錯誤：

   1) AssertionError: Element not found: expected false to be truthy

 async clickStartClaim(claimtype){
         88 |        await t
       > 89 |        .expect(this.modal_popup.exists).ok('Element not found', { timeout: config.general.shortTimeout })

Answer 1

我認為您的問題不在於按鈕本身，而在於模態。 請注意，錯誤在斷言中：

.expect(this.modal_popup.exists).ok

您的modal_popup變量是Selector('panel-body center')但您還沒有聲明是class (.) 還是id (#)。

所以你的構造函數變量應該是：

this.modal_popup = Selector('.panel-body center')
                             ^
                            This

如果你不使用. 或# ，TestCafe 將查找值作為標簽（ div ， button ...）並且panel-body不是標簽，是類名。