Cypress测试全局变量与数组异常求助（wrap null报错）

核心问题根源 #

你的代码存在异步执行顺序混乱的问题，Cypress所有cy.开头的命令都是异步队列执行，而同步代码（for循环、变量赋值）会优先完成，导致数组还没填充就被赋值给全局变量，最终出现空值。

具体问题点拆解 #

1. each()内部的异步嵌套陷阱
   在cy.get().each()里的for循环中，每次调用cy.get()都会被加入Cypress命令队列，不会等待前一个完成。而values.push(amount.text().trim())是在then()回调里异步执行的，但valuesArray.push(values)是同步执行的——这意味着values数组还没填充任何内容，就已经被推进valuesArray了。

2. 无效的等待逻辑
   cy.wrap(null).should(() => { globalValues = valuesArray; })完全起不到等待异步操作的作用：should()是用来做断言验证的，不是用来等待命令队列完成的。这里只是把当时还是空的valuesArray同步赋值给globalValues，自然结果为空。

排查与修复步骤 #

步骤1：用Cypress.Promise.all()等待多列数据读取完成

把for循环里的cy.get()转换成Promise数组，用Promise.all()等待所有列的数据读取完成后，再填充values数组：

// Global variable for later use
let globalValues;

describe('Test a specific page', () => {
    it('Check a specific table', () => {
        let valuesArray = [];

        cy.get('.table1 > tbody > tr.table_class3 > td:nth-child(1)').each(($e1, index, $list) => {
            const titletext = $e1.text()
            if (titletext.includes('Amount Summary')) {
                // 生成所有列的Promise数组
                const columnPromises = [];
                for (let i = 2; i <= 15; i++) {
                    // 把cy.get()转换成Promise
                    const promise = cy.get(`.table1 > tbody > tr.table_class3 > td:nth-child(${i})`)
                        .eq(index)
                        .then(amount => amount.text().trim());
                    columnPromises.push(promise);
                }

                // 等待所有列数据读取完成，再填充数组
                Cypress.Promise.all(columnPromises).then(values => {
                    valuesArray.push(values);
                });
            }
        }).then(() => {
            // 所有each循环和内部异步操作完成后，赋值给全局变量
            globalValues = valuesArray;
            // 这里可以验证globalValues是否正确
            cy.log('Global values:', globalValues);
        });
    })
})

步骤2：避免全局变量，优先使用Cypress的别名（推荐）

全局变量在Cypress的异步环境中容易出问题，更推荐用cy.as()存储数据，后续用cy.get('@alias')获取：

describe('Test a specific page', () => {
    it('Check a specific table', () => {
        cy.get('.table1 > tbody > tr.table_class3 > td:nth-child(1)').each(($e1, index, $list) => {
            const titletext = $e1.text()
            if (titletext.includes('Amount Summary')) {
                const columnPromises = [];
                for (let i = 2; i <= 15; i++) {
                    const promise = cy.get(`.table1 > tbody > tr.table_class3 > td:nth-child(${i})`)
                        .eq(index)
                        .then(amount => amount.text().trim());
                    columnPromises.push(promise);
                }
                return Cypress.Promise.all(columnPromises);
            }
        }).then(valuesArray => {
            // 过滤空值（因为只有符合条件的行才会返回values）
            const validValues = valuesArray.filter(v => v);
            cy.wrap(validValues).as('globalValues');
        }).then(() => {
            // 后续使用数据
            cy.get('@globalValues').then(values => {
                cy.log('Stored values:', values);
                // 在这里执行其他依赖该数据的测试步骤
            });
        });
    })
})

步骤3：验证异步执行顺序

可以在关键位置添加cy.log()来打印变量值，确认执行顺序：

cy.get('.table1 > tbody > tr.table_class3 > td:nth-child(1)').each(($e1, index, $list) => {
    const titletext = $e1.text()
    cy.log('Processing row index:', index, 'title:', titletext);
    if (titletext.includes('Amount Summary')) {
        // ... 其他代码
        Cypress.Promise.all(columnPromises).then(values => {
            cy.log('Filled values for row:', values);
            valuesArray.push(values);
        });
    }
}).then(() => {
    cy.log('Final valuesArray:', valuesArray);
});

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