项目组调研自动化（选择工具）---》开会演示demo（例子）---》在项目中开展自动化 ---》把该项目的自动化流程、框架固化成文档 ---》推广到公司的其它项目组应用
② 页面加载时间过慢，需要查找的元素程序已经完成，单页面还未加载，此时可以加载页面等待时间
前边讲解完八大元素定位大法，今天宏哥讲解和分享一下三大延时等待。宏哥这里简称“三等八定”。很多人在群里问，这个下拉框定位不到、那个弹出框定位不到…各种定位不到，其实大多数情况下就是两种问题：1. 有frame，2. 没有加等待。殊不知，你的代码运行速度是什么量级的，而浏览器加载渲染速度又是什么量级的，就好比闪电侠和凹凸曼约好去打怪兽，然后闪电侠打完回来之后问凹凸曼你为啥还在穿鞋没出门？凹凸曼分分中内心一万只羊驼飞过，欺负哥速度慢，哥不跟你玩了，抛个异常撂挑子了。 那么怎么才能照顾到凹凸曼缓慢的加载速度呢？只有一个办法，那就是等喽。说到等，又有三种等法，且听宏哥一一道来。
在介绍selenium的时候，宏哥也介绍过等待，是因为在某些元素出现后，才可以进行操作。有时候我们自己忘记添加等待时间后，查了半天代码确定就是没有问题，奇怪的就是获取不到元素。然后搞了好久，或者经过别人的提示才恍然大悟没有添加等待时间。而playwright为了避免我们犯这么low的错误，它对元素执行操作前，会进行一系列可操作性检查，以确保这些行动按预期运行。它会自动等待所有相关检查通过，然后才执行请求的操作。如果所需的检查未在给定的范围内通过则抛出timeout，操作将失败并显示TimeoutError。正是由于playwright添加了默认等待时间才会增加脚本稳定性。
Selenium测试自动化的主要目的是加快测试过程。在大多数情况下，使用 Selenium 的自动化测试比手动测试执行得特别好。在实际自动化测试实践中，我们有很多方式可以加速Selenium用例的执行。
应用程序的响应时间是不确定的，可能存在网络延迟、加载时间、动画效果等因素。如果在执行自动化脚本时没有适当的等待机制，脚本可能会在应用程序还未完成相应操作或加载完成之前继续执行下一步，导致测试失败或产生不稳定的结果。
当浏览器通过网络接收页面的HTML数据时，它会立即设置解析器将HTML转换为文档对象模型(DOM)。
Playwright是一个由Microsoft开发的自动化测试工具，可以用来测试Web应用程序。它支持多种编程语言和多个浏览器，包括Chrome，Firefox和WebKit。它通过提供一组API，使得开发人员可以在浏览器中模拟用户行为，例如单击，输入文本和导航到不同的页面，同时还能捕捉截图和视频。
如图所示，题目并非随便在百度上抄几道，而是实实在在的整理过且问过的面试题哦～，但是题目都不难属于入门级，轻吐槽啊
当你觉得你的定位没有问题，但是却直接报了元素不可见，那你就可以考虑是不是因为程序运行太快或者页面加载太慢造成了元素不可见，那就必须要加等待了，等待元素可见再继续运行程序；
本系列文章总结归纳了一些软件测试工程师常见的面试题，主要来源于个人面试遇到的、网络搜集（完善）、工作日常讨论等，分为以下十个部分，供大家参考。如有错误的地方，欢迎指正。有更多的面试题或面试中遇到的坑，也欢迎补充分享。希望大家都能找到满意的工作，共勉之！~
Hello,大家好。春节过后，有的人盼望升职加薪，有的人立了新的Flag，有跳槽计划的该提上日程了。为解大伙的燃眉之急，今天分享自动化面试题预热一波，欢迎留言区补充评论✍️。
今天在分析网站优化的东西，看到控制台的一些 Warnings 警告，整理记录一下：
对于script元素，新增async属性与defer属性，他们的作用都是加快页面的加载速度，使脚本代码的读取不再妨碍页面上其他元素的加载。
浅谈script标签中的async和defer script标签用于加载脚本与执行脚本，在前端开发中可以说是非常重要的标签了。 直接使用script脚本的话，html会按照顺序来加载并执行脚本，在脚本加载&执行的过程中，会阻塞后续的DOM渲染。 现在大家习惯于在页面中引用各种的第三方脚本，如果第三方服务商出现了一些小问题，比如延迟之类的，就会使得页面白屏。 好在script提供了两种方式来解决上述问题，async和defer，这两个属性使得script都不会阻塞DOM的渲
3、浏览器页面中hidden或者是display＝none的元素，selenium是没法定位到的
引言：自动化永远是避不开的，反正你入职的岗位要不要用自动化，你必须得会一点，加分项。这一块包括，自动化一些理念和自动化的工具使用。
现在大家习惯于在页面中引用各种的第三方脚本，如果第三方服务商出现了一些小问题，比如延迟之类的，就会使得页面白屏。 好在script提供了两种方式来解决上述问题，async和defer，这两个属性使得script都不会阻塞DOM的渲染。 但既然会存在两个属性，那么就说明，这两个属性之间肯定是有差异的。
在博客魔改过程中，不可避免的会引入大量的第三方脚本（js），而基于页面读取js的加载顺序，每当浏览器在加载html的过程中遇到<script>js代码片段</script>这样的标签时，浏览器会暂停继续构建html，而是优先执行当前的js脚本，等执行完毕后再继续加载后面的html。
需要引入jQuery文件 入口函数的标准 在<head> </head>标签中，jQuery入口函数必须要写，在<body> </body>可以不写，写上入口函数后不论放在哪个标签下都能去执行。一般建议在body标签中写入口函数，就是为了等页面加载完成后才执行入口函数。 案例： js的入口函数执行要比jQuery的入口函数执行得晚一些。 jquery的入口函数会等待页面的加载完成才执行，但是不会等待图片的加载。 js的入口函数会等待页面加载完成，并且等待图片加载完成才开始执行 <!DOCTYPE
Selenium等待页面加载在Selenium自动化测试中起着重要的作用。它们有助于使测试用例更加稳定，增强健壮性。Selenium提供多种等待，根据某些条件在脚本执行相应的等待，从而确保Selenium执行自动化测试时不会导致脚本失败。
总所周知，写文章需要一个标题。虽然我们搞代码的人一般都喜欢单刀直入，但是受制于文体的约束和发表载体的要求，有时不得不想一个标题。而起一个标题，不亚于起一个函数名或者变量名。单就这篇文章，我就有好几个草稿标题，例如：《页面加载指标演进之路》，《Element Timing：一种全新的页面速度指标》，《如何最准确地测量网页加载速度》，《新前端下的页面加载速度》，甚至《Element Timing In Action》，《三分钟学会测量页面速度》。最后综合考虑了读者的承受能力，编辑的意见，以及最最重要的：本人的孱弱写作实力，就取了个这样的一个非常大众化，既不会一眼就被当成垃圾，也不会被人挑出来仔细找茬的标题。
引言：自动化永远是避不开的，反正你入职的岗位要不要用自动化，你必须得会一点，加分项。这一块包括，自动化一些理念和自动化的工具使用。有同学说问题太多难消化，那就每天只推送十题之内。
最近写的挺多自动化办公的selenium程序没有做优化，执行效率不高，启动浏览器又慢但是又可能出现其他不可控的因素，总结来说虽然放心运行但是又没那么好用，项目是写完了最后还是需要优化结尾的。selenium程序优化空间还是非常大的，根据自己项目的需求来进一步精简，去区分哪些元素是我们要触发的，哪些不需要加载的，将这些优化目标写进去可以大大提高selenium程序的效率。
数周前，在伦敦 Heathrow 机场等飞机的空闲中，我顺便处理了一些工作上的事情。不经意间发现 Github 在性能方面的一些问题，颇为诧异。通过新 tab 打开的页面，其加载速度竟然比直接点击链接打开的页面要快。不信请看视频（译者注：可能需要科学上网）：GitHub link click vs new tab。
Splash 是一个 JavaScript 渲染服务，是一个带有 HTTP API 的轻量级浏览器，同时它对接了 Python 中的 Twisted 和 QT 库。利用它，我们同样可以实现动态渲染页面的抓取。
这一步之后，打包后会发现很大的chunk-vendors.xxxxxxx.js不见了，其实是分成了不同的js文件
Splash是一个JavaScript渲染服务，是一个带有HTTP API的轻量级浏览器，同时它对接了Python中的Twisted和QT库。利用它，我们同样可以实现动态渲染页面的抓取。
Selenium是一个Web UI自动化工具。它不提供任何API来建立数据库连接。这取决于你使用Selenium进行自动化的编程语言。
JavaScript 是单线程运行的，所以在在执行效率上并不是很高，随着用户体验的日益重视，前端性能对用户体验的影响备受关注，但由于性能问题相对复杂，接下来我们来了解下JavaScript如何提高性能；
driver.set_page_load_timeout(3) 页面加载时间设置 3 秒，执行到某一步涉及页面加载如果加载时间超过 3 秒就会停止加载并抛出异常，其实这个时候页面内的元素已经加载出来了，我们在这一步进行异常捕获不让程序停止，然后直接执行下一步即可。
在自动化测试脚本的运行过程中，webdriver操作浏览器的时候，对于元素的定位是有一定的超时时间，大致应该在1-3秒的样子，如果这个时间内仍然定位不到元素，就会抛出异常，中止脚本执行。我们可以通过在脚本中设置等待的方式来避免由于网络延迟或浏览器卡顿导致的偶然失败，常用的等待方式有三种： 一、强制等待 time.sleep(5)
这20个酒店展示的格式都是一样的。每个div都是独立的。每个div都是个酒店的信息。
手工测试是怎么点的，自动化测试就怎么点击。（截图讲解的技术知识是正确的。因为艺龙网站的页面元素有变动，所以你实操起来，看到的元素和截图上的会有区别。）
用途：表明脚本在执行时不会影响页面的构造。也就是说，脚本会被延迟到整个页面都解析完毕之后再执行。
初学者，特别是自学的孩子，在学习的过程中常会遇到各种各样的瓶颈，例如：如何写好javascript、要注意什么等等。这篇文章中，总结了过去javascript一些高效的写法，供大家参考。
WordPress 引入css/js 是我们制作主题时首先面对的一个难点，任何一款主题都要加载自己的 css,js,甚至很有可能还需要加载 Jquery 文件,网上方法特多，说法不一，我们今天借鉴 wordpress 官方最新的 twentysixteen 主题来学习总结一下 WordPress 引入 css/js 各种常用方法，以及最优化的加载方法。
“什么？我的页面刚上线就白屏了，是报错了，还是兼容性问题，还是性能问题，多刷新几次就好了，用户网络不行吧。”
标题：JS延迟加载，也就是等页面加载完成之后再加载 JavaScript 文件。 JS延迟加载有助于提高页面加载速度。
很多人在群里问，这个下拉框定位不到、那个弹出框定位不到…各种定位不到，其实大多数情况下就是两种问题：1 有frame，2 没有加等待。殊不知，你的代码运行速度是什么量级的，而浏览器加载渲染速度又是什么量级的，就好比闪电侠和凹凸曼约好去打怪兽，然后闪电侠打完回来之后问凹凸曼你为啥还在穿鞋没出门？凹凸曼分分中内心一万只羊驼飞过，欺负哥速度慢，哥不跟你玩了，抛个异常撂挑子了。
引言：自动化永远是避不开的，反正你入职的岗位要不要用自动化，你必须得会一点，加分项。这一块包括自动化一些理念和自动化的工具使用。有同学说问题太多难消化，那就每天只推送十题之内。
在使用谷歌 PageSpeed Insights 网站测试工具时，诊断结果经常会有一项目：
一、F12是不是抓包工具？感觉和抓包工具差不多？ 答:f12跟抓包工具charles两者进行对比来讲，都是属于抓包工具，具有抓包工具，只是面对的的对象不一样，开发者工具面对的是web浏览器，而charles面对的是web，app均可，由于涉及的对象不一样，所具体的功能特性也不一样，但从功能的丰富性charles的功能会比较大强大；两者的工具的使用主要根据测试对象来选择’ 二、F12是接口工具？ 答：非接口工具，是调试工具，不具有接口测试功能，可以跟postman配合使用 三、如何用它来简单排查前端问题？ 答：通过抓包数据和性能加载两个角度来判断是否是前端问题，如抓包数据以后，发现返回的数据是对的，但前端展示不对，就属于前端问题；在开发者工具里面通过性能模块进行测试，发现的问题，基本都是前端问题； 详细如下： JavaScript 错误排查：控制台可以显示页面上的 JavaScript 错误，测试人员可以点击错误信息查看错误详情，从而快速定位问题所在，并进行修复。 网络请求排查：控制台可以显示页面上的网络请求，测试人员可以查看请求状态、请求时间、请求头和响应信息等，从而判断是否存在网络请求问题。 DOM 操作排查：控制台可以让测试人员直接操作页面上的 DOM 元素，例如修改元素属性、添加或删除元素等，从而检查页面是否存在 DOM 操作问题。 性能优化排查：控制台可以显示页面的性能指标，例如加载时间、资源大小、资源加载顺序等，测试人员可以从中发现性能瓶颈，并进行优化。 四、能不能概括几种常见的测试使用F12的情况？ 答：seo测试，前端文字多少显示问题，元素布局，样式，交互，需要在元素模块进行测试 页面加载，返回格式错误，返回图片大小问题，不同网络页面加载测试，跨域，缓存测试，需要在网络模块进行测试 内存模块的内存泄露； 检查不同网站的兼容性测试 具体查看以下常识介绍 五、测试的过程中如何从F12中去寻找问题出现在哪里？ 答：通过打开console的日志，可定位问题；源码模块的源码提示也可以定位问题 六、能否介绍网络面板的使用？ 一、模拟不同网络环境，从而进行网络性能测试。步骤： 打开谷歌开发者工具，切换到 "网络" 面板。 点击 "禁/停用缓存" 以确保每次请求都是新的请求。 在工具栏上找到 "网络条件"，点击 "未选择网络条件/已停用节流模式" 选择要模拟的网络类型，例如 "Slow 3G" 或 "Offline"。 刷新页面或者重新加载资源，测试页面在不同网络情况下的性能表现。 二、分析网络请求 最简单的就是抓包了，这个具体培训的操作中已讲
上图是，在Chrome DevTools的性能分析器中，通过click事件处理程序触发的任务的描述
有很多工具能帮助你监控SPA的性能。首先，可以利用Chrome自带的开发者工具(Devtool)或者特定的插件。
一个页面允许加载的外部资源有很多，常见的有脚本、样式、字体、图片和视频等，对于这些外部资源究竟是如何影响整个页面的加载和渲染的呢？今天我们来一探究竟。
加载的顺序不一样，html是从上往下加载的。如果在网速慢的情况下把js代码放在body底部用户会先看到网页结构，等js加载完成后才出现特效。
Open signal 官方提供了2019年2月份统计的全世界4G网络覆盖率和通信速率的统计分布图如下，在目前移动互联网的浪潮下，我们要利用好用户终端设备的每个字节的流量。
使用 vue 3 的 defineAsyncComponent 特性可以让我们延迟加载组件。这意味着它们仅在需要时从服务器加载。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
