playwright实际项目效果

那我们继续来看一下我们是如何制作一个视频号，我们需要啊，当我们制作完一个视频号的一个发布作品之后啊，也把它的封面标题啊，还有一些关键词啊，都已经准备好了。那我们如果我们需要手动操作的话，需要我们 一个一个去做编辑设置，那我们现在本期视频是想通过一个自动化的流程完成，用程序自动化的完成我们这个设置和设置的一些动作。那我们写了一些提示词可以观看一下， 我们先启动一下 code x， 让 code x 来帮我们去做实现啊，可以看到我们使用的是 code x 五点四的一个模型 来粘贴一下我们的一个提示词，就是视频号作品发布啊，发布的步骤是下面这个操作，我们的诉求是进入到这个编号的一个发布页，身份过期后，我们可能会遇到密码登录啊，我们上边的这个主要是基于 playride c i i 来这个技能来完成一个自动化的操作。 第二步是完成，我们需要这个自动化流程里边需要完成视频的上传啊，视频的描述包括我们的位置啊，合集的一个设置，如果是没有匹配的合集呢？我们允许它自动创建一个新的合集分类，还有一个短标题的一个设置。第三是信息页设置，参考我们啊，这个位置里面我们已经准备好的封面标题摘要以及关键字啊， 选择和市民号匹配的一个物料进行设置。最后一步是设置完之后，然后禁止直接发布，因为我们需要做一次也做一次的一个审，人工的一个审阅，保证完全没有问题，我们自己来手动做后续的发布动作。看好，这就是我们对这个自动化流程的一些要求 啊。那我们后边来继续让 codex 帮我们去实现整个一个流程的一个自动化啊，我们等一下来看它如何去处理自动化的一个流程啊，它正在继续跑，正在分析我们的诉求。它先加在这个仓库啊，这个仓库 write 约束，然后直接进入视频号发毕业判断登录态和表单结构。这个我们是不是改过呀？我看一下啊， 已经改过了，是吧？那我们需要给重新给一下它应该是在换了一个新的位置啊， 那么需要重新给一下他的一个布料的一个本地的一个目录，重新指定一下本地的一个素材目录，那我们反馈给那个 agent， 他 其实自动的也找到了，他已经找到了我们最新的目录， 因为在开始之前我是重新去试啊，整理一下我这个素材的发布目录啊，已经有一个新的目录，现在他在原来的这个提示词的基础上是没有办法找到的，他会自动的啊，他也很聪明啊，自己去找到了一个我们最新的整理后的一个发布目录啊，到手机上确认还是一扫码，登录也显示一扫码， 他已经通过调用了。我们 playright c i y 已经看到了我们的登录页，是吧？我们登录页已经进行过扫码了，当前还没有进入发布页卡在登录的确认啊，我已确认登录啊，准备这些材料，发布版 seo 封面选择啊。一扫码需要在手机上确认啊，我现在打开的浏览器对应手机确认，确认后回我自己登录。 ok， 他 没有打开页面啊，没有收到手机上的确认请求。必须持续的绘画中心去优先把登录页稳住。已经重新生成了一张二维码页。我直接在连窗口重新扫，并直接打开浏览器。 我来手动扫码，手动确认窗口没有看到，有这边的吗？这个吗？他现在正在去让我们确认，是吧？他要来打开我们的浏览器了。 那我们直接确认登录啊，他现在打打开了我们这个视频号的一个登录页，那我们再用手机去扫一下，完成登录， 现在已经登录到了我们的一个视频号的发布页面。那好的，那我直接去告诉 beirut， 然后 c l i 已登录，看他如何自动化的去操作我们的视频发布的一个流程，中间可能会遇到一些问题。没关系，他如果遇到问题，我们直接把问题啊，比如说填的一些信息不准确啊， 我们需要，需要重新去校正他的一个操作流程和信息的一个获取啊，这个都没关系的，我们先看一下他接下来要如何做好。他现在是把这个 play right。 c i i 已经啊附着到了我们真实的浏览器环境里边，他可以附用我们的一个登录态，自动化的控制登录态不会丢失。 那我们去授权他，当前这个可见的框门很可能没有真实带上远程的参数。那好的，我们来授权给他拿起一个带调试端口，你扫一次后我就能够稳定接管。好，那现在他应该没有开启他的一个调试端口， 我拿重新来问题，不再登录态，在浏览器搜索出发了。兼容点切换到页面级的 cdp， 这样直接控制当前发布页，不再经过那段报错的。 ok， 同意他，我想重新自己控制的。可见窗口地址是视频下面出现新窗口，如果出现直接扫码。他又新打开了一个，那我们再重新重新去扫码一次，这个就不需要了，先把这个关掉，重新去扫码。这个窗口，我们又一次进入到了我们的视频号的一个发布页面，那我们已经 已经登录，那这次可不可以完成设置啊？他现在已经读取到了我们登录的这个窗口的发布页结构，上传区，把位置集合，设置空卷，开始逐帧的去 逐项的去填充。发布页的结构已经拿到，我先上传视频看他这边我们可以观察一下他的一个自动化操作的一个流程， 短标题已经填上了二次，这个重构升级问题在自动化的去操作，我们这个页面又一次打开了，又一次打开了一个窗口。更稳定的方式，而不是默认回话，直接指定刚才的已登录用户目录重新打开，这样能绕过回话锁，同时尽量保证登录。太 啊，修了一通还是不行是吧？他决定要重置这个僵尸的浏览器，重新来一次，那我们就重新来一次，这个应该也需要关掉，重新打开一个干净可见的窗口，是吧？重新扫一次， 进来了，他就默认进来了，我们因为已经刚才授权过了，他已登录，他已经可以服用了啊。他就开始后续的自动化的一个操作，看一下他能不能自动上传视频啊。设置合集的一些设置，观察一下，把命令保留，点上传，选择合并成一个，在同一个软件完成。我要把点上传，看他如何处理啊。 先确认当前的，看一下前期的调试，我们可可能会麻烦一点，看他现在遇到了一些问题。那我们没关系，可以一步一步的做修复啊。修复完之后呢，我们顺利的把这个填完，就能够把整个流程做一次啊。一个 skill 化，脚本化，完成，后续顺畅的，丝滑的这种自动化的一个视频号发布 啊。没关系，我们现在遇到问题可以让他慢慢去修复。不好弄啊，一层复杂的胶布，不再单独一条完整脚本里用多种回退策略 描述位置。合集的短上标题卡在平台上传乱录不是文，文案逻辑看一下，另外方面都能打开文。本次段位已经验证定位真正在大时间上班。当前这条视频通过远程 c d p 会撞上五百兆的限制，大部分没有稳定完。确认下一步视频上之后继续做 下一步，只做视频已上传。视频上传我可以不动弹完回我一句，视频上传下来做搬砖。我们需要重新授权一下啊。 又重新登录一下，那人是空的，没有真实登录。重新登录再重新上传一下真实 send， 而是 chrome 关闭了脚本注入能力。我已经不是一直在走这这一条。你之前问题之所以问题多，不是视频号本身特别 三种。这个这个问题比较多，不是比较多，要稳定的只有两个，从一开始就用同一个，类似于计算机完成不换，一开始就用真实的开启的，只走一条控制。这次出问题的原因有几个，不良，管理不稳定真实 crm， c d p 附着不完整，大文件上传与 d p 天然冲突， 让某个人进掉了。这个视频号发布本身是 frame 微前端结构，但不在顶层的 dom 底，在这会放大上面所有空间链路问题，但画段 frame 延迟不一致，就会出现能看到页面但抓不到输入空间。你需要最稳的方法，我建议只选一个最稳。你开启这个允许 允许 app 实 app 实现中的数值直接在当前真实段去继续填后半段你手动上视频，我自动填其他字段， 单一个配置优化，在窗口重新自动做安全任务。这个路径 ok， 那 就再试一次查看，手动打开这个选项，他是允许 ap 中的本布兰。如果你没有看开发者勾选显示开发者菜单，开发者公。哦，看见了，已经勾选了， 已开启。那我们再登录一次啊。他的样子说他要自动去写了，我们看现在能不能自动写啊。已经写完了，他自动在执行这个位置啊。 视频的链接链接没有填是吧？短标题也填了。视频上传他没有做是吧？我们看一会再让他去做一下。视频上传能不能完成，定位没有改过来，我们看一下他能不能成功啊。这个合集也自动匹配上了的，我们现在有一个 ai 全站与自动化。 那选的选的是这个机，刚才的脚本是引导状了是吧？那我拆成更小的两步，先拉取位置搜索并读取选项。他正在去校正这个位置啊，现在是他自动发发控浏览器做这样的操作，他真实的去点击走他自己的搜索流程， 他会改一下，应该先选北京市，然后再选朝阳区。他就直接把所有的整个精确的位置去入了，去 允许操控可访问的 c 三文稿和数据。后半段我已经填了当前时这个位置没成功，是吧？具体这个位置空间我省，最省钱法来手动把位置，我已经把后段位填好了。不用，我已经授权了。注意一重新编辑 位置，他刚才已经在尝试了，按照用户的实际操作来尝试了。确实啊，我们手动也不能改这个啊，为什么？我就如何打开自己手动打开功能，记得上次我手动发布是可以改这个位置的啊，现在是自动化的浏览器打开，他不能够按一下手动操作 不显示位置吧，那就不显示位置，那就显示设置成不显示位置。他现在已经改动过了啊，那没有什么问题，那我们再让他尝试去上传一下啊，请在 自动化操作页面进行进行一次录屏上传，我直接当当前打开的发布。要做一次真实视频，先点击按钮，用系统键盘送出去啊，没问题，让他尝试一下。本来这个视频也没问题啊，是我们的发布版视频。那如何自动化操作的啊？可以搜索了， 我们直接截图给他吧。是截图中的这个位置，点击之后会会触发文件上传，选择选择文件，重新直接没问题，是吧？ ok， ok ok， 已经成功了，他还是有的时候会识别不到我们具体的一个目标的一个元素，是吧？那我们需要去在整个的交互过程中告诉他，明确的告诉他一些我们需要点击的元素啊，这样不用去，他，不用让他去消耗额外的托管去找这个元素，就是我们后续需要加强加强的。 那我们同意一下，他点击已经执行完了，现在回到页面上上传状态。 ok， 那 这个已经没用了是吧？这个位置 他已经做的这个操作已经没用了，别错了，直接弄到我们页面。啊，那我们这是出现啥问题了？重新登录单账号在其他设备我们再重新扫一下啊， 刚才因为我在另一个浏览器里边也登录一下，看手动看一下他的位置的问题啊，那我们再重新授权一下，离开此网站，可能会离开网站重新来一把。那我们直接直接内容管理管理 中途啊，登录失效，需要失效，要重新将上树，上树要重新拍一次，我们需要重来一次是吧？ ok， 现在上传了是吧？先把我们这个视频设置好，我可以打开。现在这个已经设置好了，其他的选设置项也都已经设置好了， 我这边封面还没设计好，那我们需要让他优化一下，我们整理一下，他需要做这些优化，然后再补充一个图像视频封面，封面也需要到提供的提供的素材里面，然后到最匹配的设置， 我们让他去做这个在开着呢吧，可以把这个关闭暂停一下。那我们需要把标题和文档里边的， 因为我们现在本地的文档里边标题最后一项是我们往往做的一些最终的确认的标题，所以我们要让他选最后一项做标题的设置，因为现在他选的这个标题不是不符合我们最后的预期，最终的预期可以看一下这个标题，我们这个标题你可以看一下，我们这里设计的标题是这个 一个标题，是吧？这是第一个标题，这是第一个标题，我们其实想选用第二个标题，所以我们啊有一个要求是让他选择这个标题向的最后一个标题，文档减速要长短，长短两百，但是并没有匹配任何一个，这个题是没问题的，是吧？我们已经匹配上了， 这个比较次升级也匹配上了一个短的，没问题。那我们可以不加这一项，那把这一项去掉，关键字添加去除啊，那关键字他也没有填，是吧？我们这里边还需要加到关键字，关键字添加需要去除掉关键字，关键字字直接放到啊，封面 描述最后说明中的文案作为换行，这个是咱们在这改成封面描述，那文案做一些换行，换成一行一个相对短的句子， 空行更容易阅读，没问题，那我们就把这些让他做一次优化，免我们后续频繁的手工改动，是吧？直接让他去做一些优化。做优化啊，他现在已经开始选择他的封面了，是吧？他是应该现在正在找，我先检查分享卡片素材编辑图已经改了，导航 这个关键字的设置没问题，这个超限了，是吧？我要告诉这个位置需要在这里点击分别上传两种尺寸的封面，这个一会还需要改一下，是吧？因为我们手动改也行。 ok， 他 正在自动化的操作，选上传了这个 四比三，三比四的一个图片，点击确定是吧，需要授权一下选才不成功啊。已经设置完三比四的了，现在开始设置四比三的， 那我们需要调整一下，调到这个位置，再让他去确认问题。第三的已经进到了上传器继续授权了，他已经识别到这个短标题会超出限制，是吧？ 那就是你要求的这个最终标题已经写尽，但他不满足规则的方式用于你确定的主题域单独换一个合规的标题，但是页面现在并没有，但是还停留在封面上传的封面， 封面上传到弹光里，自动关闭之后进行标题的步骤，我们尽量让他自动化的完成这个流程，因为我们后续还需要沉淀一个 skill 呢。脚本 脚本画的不行，所以我们尽量让他去自动化的完成已经，但是没有替换成功啊，为啥没设置成功呢？但是封面都没有设置设置成功，唱和手动尝试三比四封面上传而已， 这是什么？请自动话这个流程分享选图片不对啊，我们需要重新让他去选一下啊。本次的视频号的发布流程遇到的坑还挺多的，我们需要总结一下他整个的一个 比较顺畅的一个发布流程，我们下次啊，如果是沉淀了 skill 对 应的 skill 技能，用一个比较顺畅的方式来，就不会有这么多问题了。我肯定会在整最开始的这一次会遇到一些遇到比较多的坑，这都很正常，我们只要一步步的去修复就可以。那这样已经开始去点击了，他现在选用的是四比三的， 这样应该是没问题的，大家也不需要去去去剪裁了，因为我们这个已经已经在设计阶段，已经完全适配了它整个的一个内容的一个展示，这个也设置成功了，没问题啊，那这个短标题我们就暂时用这个吧，系统升级你的按钮该升级了，那就直接改一下吧，我手动改一下吧，这个应该再加个空格，可以吗？ 那我们现在就以这种方式啊，没问题，那我确定一下上传了是吧？点击保存，弹框已关闭，那相当于现在我们已经大部分。是啊，当然这个短标起我们当时是因为啊，他的限制规则限制啊，我们只手动改一版，后续我们可以直接在 在我们素材文档里边直接去设置一个符合规则的，他自己就可以挑选了，那我们现在手动试试这个，其他的全是通过自动化的方式来填写的，包括我们的描述的一些分行啊，是吧？还有最后的一个啊，最后的关键字的填写啊，都是自动化填入的，包括我们视频上传啊，没有问题啊， 那我们现在就可以直接点击发布啊，这样现在我们可以直接看到我们最新的系统升级的一个作品已经发布了，是吧？ 那我们现在本期因为这个视频时间有点长了，我们现在就先到这里，这期视频主要讲的就是我们和 agent 做交互，逐渐的去 实现我们整个视频号自动化发布的这个流程中间遇到了很多的问题，很多的坑啊。没关系，因为我们这是第一次在跑这个流程，主要 任务就是把整个流程自动化的去跑通。下期视频呢，我们会重点的去把整个的交互的流程，包括遇到的一些坑以及它的一个最优路径来沉淀一个 skill 啊，并且让我们的 skill 足够的去脚本化啊，完成整个比较顺畅且丝滑的一个视频号的一个发布的一个技能 啊，本期视频就到这里啊，我们期待下一个视频我们来去封装这个 skill 啊，并且后续我们都附用这个 skill 来完成我们自动化的一个视频号的一个发布。好，那我们本期视频就到这里，感谢大家观看，再见。

