企业官网建设流程全解析

哪个网站做初中作业,网页设计代码模板素材,企业型网站建设制作平台,滨州网络推广各位朋友大家好#xff0c;大家应该都是被这么奇葩的标题吸引点击进来的吧#xff0c;既然来了#xff0c;那就跟我一起读下去吧#xff0c;保证你这几分钟没有浪费#xff08;即使浪费了也能给你不一样的想法#xff09;#xff0c;废话不多说#xff0c;大家坐稳大家应该都是被这么奇葩的标题吸引点击进来的吧既然来了那就跟我一起读下去吧保证你这几分钟没有浪费即使浪费了也能给你不一样的想法废话不多说大家坐稳系好安全带开始发车喽01 灵感来源首先我先简单的做下自我介绍我其实是一名比较菜的前端开发或者不安于现状网页开发平时比较喜欢搞点稀奇古怪的开发工具或者学点跨端开发electron,开发个chrome插件喜欢学习开发之外的技能, 自动化测试等等再经历了一阵瞎折腾之后依旧碌碌无为没啥大成就高不成低不就的继续做着养活自己的工作。都是为了这碎银几两突然有一天灵光乍现做ete测试虽然能保证项目的稳定性它的缺点就是上手需要学习成本还有就维护成本比较高每次开发修改了一个页面的Id可能导致整个自动化脚本需要重新写这也就是为啥自动化测试为啥难做的原因吧自动化也就只有大厂金主爸爸才能玩的起的小厂能有足够开发就很好了更有甚的是自己开发自己测试。免打声明以上只是个人观点如有错误纯属作者误判02 录制测试脚本我就想为啥不能做到自动化录制脚本呢我就查了市面上的自动化测试工具 发现 Selenium 就可以做到自动化录制脚本但是Selenium 无法做到断言呀还是需要了解代码手动添加断言这个虽然有但是还是无法满足无代码的自定化测试场景呀成本还是挺高的我就想到chrome插件是不是可以录制下来每一步的操作场景至于断言可以通过鼠标右键菜单选择断言条件.。如果这样的话是不是就不用再修改测试用例了基于这个思路我就开始验证通过js注入全局监听鼠标操作事件获取用户的操作然后把录制的脚本生成更加简单的json 文件只需要了解每个key代表的含义就可以修改脚本了是不是超级简单如果你还是不懂代码那也没关系直接删掉之前的测试脚本重新录制呗也不会浪费太多时So easy代码片段[ { active: true, audible: false, autoDiscardable: true, discarded: false, favIconUrl: https://www.baidu.com/img/baidu_85beaf5496f291521eb75ba38eacbd87.svg, groupId: -1, height: 750, highlighted: true, id: 83924930, incognito: true, index: 0, mutedInfo: { muted: false }, pinned: false, selected: true, status: complete, title: 百度一下你就知道, url: https://www.baidu.com/, width: 1511, windowId: 83924929, action: start, indexNum: 0, date: 1683204259189, userAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/112.0.0.0 Safari/537.36, isMobile: false, hasTouch: false, deviceScaleFactor: 2, type: start }, { x: 428.5, y: 188.3984375, url: https://www.baidu.com/, date: 1683204265653, height: 44, xpath: //*[id\kw\], width: 550, value: , clientX: 767, clientY: 204, selector: document html body div div div div div form span input, iframe: , indexNum: 1, innerHtml: , localName: input, localNameType: text, type: click }, { x: 135, y: 17, url: https://www.baidu.com/, date: 1683204275609, height: 38, xpath: //*[id\kw\], width: 471, value: 你好, clientX: 533, clientY: 38, selector: document html body div div div div div form span input, iframe: , indexNum: 3, innerHtml: , localName: input, localNameType: text, type: change }, { x: 725, y: 15, url: https://www.baidu.com/, date: 1683204275760, height: 40, xpath: //*[id\su\], width: 112, value: 百度一下, clientX: 799, clientY: 23, selector: document html body div div div div div form span input, iframe: , indexNum: 4, innerHtml: , localName: input, localNameType: submit, type: click } ]keykey描述url当前打开的 URL 地址信息x获取当前操作的 dom 位置 X 轴坐标y获取当前操作的 dom 位置 Y 轴坐标width当前录制的浏览器的宽度或者 获取当前操作的 dom 的宽度height当前录制的浏览器的高度或者 获取当前操作的 dom 的高度xpath获取当前操作的 dom 的唯一地址selector获取当前操作的 dom 的路径信息clientX获取当前操作的 dom 距离浏览器视口的 X 轴距离clientY获取当前操作的 dom 距离浏览器视口的 Y 轴距离type获取当前操作的 dom 操作类型 click、change、scrollWin、load、dbclickdate当前操作的 dom 操作录入的时间iframe当前网页是否嵌有 iframe 地址indexNum当前测试用例的索引scrollTop如果触发了type为scrollWin需要记录滚动的上下位置scrollLeft如果触发了type为scrollWin需要记录滚动的左右位置是不是瞬间觉得特别简单自己也可以实现一个自动化测试工具了我就是被这样的错觉欺骗了实现脚本录制功能其实并不难难的是怎样实现自定化测试回放功能呢怎么样做到开箱即用跨端怎么样解决iframe嵌套查找dom的问题? 脚本怎么存储测试结果怎么生成一系列头大的问题。。。。为了实现这个天真的想法我也疯狂一把只要不是业务开发我就喜欢专研谁让我是一个不务正业的前端开发呢03 自动化测试测试脚本录制好了怎么跑自动化测试呢这是个问题虽不难但也不想使用过于麻烦的启动方式为了满足这个条件那我们就要开发一个开箱即用并支持跨端的工具说到这里electron好像是个不错的选择那我之前的不务正业好像都派上用场了那就基于electron开发自动化测试工具吧只要将测试脚本导入工具点击一下按钮就可以跑测试自动化了有没有感觉自动化测试好简单而且生成的测试报告让你对测试结果一目了然为了方便维护测试用例脚本工具支持拖拽、分组单选等功能方便你随意所欲测试如果你还想要推送消息那也不打紧可以通过配置飞书钉钉消息推送保证你随时随地都可以掌握测试状况即使你线上正常运行的项目也可以通过定时任务跑自动化当做一个线上项目监控平台也不错哇04 测试流程回放图通过测试脚本遍历操作对每条测试用例的type类型模拟回放 点击、‘文本框的改变’、’鼠标滚动‘、 ‘以及浏览器的前进‘、‘后退‘、‘刷新‘、 ‘tap 页的切换‘等操作就可以达到测试自动化的结果最后把收集到的测试结果信息汇总生成测试报告就达到了自动化的测试结果了 貌似实现起来也挺有意思的。05 自动化工具界面如果有个美观测试界面是不是测试起来更加赏心悦目呢还是得找个漂亮的UI小姐姐帮忙设计一个是不是和小姐姐沟通的机会有了就有了测试自动化工具的雏形界面长得丑不是UI小姐姐的错是开发实现的不好。06总结一个自动化测试工具就这么实现了看似简单实现起来也简单就这样前前后后做了两年技术还是太菜了为了功能实现更完善加过班熬过夜也见过凌晨4点的上海听过早起的鸟叫这么多年学到的不务正业的技能终于在一个项目得到了全面的体现第一次感觉到了开发以外的成就感技多不压身总有一天会体现的。如果哪天前端坐不下去了我相信在测试方面应该还可以抢一口饭吧最后作为一位过来人也是希望大家少走一些弯路在这里我给大家分享一些软件测试的学习资料和我花了3个月整理的软件测试自学全栈这些资料希望能给你前进的路上带来帮助。​视频文档获取方式这份文档和视频资料对于想从事【软件测试】的朋友来说应该是最全面最完整的备战仓库这个仓库也陪伴我走过了最艰难的路程希望也能帮助到你以上均可以分享点下方小卡片即可自行领取。