C#环境下如何让Selenium ChromeDriver等待所有GraphQL请求完成

嗨，我之前在做React+GraphQL的Selenium自动化测试时，也碰到过和你一样的问题——没法像jQuery那样直接拿现成的活跃请求计数器。不过别担心，我们可以自己实现一个请求跟踪机制，亲测有效，下面是具体的方案：

核心思路 #

GraphQL本身没有类似jQuery.active的内置属性来统计活跃请求，所以我们需要手动拦截页面上的fetch和XMLHttpRequest请求（React项目里的GraphQL请求基本都是通过这两种方式发起的），针对GraphQL特定端点的请求维护一个活跃计数，最后让Selenium等待这个计数归0即可。

具体实现步骤 #

1. 注入请求跟踪的JavaScript代码
   在测试初始化时（比如打开目标页面后），先执行这段JS代码，它会覆盖浏览器原生的请求方法，自动统计GraphQL请求的活跃数量，并把计数器挂在window对象上方便Selenium调用：

// 注入GraphQL请求跟踪脚本
IJavaScriptExecutor jsExecutor = (IJavaScriptExecutor)Driver;
jsExecutor.ExecuteScript(@"
    // 初始化GraphQL活跃请求计数器
    window.graphQLActiveRequests = 0;

    // 拦截fetch发起的请求
    const originalFetch = window.fetch;
    window.fetch = function(resource, options) {
        // 根据你的项目实际GraphQL端点调整匹配规则，比如'/graphql'或'/api/graphql'
        const isGraphQLRequest = typeof resource === 'string' 
            ? resource.includes('/graphql') 
            : resource?.url?.includes('/graphql');
        
        if (isGraphQLRequest) {
            window.graphQLActiveRequests++;
        }

        const promise = originalFetch.apply(this, arguments);
        
        // 请求完成（无论成功/失败/中断）都减少计数
        if (isGraphQLRequest) {
            promise.finally(() => {
                window.graphQLActiveRequests--;
            });
        }

        return promise;
    };

    // 拦截XMLHttpRequest发起的请求（比如Axios底层用的就是XHR）
    const originalXHROpen = XMLHttpRequest.prototype.open;
    XMLHttpRequest.prototype.open = function(method, url) {
        this._isGraphQLRequest = url.includes('/graphql');
        
        if (this._isGraphQLRequest) {
            window.graphQLActiveRequests++;
        }

        originalXHROpen.apply(this, arguments);

        // 定义计数递减的通用方法
        const decrementCount = () => {
            if (this._isGraphQLRequest) {
                window.graphQLActiveRequests--;
            }
        };

        // 监听请求的完成、错误、中断事件
        const originalOnLoad = this.onload;
        this.onload = function() {
            decrementCount();
            if (originalOnLoad) originalOnLoad.apply(this, arguments);
        };

        const originalOnError = this.onerror;
        this.onerror = function() {
            decrementCount();
            if (originalOnError) originalOnError.apply(this, arguments);
        };

        const originalOnAbort = this.onabort;
        this.onabort = function() {
            decrementCount();
            if (originalOnAbort) originalOnAbort.apply(this, arguments);
        };
    };
");

2. 编写等待GraphQL请求完成的代码
   和你之前等待jQuery请求的逻辑类似，我们用WebDriverWait来轮询判断活跃请求计数是否为0：

// 等待所有GraphQL请求完成，超时时间设为10秒（可根据你的项目调整）
new WebDriverWait(Driver, TimeSpan.FromSeconds(10)).Until(d => 
    (bool)((IJavaScriptExecutor)d).ExecuteScript(@"
        return typeof window.graphQLActiveRequests !== 'undefined' && window.graphQLActiveRequests === 0;
    ")
);

注意事项 #

• 一定要根据你项目的实际GraphQL端点调整代码中的匹配规则，比如如果你的请求地址是https://your-domain.com/api/graphql，就把url.includes('/graphql')改成对应的判断逻辑，确保只跟踪GraphQL请求。
• 建议在页面加载完成后立即注入跟踪脚本，避免漏统计页面初始化时发起的GraphQL请求。

备注：内容来源于stack exchange，提问作者Martin Holý