今天咱们聊一个很多测试朋友都关心的话题， playrite 为什么比三零年快那么多？其实 playrite 的 性能优势不是靠一个点，而是从底层到上层的全面现代化设计。我们先看一下核心对比，像通信协议 playrite， 用 web socket 长连接， 三零六用 h t t p 请求响应浏览器控制层 playrite 直连浏览器的 dev tools 协议 selenium 要通过 webdriver 协议加浏览器驱动等待机制， play right 内置智能自动等待， selenium 得手动斜显示或隐式等待资源管理 play right 支持浏览器上下文附用 三零幺幺八，每个用力启动全新浏览器网络拦截模拟 play right 原声支持三联宁要依赖外部代理工具。为什么差距这么大？ 三个核心原因。第一个，通信协议 play right 用 web socket 长连接，就像一条始终在线的电话线，指令实时双向传输，单次操作延迟可以控制在两百毫秒以内。 而三里念还是老旧的 h t p 请求响应模式，每次操作都要建立连接，发请求等响应，再关连接，单次延迟往往超过五百毫秒， 一百个操作下来差距非常明显。第二个，去中介化的直连模式 play rate， 通过 web socket 直接连到浏览器的原声调试协议，省掉了中间驱动层。 费里尼奥呢？指令得先发给一个独立的浏览器驱动，比如 chrome driver， 让它翻译一遍再转给浏览器， 多了一道翻译，就多了叙列化、反叙列化和网络延迟。第三个，更智能的自动等待 play right 内置智能等待执行操作前自动轮询等元素，真正可见稳定可点击了才动手，精准又高效。而 selenium 的 显示等待本质是客户端轮询。 乔本定期发 h t t p 请求，问元素好了没？这本身就在网络和代码层面引入了额外开销。除此之外， playright 还有两个辅助优势，一是高效附用浏览器上下文， 避免反复启动销毁浏览器。有分析说，优化前超过百分之六十的测试时间就浪费在这上面。二是原生支持网络拦截、并行执行等现代功能，不用像 selenim 那 样依赖外部工具，既省事又少了一层性能损耗。那么实际效果如何？ 数据说话，各类测试中， playrite 的 执行速度通常比 selenium 快 百分之二十到百分之四十，在复杂交互场景下甚至能快两到三倍。而且它的测试更稳定，不稳定的测试率比 selenium 降低百分之五十，这对维护大型测试套件来说太重要了。 总结一下，三令令的架构诞生在差不多二十年前，那时前端还很静态， h t t p。 请求加外部驱动的模式够用，但现在面对单页应用、动态内容复杂交互， 它的局限性越来越明显。而 play right 用 web socket 常连接加直连浏览器协议，是为现代 web 而生的新架构，不仅更快，而且更稳、更智能，所以它正迅速成为现代 web 自动化测试的首选方案。如果你还在被 selenium 的 曼和 flake 测试折磨，不妨试试 play right。

