Cypress退出.then块后数组为空，如何保留数组内存储的值？

Cypress的所有命令都是异步入队、按声明顺序执行的，你写在.then()外部的数组读取、遍历逻辑会在.then()内部的赋值逻辑执行之前就运行，此时campArr还没有被写入数据，所以读取到的是空数组。

两种可直接落地的修改方式如下：

方案1：用cy.then()包裹依赖数组的逻辑 #

新增一个顶层cy.then()回调，把所有需要用到campArr的逻辑都放到这个回调里，Cypress会等前面队列中的所有命令执行完成后再运行回调内的代码，保证数组已经完成赋值：

it('Action -> delete -> check list of camapaigns to delete',function(){
    let campArr=[]
    
    cy.get('md-checkbox').then((box)=>{
        for(let i=1;i<box.length;i++){
            cy.get(`.md-body > :nth-child(${i}) > :nth-child(3)`).then(($el)=>{
                let elToText=$el.text()
                campArr[i-1]=elToText
            })
        }
    })
    // 新增then回调，等待前面的数组赋值逻辑执行完成
    cy.then(() => {
        cy.log(campArr.length)
        cy.get('md-checkbox').eq(0).click()
        cy.get('.btn-group>button').eq(0).click()
        cy.get('.dropdown-menu-left > :nth-child(3) > .ng-binding').click()
        cy.log(campArr[0])
        for(let i=0;i<campArr.length;i++){
            cy.get(`div.ng-scope > ul > :nth-child(${i+1})`).should('contain.text',campArr[i])
            cy.log('checked')
        }
    })
})

方案2：用Cypress别名存储数据（符合官方最佳实践） #

通过cy.wrap()把收集完成的数组存为测试别名，后续通过别名取数的逻辑会自动等待数据准备完成，写法更符合Cypress的设计规范：

it('Action -> delete -> check list of camapaigns to delete',function(){
    cy.get('md-checkbox').then((box)=>{
        const campArr = []
        for(let i=1;i<box.length;i++){
            cy.get(`.md-body > :nth-child(${i}) > :nth-child(3)`).then(($el)=>{
                campArr.push($el.text())
            })
        }
        // 将数组存为别名
        cy.wrap(campArr).as('campArr')
    })

    // 通过别名读取数组，回调会自动等待数组赋值完成
    cy.get('@campArr').then(campArr => {
        cy.log(campArr.length)
        cy.get('md-checkbox').eq(0).click()
        cy.get('.btn-group>button').eq(0).click()
        cy.get('.dropdown-menu-left > :nth-child(3) > .ng-binding').click()
        cy.log(campArr[0])
        for(let i=0;i<campArr.length;i++){
            cy.get(`div.ng-scope > ul > :nth-child(${i+1})`).should('contain.text',campArr[i])
            cy.log('checked')
        }
    })
})

内容的提问来源于stack exchange，提问作者Liel Barouch