网站地图提交地址做网站分几个步骤

网站地图提交地址,做网站分几个步骤,企业网站制作 深圳,响应式网站建设策划使用 Playwright 监听 Selenium 自动化测试中的 WebSocket 消息#xff08;一#xff09; 文章目录 使用 Playwright 监听 Selenium 自动化测试中的 WebSocket 消息#xff08;一#xff09;一、前言#xff1a;为什么 Selenium 自动化里“看不到” WebSocket#xff1f;…使用 Playwright 监听 Selenium 自动化测试中的 WebSocket 消息一文章目录使用 Playwright 监听 Selenium 自动化测试中的 WebSocket 消息一一、前言为什么 Selenium 自动化里“看不到” WebSocket二、整体技术方案Selenium 驱动Playwright 监听2.1 方案结构概览2.2 为什么选择 Playwright三、环境与前提条件说明3.1 技术栈前提3.2 重要约束条件四、第一步让 Selenium 启动一个“可被监听”的浏览器4.1 为什么需要 remote-debugging-port4.2 注入 ChromeOptions 的关键时机4.3 在 TestBase 中注入 remote-debugging-port五、代码实战实现 PlaywrightWsCollector专职监听 WebSocket5.1 设计一个可复用的消息模型 WsMessage5.2 端口“桥接”对象让 TestBase 能拿到端口5.3 PlaywrightWsCollector核心类骨架5.3.1 生成空闲端口多机/多进程安全5.4 完整实现PlaywrightWsCollector.cs5.5 如何在测试类里“正确初始化” Collector时序写法5.5.1 ClassInitialize生成端口 初始化 Collector但不连接5.5.2 TestInitialize先 base再 EnsureConnected5.6 本节小结下一篇预告一、前言为什么 Selenium 自动化里“看不到” WebSocket在现代前端应用中越来越多的核心逻辑通过WebSocket完成例如多人协同编辑SelectionChange、EditRecord 等实时广播实时状态同步前端操作与后端推送解耦在浏览器中这些信息可以通过DevTools → Network → WebSocket → Messages直观查看。但在 Selenium 自动化测试中会遇到一个现实问题Selenium 3.x没有 DevTools APISelenium 4.x 以上如果使用了 DevTools API需要持续更新WebDirver版本以匹配不断更新的浏览器这在以下场景中会成为瓶颈需要验证某个操作是否真的向后端发送了Action:EditRecord需要校验某一步操作触发了几次SelectionChange仅靠 UI 状态不足以判断功能是否正确本文将介绍一种借助Playwright辅助Selenium 框架的解决方案使用 Playwright 作为“旁路监听器”专门监听 WebSocket。二、整体技术方案Selenium 驱动Playwright 监听本方案的核心思想是Selenium 继续负责“操作页面”Playwright 只负责“监听浏览器的 WebSocket”。两者并不是互相替代而是各司其职。2.1 方案结构概览整体结构可以概括为Selenium创建并管理 Chrome WebDriver执行页面操作点击、输入、拖拽等Chrome启动时开启--remote-debugging-portPlaywright通过 Chrome DevTools ProtocolCDP连接到同一个浏览器实例监听 WebSocket 帧FrameSent / FrameReceived测试代码对捕获到的 WebSocket 消息进行解析和断言2.2 为什么选择 PlaywrightPlaywright 在这里的价值主要体现在原生支持CDPChrome DevTools Protocol可以附着到已经存在的浏览器进程提供page.WebSocket事件直接获取 WS 帧数据不影响 Selenium 的 UI 操作这意味着我们不需要重写现有 Selenium 用例只需额外“接一根线”。三、环境与前提条件说明在继续之前需要明确本文适用的技术前提。3.1 技术栈前提本文基于以下环境设计Selenium WebDriver3.10.x测试框架MSTest浏览器ChromePlaywright.NET 官方版本已存在的自动化框架中有统一的TestBase有 Browser 封装支持SetChromeOptions3.2 重要约束条件这是本文方案成立的关键前提不能修改 Selenium Browser 核心实现如CreateWebDriver()是私有方法Browser 类可能来自 DLL但可以修改TestBase在测试类中增加辅助逻辑测试用例可能在多台机器多进程并发执行因此本方案必须满足对现有框架侵入极小不引入端口冲突不影响非 WebSocket 用例四、第一步让 Selenium 启动一个“可被监听”的浏览器Playwright 想要监听 WebSocket有一个前提条件浏览器必须开启 remote-debugging-port。4.1 为什么需要 remote-debugging-portPlaywright 并不是“魔法监听”它的本质是通过 CDPChrome DevTools Protocol连接到浏览器调试端口订阅 Network / WebSocket 事件如果 Chrome 启动时没有开启该端口Playwright 无从连接。4.2 注入 ChromeOptions 的关键时机在很多 Selenium 框架中WebDriver 是懒加载的Browser 在第一次访问WebDriver时才真正启动浏览器幸运的是大多数成熟框架都会提供一个生命周期钩子例如protectedvirtualvoidAfterInitializeTestDriver()这个方法的特点是Browser 已创建WebDriver 尚未创建正是注入 ChromeOptions 的最佳时机4.3 在 TestBase 中注入 remote-debugging-port示例代码如下protectedoverridevoidAfterInitializeTestDriver(){base.AfterInitializeTestDriver();if(PlaywrightWsCollectorBridge.DebugPort0)return;varbrowserthis.ActiveBrowser;if(browser.BrowserTypeBrowserType.Chrome){varoptionsnewChromeOptions();options.AddArgument($--remote-debugging-port{PlaywrightWsCollectorBridge.DebugPort});browser.SetChromeOptions(options);}}这里做了三件关键的事仅在需要 WebSocket 的测试中生效通过 DebugPort 判断使用 Chrome 原生支持的--remote-debugging-port不修改 Browser 内部实现只调用公开扩展点到这里Selenium 启动的 Chrome 已经具备了“被 Playwright 监听”的能力。五、代码实战实现 PlaywrightWsCollector专职监听 WebSocket这一节的目标很明确把“DevTools 里 WS → Messages 面板看到的东西”变成测试代码里可读取、可切片、可断言的数据结构。同时要满足几个工程要求Playwright不接管 UI只监听连接必须通过CDP 端口而端口是 Selenium 启动 Chrome 时注入的避免常见坑.NET 没有 IBrowser.ContextCreated、ECONNREFUSED等能做到“只取某一步操作产生的 WS 消息”而不是全程污染。5.1 设计一个可复用的消息模型 WsMessage我们不仅要拿到文本还要知道它属于上箭头 / 下箭头Sent / Received以及消息发生顺序用于“操作切片”publicclassWsMessage{publiclongSeq{get;set;}// 递增序号用于切片publicstringMessageType{get;set;}// Sent / ReceivedpublicstringText{get;set;}// WebSocket 帧内容一般是 JSON}5.2 端口“桥接”对象让 TestBase 能拿到端口在第 4 节里已经在TestBase.AfterInitializeTestDriver()注入了--remote-debugging-portxxx但TestBase自己并不知道端口是什么因此我们用一个小桥接类存放端口值即可publicstaticclassPlaywrightWsCollectorBridge{publicstaticintDebugPort{get;set;}0;}约定DebugPort 0表示当前用例不需要 WS 监听非 0TestBase 注入该端口Playwright 用同一个端口连接。5.3 PlaywrightWsCollector核心类骨架这个类负责生成一个可用端口供 Selenium 启动 Chrome在浏览器启动后通过 CDP 连接hook page 的 WebSocket 事件收集消息、切片、分类、清理关键点不要在构造函数里 Connect否则浏览器还没启动就连会直接ECONNREFUSED。5.3.1 生成空闲端口多机/多进程安全usingSystem.Net;usingSystem.Net.Sockets;publicstaticintGenerateFreePort(){varlistenernewTcpListener(IPAddress.Loopback,0);listener.Start();intport((IPEndPoint)listener.LocalEndpoint).Port;listener.Stop();returnport;}5.4 完整实现PlaywrightWsCollector.cs说明这里使用127.0.0.1避免某些机器localhost解析到 IPv6::1导致连接异常。usingMicrosoft.Playwright;usingSystem.Collections.Concurrent;usingSystem.Threading;usingSystem.Linq;publicclassPlaywrightWsCollector:IDisposable{privateIPlaywright_playwright;privateIBrowser_browser;privatereadonlyConcurrentBagWsMessage_messagesnewConcurrentBagWsMessage();privatelong_seq0;privatebool_connectedfalse;privatebool_pageHookedfalse;publicintDebugPort{get;}publicPlaywrightWsCollector(intdebugPort){DebugPortdebugPort;// 仅保存端口不做连接}/// summary/// 在 Selenium 浏览器启动带 remote-debugging-port后调用。/// /summarypublicvoidEnsureConnected(){if(_connected)return;_playwrightPlaywright.CreateAsync().GetAwaiter().GetResult();varurl$http://127.0.0.1:{DebugPort};_browser_playwright.Chromium.ConnectOverCDPAsync(url).GetAwaiter().GetResult();HookExistingContexts(_browser);_connectedtrue;}privatevoidHookExistingContexts(IBrowserbrowser){// .NET 里没有 IBrowser.ContextCreated所以只能// 1) 先 hook 现有 contextsforeach(varctxinbrowser.Contexts){HookContext(ctx);}}privatevoidHookContext(IBrowserContextctx){// hook 已有 pageforeach(varpageinctx.Pages){HookPage(page);}// hook 新打开的 page例如 Selenium 新开 tab/windowctx.Page(_,page)HookPage(page);}privatevoidHookPage(IPagepage){// 避免重复 hook同一个测试通常只关心当前页面的 WSif(_pageHooked)return;page.WebSocket(sender,ws){ws.FrameSent(s2,frame){AddWs(Sent,frame.Text);};ws.FrameReceived(s3,frame){AddWs(Received,frame.Text);};};_pageHookedtrue;}privatevoidAddWs(stringtype,stringtext){varidInterlocked.Increment(ref_seq);_messages.Add(newWsMessage{Seqid,MessageTypetype,Texttext});}publicvoidClear(){while(_messages.TryTake(out_)){}Interlocked.Exchange(ref_seq,0);}// 核心切片只取某一步操作发生后的 WSprivateListWsMessageCaptureCore(ActionuiAction,intwaitMs){varstartInterlocked.Read(ref_seq);uiAction();Thread.Sleep(waitMs);return_messages.Where(mm.Seqstart).OrderBy(mm.Seq).ToList();}publicListstringCaptureTexts(ActionuiAction,intwaitMs1000)CaptureCore(uiAction,waitMs).Select(mm.Text).ToList();publicListWsMessageCaptureRaw(ActionuiAction,intwaitMs1000)CaptureCore(uiAction,waitMs);// 方向过滤可选带是否包含空消息参数publicIEnumerablestringOnlyReceived(IEnumerableWsMessagelist,boolcontainEmptyfalse){varqlist.Where(mm.MessageTypeReceived);if(!containEmpty){qq.Where(m!string.IsNullOrWhiteSpace(m.Text)m.Text!{});}returnq.Select(mm.Text);}publicIEnumerablestringOnlySent(IEnumerableWsMessagelist,boolcontainEmptyfalse){varqlist.Where(mm.MessageTypeSent);if(!containEmpty){qq.Where(m!string.IsNullOrWhiteSpace(m.Text)m.Text!{});}returnq.Select(mm.Text);}publicvoidDispose(){_browser?.CloseAsync().GetAwaiter().GetResult();_playwright?.Dispose();}}5.5 如何在测试类里“正确初始化” Collector时序写法这一段非常重要端口必须先确定TestBase 必须用这个端口启动 ChromeChrome 启动后 Collector 才能连接。5.5.1 ClassInitialize生成端口 初始化 Collector但不连接staticPlaywrightWsCollector_collector;[ClassInitialize]publicstaticvoidClassInit(TestContextctx){intportPlaywrightWsCollector.GenerateFreePort();PlaywrightWsCollectorBridge.DebugPortport;// 让 TestBase 注入该端口_collectornewPlaywrightWsCollector(port);}5.5.2 TestInitialize先 base再 EnsureConnected[TestInitialize]publicoverridevoidTestInitialize(){base.TestInitialize();// 触发 Selenium 启动浏览器带 remote-debugging-port_collector.EnsureConnected();// 浏览器已启动此时才连_collector.Clear();// 每个 case 清空避免污染}这段顺序颠倒就会出现错误ECONNREFUSED浏览器还没启动就连接或端口不一致Selenium 用 A 端口Playwright 连 B 端口5.6 本节小结到这一节为止框架已经具备了完整的监听能力Selenium 按原方式执行 UI 操作Playwright 通过 CDP 附着到同一个浏览器用CaptureTexts(() 某一步操作)只截取当前操作的 WSOnlySent/OnlyReceived可进一步对应 DevTools 的上下箭头到这里我们已经完成了本篇的核心目标在不改动既有 Selenium 框架的前提下通过remote-debugging-port Playwright CDP 连接成功监听到了 Selenium 驱动页面产生的WebSocket 消息并实现了消息方向区分Sent / Received按“单一步操作”切片捕获为后续断言打下基础这一步解决了**“拿到 WebSocket”**的问题。下一篇预告《使用 Playwright 监听 Selenium 自动化测试中的 WebSocket二》将重点介绍WebSocket 消息中Action的解析与统计SelectionChange / EditRecord 次数断言的实现方式PlaywrightWsCollector 在多用例场景下的复用设计常见坑点总结与工程化建议