大家好，想不想让你的 ai 助手直接上手操作浏览器？那这两工具你肯定会碰到，一个是微软的 playwrite， 另一个是谷歌的 chromev tools， 今天咱们就来把它们俩掰开了，揉碎了讲清楚，帮你做出最正确的选择。 你的 ai 编程助手他真的超厉害，能理解，生成重构代码什么都行，但问题是，他就像被关在一个透明的盒子里，只能纸上谈兵。他没法真的去跟网页互动，比如说点个按钮，填个表单，或者去测试一个线上跑着的网站， 它能看，但它摸不着。那怎么把这个盒子打开呢？答案就是 m c p， 也就是模型上下文协议，你可以把它想象成一把万能钥匙， 它给 ai 模型提供了一个标准的安全的接口，让 ai 能够连上并且操作像浏览器这样的外部工具。这一下 ai 就 真的有了手和脚能干活了。 好了，那我们今天就顺着这个思路聊下去，先看看 ai 为什么被困住了，再聊聊 mcp 是 怎么解锁浏览器的。 然后就是咱们的两位主角， player right 和 devtools， 我 们会深入剖析它们各自的特长，最后再告诉你怎么搭配它们，打造你自己的终极 ai 工具箱。 行，咱们找到了解锁浏览器的钥匙，但马上就遇到了一个新问题，咱们手上有两把功能都超强的钥匙，一把微软的，一把谷歌的， 这就不只是个技术选择了，对吧？这其实是个策略问题，这个选择到底有多重要？这么说吧，有句话讲的特别好，高达百分之九十的人都在错误的使用这两个工具，这不是因为工具本身不好，而是因为场景用错了。 咱们今天就是要解决这个核心问题，保证你成为那懂行的百分之十。好，咱们先来看看第一位选手，微软的 play right mcp。 你 就把它想象成一个特别靠谱的实干家，一个天生就是为了自动化而生的巨头。 这张图啊，一下子就说清楚了 play right 最核心的理念，你看左边，这是 ai 平时看到的一堆乱七八糟的 html 代码，看的头都大了。 那 playwrite 的 思路呢？他说咱们得像个普通人一样看网页，所以他给 ai 看的是右边这个，一个超级简化版的无障碍数，把所有代码噪音都过滤掉，只留下关键信息。这儿有个按钮叫提交，你能点 这么一简化，好处可就太大了，它能把 ai 消耗的 token 直接砍掉，最多百分之八十。 这意味着你的 ai 操作不仅便宜了，而且因为信号强，噪音少，反应也更快更准了。除了省钱， playrite 本身的设计就非常厉害，首先它跨浏览器，你写一套代码在 chrome、 firefox、 safari 上都能跑。 还有啊，它有个自动等待机制， ai 只要下命令就行， play right 会自己等那个按钮准备好了再点可靠，秀一下就上去了。最后，它看的是寓意，就算前端把代码改了，只要那个东西还是登录按钮，它就能找到，特别稳。 好了，说完了这个实干家 play right， 我 们再来看看另一位角色，谷歌的 chromevtools mcp。 你可以把它想成一个深度侦探，专门就是为了检查和诊断问题而生的。 devtools 有 个真正的杀手锏，这也是它跟 playwrite 最大的不同，就是它可以直接连上你现在正在用的那个 chrome 浏览器。 你想象这意味着什么？你所有的登录状态、 cookies、 绘画数据，全都能直接用 ai， 根本不需要重新登录。这在调试那些需要复杂登录才能进的网站时，简直是神奇。 而且啊，连起来也特别简单，你就三步，第一，在地址栏里输个 chrome 斜杠 inspect。 第二，点开那个远程调试的官框儿。最后呢，启动 m c p 服务的时候，加个杠 also connect 参数， 搞定你的 ai， 就 能接管你当前的浏览器了。 devtools 的 核心优势就在于一个字儿，深， 它给 ai 看的是整个浏览器的内部运行时状态，就等于把整个 chrome 开发者工具面板全都交给了 ai。 ai 可以 看网络请求的瀑布图、 js 的 调用栈、性能轨迹等等。当然啦，它的应用范围也仅限于 chrome em 内核的浏览器。 好，现在两位专家我们都认识了，那最关键的部分来了，到底什么时候该用？谁怎么才能用对地方？ 这张表总结的特别清楚，你看 play right， 它的核心就是自动化和测试，所有主流浏览器都支持像个普通用户一样看页面儿， 而 devtools 呢，它的核心是调试和检查，只支持 chrome 内核的，像个开发者一样看页面。所以你看，一个适合跑测试抓数据，另一个呢，适合分析性能查网络问题。 咱们来看个具体的场景啊，假如你的任务是写一个自动化测试脚本，并且要求它必须要在 chrome、 firefox 和 safari 上都能稳定运行， 那不用想了，这绝对是 playrite 的 活，它的跨甭谁成能力和为自动化而生的稳定性，就是为这个场景量身定做的。好。换个场景，你正在开发一个网站，已经手动登录了账号， 现在你发现有个网络请求老是失败，需要深入排查它的请求头响应，还有时间线。 那这时候就该 devtools 上场了，你可以让 ai 连上你当前的浏览器，直接用你的登录状态，然后深入到网络面板里，把问题根源给找出来。 所以，聊到这儿，你可能觉得这是个二选一的问题。但实际上啊，真正的高手早就打破这种思维了，他们的目标是打造一个终极 ai 工具箱。 我特别喜欢这个比喻， playrite 就 像你天天都用的螺丝刀，可靠通用，解决大部分日常自动化任务。而 daptos 呢，就像那个精密的万用表，虽然不常拿出来，但真要诊断什么电路问题的时候，没它还真不行。 咱们再总结一下他们的分工， play right 是 用来干活的，执行所有常规的交互操作，比如挠倒、点击、填表单、抓数据。而 deftools 呢，是用来诊断的，当你遇到性能瓶颈、网络请求失败，或者需要看控制台里的详细错误时，就该它上场了。 所以啊，我给你一个特别简单的行动指南，百分之九十五的情况下，你就默认用 play right， 准没错，它稳定、省钱、靠谱。等到真遇上那五百分之疑难杂症了，再请出 devtools 这位专家来做深度诊断 好了。那么现在你已经知道怎么给你的 ai 助手配上最强的眼睛和手了，那真正的问题就来了，当你的 ai 真的 突破了，那个透明的盒子能跟真实世界互动了，你打算和它一起去创造点什么呢？这后面的想象空间可就太大了。

