Cypress使用origin后遇ResizeObserver循环超限错误，求解决

问题分析 #

ResizeObserver loop limit exceeded是页面内部的常见非致命警告，但会中断Cypress测试流程。你当前的全局异常捕获直接返回false会忽略所有未捕获异常，不够精准，且跨域场景下可能未完全生效。另外，Google登录页面的动态class选择器稳定性差，也可能间接导致测试执行异常。

具体解决步骤 #

1. 精准捕获ResizeObserver特定异常
   不要全局忽略所有异常，只针对该特定错误进行处理，避免掩盖其他真实问题：

   Cypress.on('uncaught:exception', (err) => {
     if (err.message.includes('ResizeObserver loop limit exceeded')) {
       return false;
     }
   });
   

2. 替换为稳定的元素定位选择器
   Google登录页面的class是动态生成的，用属性选择器更可靠：

   • 账号输入框：input[type="email"]
   • 密码输入框：input[type="password"]
   • 下一步/登录按钮：用文本或固定属性定位，比如button:contains("下一步")

3. 优化cy.origin内的测试逻辑
   替换硬等待为Cypress内置的等待机制，确保跨域场景下元素加载完成后再执行操作：

   describe('TBoss Account Creation Credentials', () => {
     // 全局捕获特定异常
     Cypress.on('uncaught:exception', (err) => {
       if (err.message.includes('ResizeObserver loop limit exceeded')) {
         return false;
       }
     });
   
     it('Identification Validation', () => {
       cy.visit('our website');
       cy.get('.mat-focus-indicator').click();
   
       // 处理Google登录跨域场景
       cy.origin('https://accounts.google.com/', () => {
         // 输入账号并点击下一步
         cy.get('input[type="email"]').type('1234');
         cy.get('button:contains("下一步")').click();
         
         // 等待密码框可见，最长等待10秒
         cy.get('input[type="password"]', { timeout: 10000 }).should('be.visible');
         // 输入密码
         cy.get('input[type="password"]').type('1234');
         // 执行登录
         cy.get('button:contains("登录")').click();
       });
     });
   });
   

4. 额外优化建议

   • 彻底放弃cy.wait(5000)这类硬等待，改用cy.get()的timeout参数或cy.intercept监听登录相关请求，等待请求完成后再执行下一步。
   • 尽量避免使用{force: true}，优先通过should('be.visible')确认元素状态正常后再操作。

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