单步调试找到 cy.visit 的实现源代码(二) - WebSocket?

简介: 单步调试找到 cy.visit 的实现源代码(二) - WebSocket?

系列1:单步调试找到 cy.visit 的实现源代码(一) - 找到了 BlueBird


我们的目标是找到 cy.visit 是如何向目标网站发起请求的:



来到这行:


return this.emit('backend:request', eventName, ...args, fn);


单步调试进去:



观察者发布者的讨论都一样,根据 event 找到 listener:



这个 ws,意思是 Web Socket 吗?



这个全局对象在此导入:packages_socket__WEBPACK_IMPORTED_MODULE_4_





首先要找到这个 browser.ts 在本地什么位置,然后才能知道它是啥东西?


本地找了一圈,没找到这个文件。


单步调试:



第九行的 if 语句进不去:



然后执行这个 index.js 文件:



注意这些嵌套的 Webpack_require 调用:



parseuri:



但是本地 node_modules 文件夹里,并没有这个叫做 parseuri 的文件夹。


而是这个 …/…/node_modules/parseuri/index.js,直接出现在 cypress_runner.js 源文件里:



这些出现在 cypress_runner.js 里的 browser.ts, 应该是从某个地方拷贝过来的吧。这里又涉及到一个问题,这个 cypress_runner.js 的生成逻辑和时机?



工程文件夹里也没有叫 socket 的文件夹。



最后发现,使用的是浏览器原生的 WebSocket 的 send 方法,发送请求到目标网站:



遗留问题:


  1. cypress_runner.js 这个文件哪里来的?

  2. 使用 WebSocket 的好处?

第一个问题我们回答不了,因为我们还不知道我们使用命令行 yarn cypress:open 之后,背后都发生了什么。



这里又引出第三个有趣的问题:



我们在 package.json 给 cypress:open 指定的命令行是 cypress open,但是我们直接在命令行窗口里使用 cypress open, 是无法启动的:



但为啥用 yarn cypress:open 就可以?


在 node_modules 文件夹下的 .bin 文件夹里的 cypress.cmd 里加一行打印语句:




运行时的输出:



说明 yarn cypress:open 命令行,会调用到 .bin 文件夹内的 cypress.cmd:



.bin 下的 cypress 改成其他名称,对 windows 系统下的命令行运行也没有影响:




但是把 cypress.cmd 改成其他名称,比如 cypress.cmd22, 运行命令行就会出错了,进一步说明 node_modules\.bin\cypress.cmd 是 windows 下 cypress open 命令的入口。



至此我们又引入了第四个问题:


node_modules 根目录下的 .bin ,



和 node_modules/cypress/bin 这两个 bin 文件夹的联系?


相关文章
|
12月前
|
网络协议 Dubbo 应用服务中间件
实操指南:Postman 怎么调试 WebSocket
WebSocket 是一个支持双向通信的网络协议,它在实时性和效率方面具有很大的优势。Postman 是一个流行的 API 开发工具,它提供了许多功能来测试和调试 RESTful API 接口,最新的版本也支持 WebSocket 接口的调试。想要学习更多关于 Postman 的知识,可访问 Postman 中文文档。在本文中,我们将介绍如何使用 Postman 调试 WebSocket 接口。
|
资源调度 Windows
单步调试找到 cy.visit 的实现源代码(二) - WebSocket?
单步调试找到 cy.visit 的实现源代码(二) - WebSocket?
106 0
单步调试找到 cy.visit 的实现源代码(二) - WebSocket?
|
Web App开发 开发者
如何使用Chrome开发者工具调试web socket应用
如何使用Chrome开发者工具调试web socket应用
800 0
如何使用Chrome开发者工具调试web socket应用
|
5月前
|
网络协议 前端开发 Java
SpringBoot 整合 WebSocket
WebSocket是基于TCP协议的一种网络协议,它实现了浏览器与服务器全双工通信,支持客户端和服务端之间相互发送信息。在有WebSocket之前,如果服务端数据发生了改变,客户端想知道的话,只能采用定时轮询的方式去服务端获取,这种方式很大程度上增大了服务器端的压力,有了WebSocket之后,如果服务端数据发生改变,可以立即通知客户端,客户端就不用轮询去换取,降低了服务器的压力。目前主流的浏览器都已经支持WebSocket协议了。
|
3月前
|
前端开发 网络协议 JavaScript
在Spring Boot中实现基于WebSocket的实时通信
在Spring Boot中实现基于WebSocket的实时通信
|
2月前
|
开发框架 网络协议 Java
SpringBoot WebSocket大揭秘:实时通信、高效协作,一文让你彻底解锁!
【8月更文挑战第25天】本文介绍如何在SpringBoot项目中集成WebSocket以实现客户端与服务端的实时通信。首先概述了WebSocket的基本原理及其优势,接着详细阐述了集成步骤:添加依赖、配置WebSocket、定义WebSocket接口及进行测试。通过示例代码展示了整个过程,旨在帮助开发者更好地理解和应用这一技术。
86 1
|
2月前
|
小程序 Java API
springboot 微信小程序整合websocket,实现发送提醒消息
springboot 微信小程序整合websocket,实现发送提醒消息
|
2月前
|
JavaScript 前端开发 网络协议
WebSocket在Java Spring Boot+Vue框架中实现消息推送功能
在现代Web应用中,实时消息提醒是一项非常重要的功能,能够极大地提升用户体验。WebSocket作为一种在单个TCP连接上进行全双工通信的协议,为实现实时消息提醒提供了高效且低延迟的解决方案。本文将详细介绍如何在Java Spring Boot后端和Vue前端框架中利用WebSocket实现消息提醒功能。
|
4月前
|
前端开发 JavaScript 安全
集成WebSocket在Spring Boot中可以用于实现实时的双向通信
集成WebSocket在Spring Boot中可以用于实现实时的双向通信
76 4
|
3月前
|
监控 网络协议 Java
如何在Spring Boot中使用WebSocket
如何在Spring Boot中使用WebSocket