大家好，今天是视频记录一百天的第四十一天。呃，昨天在网上看了一下 playwrite cny， 可以 节省四倍的一个 token， 相比 mct 模式的话，今天就去做了一下尝试和对比。整体结论就是， 呃， c l i 模式的话，基本上可以跟 m c p 在 短任务下基本上是持平。如果说在长任务的情况下，其实 c l i 相比 m c p 其实还会更浪费头感，当然这个也是基于我的测试场景。好，我们来看一下具体的测试场景。第一个场景基本上就是相对比较简单一点的。呃，单部任务的一个实测，因为我们的 那系统其实是需要 office 认证的话，其实就是在 c l i 里边加了胶水层，做了一个 office 的 一个注入，再就是跳转到我们的一个账号管理的页面，再做了一个 snapshot。 同样的一个流程，用 c l i 加胶水和 m c p 做了一个对比，可以看一下，基本上就是 呃， c l i 和 m c p 基本上是持平的。第二个业务场景的话，就是做了一个多部的一个任务交互，这个其实也更符合于我当前的一个 工作场景的一个典型场景吧，基本上就是先登录到一个 list 页面，再做一个点击，打开一个模态框，再退出模态框，再拿一个 snapshot。 整体这个场景做下来的话， c l 加胶水层，它的头肯消耗大概是三十一点四 k， 但是如果说用 m c p 的 话，基本上是可以到二十九点四 k， 相比其实 m c p 还会更省一点。省的原因的话，基本上就是因为我们做了 snapchat， 它 m c p 有 那个 snapchat confidence reference， 这样的话其实可以减少我们一些 reference 的 一些 token 的 消耗。第二个点的话就是它有那个 browser click， 它其实是有一些容错的，这样的话其实也会无形中减少我们的一个 token 消耗。 整体的结论就是感觉那篇文章的四倍消耗有一点点夸张。当然我这个测试场景有可能也会有一些局限，但是我去对比了一下官方的一个说法，官方只是说 有一种新的使用场景，可以去考虑一下。好吧，今天就聊到这里，谢谢大家。再见。

