Cypress测试用数组时抛AssertionError：expected undefined to equal '400'

问题复现 #

测试代码如下：

const months = [
        'JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'
      ];
  
      // Create an object to store the values dynamically
      const values = {};
  
      // Use a loop to iterate over each month
      months.forEach((month, index) => {
        cy.get('.tabele1 > tbody > tr.table_row3 > td:nth-child(1)').each(($e1, rowIndex, $list) => {
          var titletext = $e1.text();
          if (titletext.includes('Some Headline Text')) {
            cy.get(`.table1 > tbody > tr.table_row3 > td:nth-child(${index + 2})`).eq(rowIndex).then(function (amount) {
              // Dynamically store values in the object
              values[`valueMA_${month}1`] = amount.text().trim();
            });
          }
        });
      });

      // Example assertions in a loop
    months.forEach((month, index) => {
        expect (values[`valueMA_${month}1`]).to.equal('400');
    });

运行后抛出错误：

AssertionError

expected undefined to equal '400'

错误指向断言行：expect (values[valueMA_${month}1]).to.equal('400');

问题原因 #

1. 异步执行顺序冲突：Cypress所有命令都是异步的，但forEach是同步循环。断言代码会在cy.get、.then这些异步赋值操作完成前就执行，此时values对象还未被赋值，自然返回undefined。
2. 选择器拼写错误：第一个cy.get使用了.tabele1（多了一个字母e），但后续定位用的是.table1，如果页面不存在.tabele1元素，整个赋值逻辑根本不会触发，直接导致values为空。
3. 嵌套循环逻辑冗余：外层遍历月份、内层遍历表格行，会导致每个月份都重复遍历一次所有行，不仅效率低下，还可能因异步时序问题出现赋值覆盖或失败。

解决方案 #

步骤1：修复选择器拼写错误 #

将.tabele1修正为.table1，确保能正确定位到目标表格元素。

步骤2：调整异步逻辑，保证断言时机正确 #

利用Cypress的命令链特性，把断言逻辑放到所有赋值操作完成后的.then回调中，确保values已被正确赋值后再执行断言。

步骤3：优化循环逻辑，避免冗余遍历 #

先定位到包含目标文本的行，再一次性提取该行所有月份列的数值，无需每个月份都重复遍历行。

修正后的代码示例：

const months = ['JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'];
const values = {};

// 先定位到包含目标文本的行
cy.get('.table1 > tbody > tr.table_row3').filter((index, el) => {
  return Cypress.$(el).find('td:nth-child(1)').text().includes('Some Headline Text');
}).then(($targetRow) => {
  // 遍历月份，提取对应列的数值
  months.forEach((month, index) => {
    const amountText = $targetRow.find(`td:nth-child(${index + 2})`).text().trim();
    values[`valueMA_${month}1`] = amountText;
  });

  // 此时values已完成赋值，执行断言
  months.forEach((month) => {
    expect(values[`valueMA_${month}1`]).to.equal('400');
  });
});

额外说明 #

如果表格中有多行符合文本匹配条件，可以把.filter换成.each，同时调整values的存储结构（比如用数组或带行索引的属性名），避免不同行的数值互相覆盖。

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