带有vue.js遮罩层的应用如何用Selenium+Java捕获ISE报错？

方案1：通过浏览器性能日志捕获网络5xx错误（推荐） #

该方案完全绕过前端DOM限制，直接读取浏览器内核记录的网络请求数据，不受Vue遮罩层、前端错误提示逻辑的影响，和开发者工具Network面板获取的信息完全一致。

驱动初始化配置 #

需要在启动WebDriver时开启性能日志采集权限：

import org.openqa.selenium.chrome.ChromeOptions;
import org.openqa.selenium.logging.LogType;
import org.openqa.selenium.logging.LoggingPreferences;
import java.util.logging.Level;

// 配置Chrome参数
ChromeOptions options = new ChromeOptions();
LoggingPreferences logPrefs = new LoggingPreferences();
// 开启性能日志全量采集
logPrefs.enable(LogType.PERFORMANCE, Level.ALL);
options.setCapability(ChromeOptions.LOGGING_PREFS, logPrefs);
// 初始化驱动
WebDriver driver = new ChromeDriver(options);

操作后筛选ISE日志 #

执行点击按钮、切换标签等操作后，拉取性能日志过滤5xx状态码的请求：

import org.openqa.selenium.logging.LogEntry;
import com.fasterxml.jackson.databind.ObjectMapper;
import java.util.Map;
import java.util.List;

// 执行操作后先等待1-2秒，确保请求已返回
Thread.sleep(1500);
// 拉取所有性能日志
List<LogEntry> logs = driver.manage().logs().get(LogType.PERFORMANCE).getAll();
ObjectMapper objectMapper = new ObjectMapper();

for (LogEntry entry : logs) {
    Map<String, Object> logMap = objectMapper.readValue(entry.getMessage(), Map.class);
    Map<String, Object> message = (Map<String, Object>) logMap.get("message");
    // 匹配响应接收事件
    if ("Network.responseReceived".equals(message.get("method"))) {
        Map<String, Object> params = (Map<String, Object>) message.get("params");
        Map<String, Object> response = (Map<String, Object>) params.get("response");
        int status = (int) response.get("status");
        // 筛选5xx服务端错误
        if (status >= 500 && status < 600) {
            String errorUrl = (String) response.get("url");
            System.out.printf("捕获到ISE：请求地址%s，状态码%d%n", errorUrl, status);
            // 可扩展获取响应体、请求参数等信息
        }
    }
}
// 处理完后清空日志，避免后续操作被历史日志干扰
driver.manage().logs().get(LogType.PERFORMANCE).getAll();

方案2：Selenium 4+ 用DevTools API实时监听请求 #

如果使用Selenium 4及以上版本，可以直接调用浏览器DevTools接口实时监听网络响应，不需要手动解析日志，更灵活：

import org.openqa.selenium.devtools.DevTools;
import org.openqa.selenium.devtools.v120.network.Network;
import java.util.Optional;

DevTools devTools = ((ChromeDriver) driver).getDevTools();
devTools.createSession();
// 开启网络监听
devTools.send(Network.enable(Optional.empty(), Optional.empty(), Optional.empty()));
// 注册响应监听事件
devTools.addListener(Network.responseReceived(), responseReceived -> {
    int status = responseReceived.getResponse().getStatus();
    if (status >= 500 && status < 600) {
        System.out.printf("实时捕获ISE：请求地址%s，状态码%d%n",
                responseReceived.getResponse().getUrl(), status);
    }
});

注意事项 #

• 每次执行目标操作前建议清空已有的性能日志，避免历史请求干扰判断
• 操作后需要留足等待时间，确保异步请求完全返回再拉取日志，建议根据项目接口响应速度设置1-3秒的等待
• 不需要额外处理前端DOM或者遮罩层，该方案直接从浏览器内核读取请求数据，和前端渲染逻辑完全独立

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