大家好，今天来分享一个我自己在用的脚本，它能帮我把视频封面、标题这些素材自动填写到发布页面，用着挺方便的。 这个脚本主要有这么几个功能，它能从文件夹里提取视频封面、标题这些素材也支持多账号切换，每个账号都有独立的登录状态，填写表单的时候，它会用多种策略来定位元素，尽量确保能填上。 咱们来对比一下手动发布和自动发布。手动发布呢，需要一个个上传视频封面，还要填写标题文案，步骤比较多，有时候也容易漏掉。什么自动发布呢？运行一下脚本，它会帮你把这些步骤走一遍，能省不少时间。 这个脚本的工作流程大概是这样的，第一步，它会检测登录状态，如果没登录会提示你登录。第二步，导航到发布页面。第三步，上传视频文件。第四步，上传封面，它支持十六比九和九比十六两种比例。第五步，填写标题和文案。最后一步，点击发布按钮， 接下来看下它是怎么执行的，整个过程都是自动跑的，从登录、检测到最终发布，一气呵成。 这个脚本支持一些特性，它支持多种数据源，你可以指定文件夹、 j、 s、 o n 文件，或者手动指定每个文件。多账号隔离，每个账号都有独立的登录状态，它还有多策略 fallback， 前端改版的时候也能尽量适配，支持两种比例的封面上传。 有句话说得好，自动化不是要取代人，而是让人从重复劳动中解放出来，去做更有价值的事情。这个脚本也是基于这个想法做的，希望能帮大家省点发布流程上的时间。 好啦，今天就分享到这吧，你们也可以试试让 agent 写一个这样的脚本，可以封装成 skills。 下次再聊别的。

嘿，大家好啊，今天来分享一个我自己在用的小脚本，它能帮忙把视频封面、标题这些素材自动填写到抖音发布平台，用着还挺方便的。 这个脚本主要有这么几个功能，它能从文件夹里提取视频封面、标题这些素材也支持多账号切换，每个账号都有独立的登录状态。填写表单的时候，它会用多种策略来定位元素，尽量确保能填上。另外，它也能和一些 ai agent 配合使用。 咱们来对比一下手动发布和自动发布。手动发布呢，需要一个个上传视频封面，还要填写标题文案，步骤比较多，有时候也容易漏掉。什么自动发布呢？运行一下脚本，它会帮你把这些步骤走一遍，能省不少时间。 这个脚本的工作流程大概是这样的，第一步，它会检测登录状态，如果没登录会提示你扫码。第二步，导航到发布页面。第三步，上传视频文件。第四步，上传封面，它支持十六比九和九点十六分两种比例。第五步，填写标题和文案。最后一步，点击发布按钮，整个过程都是自动的。 来看看关键代码，它使用了 playrite 的 持久化上下文，这样可以保存，用的是 chromium 浏览器引擎，兼容性还可以。 这个脚本支持一些特性，它支持多种数据源，你可以指定文件夹、 j s o n 文件，或者手动指定每个文件。多账号隔离，每个账号都有独立的登录状态，它还有多策略 forback， 前端改版的时候也能尽量适配，支持两种比例的封面上传。另外，它也可以和一些 ai agent 配合，比如 open claw， hermes， cloud code 这些。 有句话说得好，自动化不是要取代人，而是让人从重复劳动中解放出来，去做更有价值的事情。这个脚本也是基于这个想法做的，希望能帮大家省点发布流程上的时间。 好啦，今天就分享到这儿吧，这个脚本我自用觉得还挺方便的。你们有没有类似的自动化需求呢？下次再聊别的。

