CircleCI E2E测试因Stripe脚本触发超时失败，寻求解决方案

1. 拦截Stripe脚本加载 #

直接在Selenium中阻止Stripe相关脚本的加载，从根源避免卡住。以Chrome为例，用DevTools Protocol（CDP）命令拦截指定URL：

from selenium import webdriver
from selenium.webdriver.chrome.options import Options

options = Options()
driver = webdriver.Chrome(options=options)

# 启用网络拦截并屏蔽Stripe脚本
driver.execute_cdp_cmd('Network.setBlockedURLs', {
    "urls": ["https://js.stripe.com/*"]
})
driver.execute_cdp_cmd('Network.enable', {})

测试过程中不会加载Stripe脚本，也就不会出现停滞。

2. 临时调整CircleCI超时阈值 #

如果需要应急，可以修改CircleCI配置文件，延长无输出超时时间：

jobs:
  test:
    docker:
      - image: circleci/node:18-browsers
    steps:
      - checkout
      - run: npm install
      - run: npm test
    no_output_timeout: 20m  # 将超时从10分钟调整为20分钟

注意这只是临时方案，核心还是要解决脚本导致的停滞问题。

3. 用Mock替代真实Stripe组件 #

测试环境不加载真实Stripe脚本，用mock模拟其行为。比如React项目中用Jest mock掉Stripe依赖：

jest.mock('@stripe/react-stripe-js', () => ({
  Elements: ({ children }) => children,
  useStripe: () => ({
    createPaymentMethod: jest.fn().mockResolvedValue({})
  })
}));

组件交互时调用mock方法，不会触发真实Stripe脚本加载。

4. 优化Stripe脚本加载逻辑 #

检查项目中Stripe脚本的加载方式，改成仅在非测试环境加载或异步加载：

// 仅在非测试环境加载Stripe脚本
if (process.env.NODE_ENV !== 'test') {
  const script = document.createElement('script');
  script.src = 'https://js.stripe.com/v3/';
  script.async = true;
  document.body.appendChild(script);
}

避免测试时同步加载脚本导致Selenium等待超时。

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