Cypress断言数组匹配异常：emailDataVal仅取首个元素求助

核心问题 #

你的代码存在三个关键错误，导致断言匹配异常：

1. 嵌套each循环逻辑错误：外层遍历.mailto-obfuscated-email时，内层又遍历所有.amailto-obfuscated-email，导致每个外层的emailDataVal会与所有内层的obfuscateEmailText逐一断言，完全偏离了"对应元素匹配"的逻辑。
2. 类名拼写错误：内层选择器.amailto-obfuscated-email多了一个前缀a，大概率是笔误，会导致选中错误的元素集合。
3. 未按数组匹配逻辑实现：你没有将循环中的值收集为数组，而是直接在嵌套循环中做单个断言，不符合"两个数组完全相等"的需求，同时错误的循环结构导致emailDataVal重复使用，出现"所有元素均为首个元素"的问题。

修正方案 #

根据你的需求，提供两种简洁的实现方式：

方式一：收集数组后断言整体相等

it('test', () => {
  cy.visit('/landing');

  // 收集所有data-value值到数组
  const emailDataArray = [];
  cy.get('.mailto-obfuscated-email').each($el => {
    emailDataArray.push($el.data('value'));
  }).then(() => {
    // 收集处理后的邮箱文本到数组
    const obfuscatedEmailArray = [];
    cy.get('.mailto-obfuscated-email').each($el => { // 修正类名，确保与外层一致
      const processedText = $el.text()
        .replaceAll('.', '(dotted)')
        .replaceAll('@', '(at)');
      obfuscatedEmailArray.push(processedText);
    }).then(() => {
      // 断言两个数组深度相等
      expect(emailDataArray).to.deep.equal(obfuscatedEmailArray);
    });
  });
});

方式二：按索引逐个断言（更高效）

如果每个邮箱元素同时包含data-value属性和显示文本，可直接遍历单个元素集合，同时获取属性和文本：

it('test', () => {
  cy.visit('/landing');

  cy.get('.mailto-obfuscated-email').each($emailEl => {
    const originalEmail = $emailEl.data('value');
    const processedEmail = $emailEl.text()
      .replaceAll('.', '(dotted)')
      .replaceAll('@', '(at)');
    
    // 逐个断言对应元素相等
    expect(originalEmail).to.equal(processedEmail);
  });
});

关键注意事项 #

• 确保两个元素集合的选择器正确，且元素数量完全一致、索引一一对应。
• 如果页面中data-value和显示文本属于不同的DOM元素（而非同一元素），需调整选择器为对应的两个平行集合，再按索引匹配断言。

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