哈喽，今天给大家分享一个微软出品的这个浏览器自动化的一个程序啊，这个程序的话感觉还是挺厉害的，它相当于是实时的启动一个浏览器，然后包括了谷歌的 chrome， 还有火狐，还有个 webkit 啊， 然后这些浏览器的话，你都是可以直接在后台运行，然后让他帮你打开操作的。为什么要说他厉害呢？因为他跟之前的那种爬虫框架不一样啊，他是真实的去模拟 你在浏览器内的一个操作，然后去读取浏览器这个页面上面的所有数据，然后去决定下一步的这个动作啊，就是结合 ai 的 话，你随便打开一个网站，就比如说一些电商平台的，你直接打开了，打开以后你直接让你的 a 键，比如说你是 你说帮我安装这个 play word， 然后你现在进入这个电商网站，帮我查询某些衣服或者饰品或者什么东西的一个销量，包括它的一个价格，帮我把前十的列表都给我列出去，列出来也就输入这么一个简单的指令，然后你过一会你再回来看你的文件夹里面， 他就把这些内容都给你列出来了，有些需要验证的情况，可能需要需要你手动的去帮他过一下验证，其他的他基本上都能帮你完成，特别厉害了啊， 然后这个能帮你做什么事？那真的是太多了，就比如说你想写一个程序的时候，对吧？你现在有些后端数据读不到， 你把它跑一下子，你然后让 ai 帮你找这个网页当中，比如说这个价格搜索这个标签到底是在哪？然后如果我用后端去调用的话，应该使用什么数据，它全部都能帮你跑出来。 然后你如果是想要采集某些网站的一些热点啊，对吧？你还是同样的，你第一次跑的时候，你用 ai 加上这个 play white 帮你把整个流程跑通，整个流程跑通以后，然后你把它写成一个固定化的程序，后期就不需要用 ai， 用你的 token 你 就可以完整的把这个东西给跑通。 我也十指也是接触了比较多的一个项目者，对吧？他搞这些东西的时候，他不去选大众化的市场，不去搞什么 ai 漫剧啊，不去搞什么 ai 小 说啊，去做什么中转站呢？他就 利用这一些工具加上 ai 的 一个优势，帮别人定制化一些行业的热点新闻，或者是其他的一些商业上需要的一些数量比较多的时候，不方便人去找的时候，帮别人定制化这种工具也做到了一些成绩啊。 然后十字这一边的话，目前也是接触到了一些筹融资的渠道，就是如果你有更好的 ai 项目的话，你可以联系十字，十字这边可以给你提供渠道去对接，好吧？然后感谢您的观看，我们下期再见，拜拜。

今天和大家来聊一下自动化测试，这是我自己认为非常重要的一期，之前我们聊了很多 skills， hooks 以及工作流的优化，那这些东西呢，都只是框架，它能够帮助你更高效地完成你的项目， 但是你项目最终的质量如何，其实最最最重要的还是你的测试写得好不好。对于网页端呢，我更推荐大家去用 callcode 加 playwrite 的 方式。那么首先先简单的聊一下什么是 playwrite， playwrite 呢，其实是一个端到端的测试框架，也是一种工具，那么它的优势呢，就是它其实是真的帮你打开了一个浏览器，然后通过一些访用户的点击去帮你做了一个完整的测试。 为什么说这个东西很重要呢？因为我们现在是 vcoding 嘛，所以其实我们并没有 对于代码的质量有那么高的掌控权，因为本身代代码也不是我们写的，我们最终希望的呢，是用户到我们这个产品来是可以点击，然后可以正常的运行的。 所以这一套真浏览器的点击模拟测试呢，就能保证说当用户到我们的网页上的时候，他确实是可以跑这些东西确实可以玩我们的游戏的。 呃，第二个呢是 play right， 这个东西你也不用自己去写很多的呃，等待啊之类的东西，它会有一套自己的流程，会等你的界面漏得出来之后才去进行接下来的操作。第三呢就是这个东西是可以回放的， 当你这个测试挂掉的时候呢，其实 playwrite 是 可以帮我们做一个截图的，那当你想要回头去看到底出了什么问题的时候呢，你就可以用这些截图去看当时发生了什么东西，所以非常好溯源。 那当然 playwrite 这个东西它不仅仅是测试啊，我们这一期讲的主要是测试，但实际上它可以帮你做很多别的东西，比如说它可以去帮你抓一些数据，去帮你做一些批量的截图等等。 这些东西呢我们今天就不会展开，主要来看一下一个真实的案例，就是我们怎么用 playwrite 去写这个测试。那今天要讲的案例呢？就是啊，关于一个好吃没声音的故事。那之前几期我其实聊到了，我做了一个 丹卡小镇，里面有一个猫语词典，然后每一个词条呢都是可以播放声音的，但是我在测试的过程中呢，我就发现有一个词条这好吃，这个词条点击了之后是没有声音的，所以我就让 coco 的 去帮我加了这么一个测试，保证说类似的事情不会再发生。 我们先切到这个代码这里看一下，这个呢就是一个完整的 playwrite 的 测试啊，大家不用觉得说这个东西很复杂或者怎么样，因为 call code 全都可以帮你写。今天我们只是过一个例子，简单的让大家了解一下 playwrite 这个东西到底在做什么。那我们就按照它的步骤来。 第一步呢，你可以看到他先进了我的网站，然后呢他就是往下滚，滚到了我这个猫猫转盘的这个界面，然后点击了猫语词典，就进了我对应的游戏。 那么我回到我这个主页，我先登录了，之后呢？呃，我也可以做一模一样的事情，我就是先往下滚，然后可以看到这个地方就是刚刚我们测试中提到的这个小猫的页面，然后他就点了这个猫语词典，然后进入游戏。啊，其实就和这个测试里面是一模一样的。 那么在这个进入游戏之后呢，我们就可以看到他去找到了一个对应的按键，然后找到了这个吃饭时间，然后他找到了好吃这个按键，然后他就去点了一下， 那么一样的，我们就可以到这个吃饭时间这个好吃的页面，然后他就点击播放了一下， 那这个其实就是我这个 playwrite 做的完整的事情了。那你看可以看到这个地方它其实是做了一个呃按键的点击操作，然后之后呢其实它就做了一些分析，然后去保证说我们这个 呃声音是有的，就不是一个空的音频。那我们日常呢也可以去跑这个测试，我可以简单给大家试一下。好，那么在这里呢，我们其实也可以让 carco 的 直接去帮我们跑这个测试。 呃，这个是我输入的一个 prompt 啊，其实就比较简单，当然大家也可以直接用 command line 去跑，是一样的。 好，那么这里 call code 先帮我做了一些设置，然后现在他开始工作了。呃，这个刚刚完全不是我在做，就是我的电脑自己在做这个事情，就是 playwrite 测试。呃，如果大家看的 比较清楚的话，因为因为它比较快，我我不是很确定大家有没有看到，但它做的操作就和我刚刚演示的是一模一样的。那么通过这样一个 playwrite 测试呢，就可以保证说我们整一个 user flow 是 通的，就是用户是可以使用我们这个工具的。 我自己平常做这个的流程呢，是我会先让 call 去根据我的业务需求帮我写一些基础的 playwrite 测试。 然后呢，我会自己手动地去进行一些额外的测试。当我发现有些问题的时候呢，我就会告诉 plato 的 我做了哪些操作，让他帮我把我的操作再写成额外的 plato， 呃，再写成额外的 playwrite 测试，通过这种方式呢，来帮我反复地迭代，然后进行一些 产品的修复，呃，然后做一些质量的保证。那这一期呢，我们就聊到这里，下一期我们会讲一下怎么用 metro 去做一个我们移动端的类似 playwrite 的 自动化测试。

今天想分享 playwrite， 最近看 ai 的 一些工具，很多的 ui 自动化脚本， ai 生成的时候都是选择的 playwrite， 如果你没有给它指定语言的话，它自动默认的去选的都是 playwrite。 那 大胆的预测一下， playwrite 它的市场占比会越来越高。我们今天先看一下 playwrite 大 概是一个什么样子的东西， 它跟协议有什么区别。 playrite 的 官网是这个，然后它是一个外部自动化的测试框架，它可以支持多个语言，并且它可以跨平台， windows、 nooks 都可以，而且它是支持多个浏览器的，就是它的官网的一个页面。 然后 playrite 的 原理是什么呢？它是编程语言去调用 playrite 库，然后调用的是它的这个工具，然后通过 chrome 的 一个 dvtoos 协议去调用的浏览器。 它跟 cyanum 的 比较的话，就是说在语言支持方面， playrite 只支持这几种语言， cyanum 呢，支持几乎所有的语言。在浏览器的支持方面， playrite 它是支持这几种浏览器的，而 cyanum 支持几乎所有。 执行速度上， playrite 要快一些， cyanum 就 稍微慢点。自动等待方面， playrite 它是有一个内置的智能等待，而 cyanum 呢，它是需要显示等待的。 这个录制工具方面， playrite 它有一个非常强大的叫抠劲的这个工具，而咸柠檬的 ide 稍微就弱一些，在生态上，现在咸柠檬还是非常成熟，非常丰富的，但是 playrite 它增长的速度会比较快。 那我们再简单的看一下 playwrite 它的四个核心的工具，刚才提到的 call 键，它是一个代码生成器，或者可以你理解为一个录制器，通过录制你的操作来自动的生成测试脚本，然后把它保存为这几种语言， 支持录制时自动的生成智能选择器，它也可以去保存为这种配置 object 的 模式， 然后录制的时候也可以去设置慢动作去查看操作。另外 playwrite inspector 写了这么多的点，比如说检查页面、生成选择器，逐步执行测试，嗯，简单来说的话，其实它就是在你 执行自动化测试脚本的过程中，方便你去看当前页面是哪一个页面，然后点击的哪个按钮，输入的哪些文字，然后点击之后跳转到哪个页面，就是方便做这件事情。 swaver 这个工具跟刚才的区别在于它把我们的记录全部都录制下来了，录制下来了之后，你在后期的时候就可以去看一个回放，这个 ui mode 呢，其实就是刚才这些工具的一个组合， 它弄成了一个 i d e， 一个格式化的一个页面，在这个页面你就可以看到你的代码以及执行的过程，以及看回放这些。

处理弹窗和多页面可以说是 playwright 在 web 自动化测试中的两把利刃，它最大的特点就是用事件驱动的模型彻底告别了传统工具中那种繁琐的锯饼切换模式。今天我们就来具体看看在 playwright 里这两件事到底怎么做。先聊弹窗， 网页里最常见的原声弹窗有三种， alert 只有一段信息和确定按钮， ctrl 需要用户点确定或取消 prompt 除了确定取消，还有一个输入框让用户填内容。默认情况下， playwrite 会自动帮你点确定把所有弹窗关掉。但很多时候我们需要精确控制，比如点取消或者在 pop 里输入一段话，这时候就要自己动手了。 playwrite 处理弹窗的核心思路是在触发弹窗的动作之前先注册一个监听器。主要有两种写法， 第一种也是最推荐的，叫一次性处理，用配置 wait for 一 番 dialogue， 请看代码示意。 这段代码的逻辑是先创建一个等待弹窗出现的承诺，然后点击按钮触发弹窗，最后拿到弹窗对象，根据类型调用 accept 获得 smith。 如果是 prompt， 还可以在 accept 里直接传入要输入的文本，这种方式持续清晰，不容易出错。第二种叫持续监听，用 page on dialog handle， 请看代码示意。 当你页面上会反复出现同类弹窗，或者想统一处理所有弹窗时，可以用这种方式。 注意这里有个小坑，监听器函数里必须调用 accept 或者 smith， 否则 play ray 会一直等着测试就卡住了。如果只想处理一次，可以用 page want 执行完自动移除监听器。 这里强调两个要点，第一，监听器一定要写在触发弹窗之前，否则会错过事件导致超时。 第二， default 这类离开页面的确认弹窗，普通的 dialog 事件也能抓到，但要通过 page on 来处理。至于打印对话框 window print terra 没法直接点按钮，但可以通过监听 java script 事件来判断它是否被调用了。 好，弹窗讲完，我们再看看多页面。在 play ray 里，每一个标签页或弹出窗口都是一个独立的配锯像，它们都属于一个叫浏览器上下文 browser context 的 容器。这意味着你不再需要像传统工具那样先获取锯柄，再切换锯柄。 你手里拿到的就是直接的呸对象，想操作哪个页面就哪个对象，非常直观。最常见的场景是点击一个带有 target 等于 blank 链接，或者用 window open 打开新标签页。这时候需要在点击之前就开始等待新页面出现。请看代码市里 这里我们用 context expect event page 等待新页面，然后 page click 触发打开操作新页面返回后，你可以继续在新页面上用 playwrite 的 任何方法，比如点击按钮获取标题，原来的页面也依然可用。 如果你想找到当前上下纹理已经打开的所有标签页，可以用 context pages， 请看代码示意， 它会返回一个 page 对 象的列表。你可以便利它根据标题或者 url 找到目标页面之后直接调用目标页面的方法，比如 bring to fun， 把它提到前台，或者直接操作里面的元素，不需要任何切换动作。有些网站会突然蹦出广告或者通知窗口 这种意外的新页面也可以在上下文级别统一处理。请看代码示意。在 context 上设置一个 page 事件监听器，当发现新页面时，判断它的 u 二绕，如果包含广告字样就直接关掉，这样不会干扰主测试流程。 顺便提一句，有些弹窗其实是在 i f m 触发的，不用担心， play right 的 page on dialogue 依然有效，因为原声弹窗属于整个页面，不会藏在 i f m。 最后，我们来总结一下不同场景该怎么选处理单一的以及的弹窗。用 page wait for event dialog 持续最可靠 处理页面内所有弹窗，比如有很多确认框，用 page on dialog header 统一处理。逻辑处理，点击链接打开的新标签页，用 contacts wait for event page 精确捕获。 在多个已打开的标签页之间切换。用 context page 加 print from， 按标题或 u 二绕定位，优雅地处理随机广告弹窗用 context on page handle 在 上下文级别统一管理。掌握了弹窗和多页面的处理，你的 play right 自动化能力就又上了一个台阶。

大家好，今天是视频记录一百天的第四十二天，今天聊一下 playrite 的 mcp 和 harness 的 一个实现吧。 呃，背景就是我们要对我们系统的一个模块做 accessibility 的 一个测试， 因为这个模块之前已经实现了 n to n 的 测试，有完善的一些 p o m 和对应的 fixer 脚本。今天想着先试一下 m c p， 看能不能做到这一点，但是发现 m c p 其实实现的成本会更高一些。就是第一个就是上下文这个 实现，因为其实我们这个模块还有 google 又开不起了一个验证机制，所以之前就做了 i c 的 那个私钥，想办法去通过这个验证， 如果说直接用这种机制的话，相当于就安全性都受到了一个挑战。第二点的话就是 我们的页面里边它会有一些页面的一些 p o m 要如果说 m c p 的 话，需要还重新去识别，或者说重新去归导一下，但是我们对于我们当前的项目，这个是已经是现成的了，所以结论下来就是 m c p 其实当前不适合我们来做这个 accessibility 测试， 反而哈密斯其实就可以考虑了。大家可以看一下这张图，基本上就是做了一个 呃对比吧，就是 mcp 和哈密斯的一个场景差异和不同维度的一个一个项目的一个情况。 整体结论基本上就是 m c p 更适合做一些单点的验证，手工验证，但是哈尼斯的话其实更适合做一些批量回归，再加上一些 ci 的 一些固化。 最终其实在整个完成这一个 accessibility 的 测试的过程中，也不是单纯的只用了 c r r， 其实也先其实前期用了 m c p 去把我们的 呃 tocan 去拿到，因为其实我们那个登物也是需要 tocan 来验证的。完了再就是通过哈里斯来快速在十分钟之内就完成了我们九十四个 sales 的 一个测试，最终再聚合生成对应的一个报告。 因为我们这个其实 accessibility 还要考虑覆盖 safari 浏览器的 webkit， 所以 的话这一部分也是通过 mcp 来完成的。 主要的一个结论其实就是没有最好的工具吧，只有一个适合当前业务场景的工具，往往我们解决问题的时候都是一个 混编的一个解决方案吧。好吧，今天就聊到这里，谢谢大家！再见。

实测 deep cv 四新模型搭配 playbreaker 自动化测试 c l 超好用！一开始调用指令小翻车，修正指令后全程丝滑，自动打开小某式批量爬取 ai 赛道笔记，一键整理标题 数据，内容分析，还附带爆点拆解和创作思路，自动化采集太高效！记得点赞关注哦！

如果你还在手动写测试脚本，那真的太浪费时间了。用 playrite 的 录制功能，也就是 codegen， 你 只需要像平时一样点击页面，它就能自动帮你生成代码，支持 python、 javascript、 java、 c、 shop 等多种语言。而且它会智能推荐最稳定的元素定位方式， 比如 get by run get by text。 脚本不容易因为界面改动而失效。怎么开启录制？最简单的是用 vs code 的 playwrite 扩展，点击 root new 按钮，浏览器和记录面板就会自动打开，你一边操作代码一边生成。或者你也可以用代码 输入 npx playwrite codegen， 加上网址，同样会弹出浏览器和记录窗口。录制过程中，你还可以随时切换语言， 选择浏览器、添加断言，甚至模拟手机设备。比如 iphone 十三，录制完成后，一键复制代码就能直接用了。 更厉害的是，你可以先手动登录一次，把登录状态保存下来，以后录制就不需要重复登录了。总之， trent 的 录制功能不仅能帮你快速生成测试脚本，还是学习如何写渐状自动化代码的好帮手。

你有没有想过， playwrite 的 测试脚本跑在 nova j s 里，而网页的代码跑在浏览器里，这俩就像隔着一条河，谁也够不着谁。那怎么跨河操作呢？答案就是执行 javascript。 今天咱们就聊聊 playwrite 里这个最核心的能力。第一部分，为什么要执行 javascript？ 简单说，环境隔离，你的测试代码在 no 加七 s 环境里跑页面的 javascript 在 浏览器的沙盒里跑，这辆环境完全独立，变量互不相通。想操作页面内部的东西，必须得有个桥梁，这就是配置 evaluate 和相关方法的作用。第二部分，三种常用方式 play right 给咱们准备了三把钥匙，分别开不同的锁。第一把啡记 evaluate， 在 页面里执行代码，拿到结果，比如获取标题，改样式，触发事件，预强操作全靠它。第二把 page add the next group， 这个更狠，在页面加载之前就注入脚本，相当于趁网站还没反应过来，先把它的环境改了。比如 mock max random， 让它永远返回固定值， 测试就完全可控了。第三把 js handle， 复杂对象返回的不是值，是个锯饼，就像遥控器，能在测试代码里继续操作它。第三部分，基础用法，最常用的是配解 value， 直接在页面向下纹理跑代码，比如获取页面标题，当前 u r e o， 甚至执行异步操作，拿 h t t p 状态码都能异形搞定。 请看代码视力。第四部分，传餐的坑有个常见坑，你不能在 evolveit 里直接用测试脚本的变量，因为环境隔离嘛，正确做法是把变量当参数传进去。请看代码视力。第五部分，高级玩法 idna script 是 个神器， 比如你想测试一个依赖随机数的功能，每次结果都不一样咋办？简单，在页面加载前把 math random 替换成固定返回值的函数，瞬间可控。请看代码示意。总结一下，记住两件事， page evaluate 是 页面加载后执行临时操作的首选。 page idna script 是 页面加载前修改原生环境的利器。掌握这俩 play red 的 javascript 执行能力你就拿捏了。