开发基于vue前端框架下的系统的UI自动化，记录总结踩的坑

原创 已于 2022-06-17 21:53:56 修改 · 314 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#自动化 #前端 #运维

于 2018-11-26 11:17:00 首次发布
本文分享了使用pytest进行基于Vue的UI自动化测试经验，重点讨论了处理上传功能及无头模式下autoit应用的局限性。

在使用了pytest完成了一个系统的UI自动化后，因为系统的前端框架，是 基于VUE写的，这就让我编写脚本的时候踩了些坑。

 

  1. 无法用JS 修改标签属性，从而进行的操作
    比如上传图片，我们的上传是这样子的
    基于这个情况，我不得不去使用autoit来完成上传的动作，但是，autoit是用来操作windows系统的GUI的，
    那么我的脚本，无法在Linux上运行，也无法使用浏览器的headless模式(无头模式)。

2.某些详情页，里在控制台里通过JS可以获取到我想要的值，但是代码执行起来就是拿不到

UI自动化之监控平台的搭建VUE+novnc(前端一)
OYangGouDai的博客
11-09 778
利用 selenium grid中 novnc技术，将7900端口的页面全部用VUE 重新编排，在一个页面进行展示。不知道7900端口的由来可以看下前面一篇文件。
干货 | 携程机票前端UI自动化与持续集成升级实践
携程技术
04-23 1117
作者简介JinG、YuWang，携程前端开发工程师，负责机票主流程预定React Native技术栈相关开发工作。一、前言随着携程机票APP全流程由Native技术栈转向RN（Reac...
一个基于vue2实现功能强大的自动化后台框架基础模板
08-08
这是一个功能强大的自动化后台框架基础模板，基于vue2实现，用到的技术包含：vue2,vue-router,vuex2,axios,ElementUI。
从一次故障聊聊前端 UI 自动化测试
weixin_48726650的博客
07-19 346
背景 事件的起因在于老板最近的两次“故障”，一次去年的，一次最近。共同原因都是脚手架在发布平台发布打包时出错，导致线上应用白屏不可用。 最神奇的是，事后多次 Code Review，结果还是没有发现任何能够导致该问题的 bug，最后推测有可能是服务器在发布打包的时候出了问题。 当老板第 N + 1 次吐槽因为他写的工程化工具领来的天外飞锅，我突然思考起来，如何才能避免这种天外飞锅。 归根结底，导致这类线上故障的原因都是在于打包上线的代码没有经过验证。针对这个问题，有两种方法可以解决： 治本，由于请求地址不
前端自动化UI测试的完整方案
人生不怕起点低，就怕没追求
11-23 1401
开发公共平台项目，测试资源相对比较少，因此对开发者自身而言，为了维护项目的稳定性，需要对平台做各类测试，即使有测试环境，但是也很容易缺乏测试场景导致带着bug上线的情况。 因此我们需要做完整自动化测试方案，来避免这类常规错误，提高平台的可用性和稳定性。
基于 Vue3.0 框架的模拟Windows 桌面效果，后台管理UI
11-05
在"基于Vue3.0框架的模拟Windows桌面效果，后台管理UI"项目中，开发者利用Vue3.0的特性来创建一个类似Windows操作系统桌面的交互体验，用于后台管理界面。这个项目展示了Vue3.0在构建复杂、可定制化用户界面时的强大...
uivue前端UI框架基于vue2开发
08-12
**UIVue前端UI框架基于Vue2开发** UIVue是一个专为Vue2构建的前端用户界面框架，旨在提供一套完整、高效且易于使用的组件库，帮助开发者快速构建现代化的Web应用程序。这个框架充分利用了Vue2的强大功能，如虚拟DOM...
基于Element UI的Vue前端开发框架改造版
07-06
而基于Element UI的Vue前端开发框架改造版，则是在Element UI的基础上，对Vue前端项目进行了进一步的定制和优化，以满足特定开发需求或提升开发效率。 在这个改造版的框架中，开发者可以利用Element UI提供的各种...
基于Java企业级开发-VUE前端框架-SpringBoot后端架构-MySQL数据库-Shiro权限控制-MyBatisPlus持久层-AntdUI组件-医院信息化管理-系统管理.zip
最新发布
07-30
本文将围绕一个综合性医院信息化管理系统展开讨论，该系统采用Java企业级开发技术，并结合Vue前端框架、SpringBoot后端架构、MySQL数据库、Shiro权限控制、MyBatisPlus持久层以及AntdUI组件，旨在构建一个高效、稳定...
基于Vue、Java的星辰办公自动化设计源码
09-28
本项目是一款基于Vue和...前端采用Vue框架及Element UI组件库，后端基于Spring Boot、Spring Security和Redis & Jwt技术实现。系统采用JWT进行权限认证，支持多终端登录，并能动态加载权限菜单，实现灵活的权限控制。
去哪儿UI自动化持续集成实战
03-12
去哪网的UI自动化测试，持续集成，资源共享便于大家学习
vue的自动化
m0_60992572的博客
08-24 645
大厂视野 1.流量大 性能优化 2.项目复杂 源码 3.持续迭代 4.项目稳定运行 自动化测试 需求评审 开发 测试（人点）（可以使用自动化测试完成一部分） 上线 5.为什么要写测试呢 测试代码可读性好，易于维护替代了测试的部分工作，无形中完成了一部分任务 准备 1.了解自动化测试 2.jest 3.cypress 4.端对端和自动化 测试分类 常⻅见的开发流程⾥里里，都有测试⼈人员，这种我们成为⿊黑盒测试， 测试⼈人员不.
带你10天精通vue框架（八）之Vue自动化工具
浮游的博客
06-18 455
6. Vue自动化工具（Vue-cli） 前面学习了普通组件以后，接下来我们继续学习单文件组件则需要提前先安装准备一些组件开发工具。否则无法使用和学习单文件组件。 一般情况下，单文件组件，我们运行在 自动化工具vue-CLI中，可以帮我们编译单文件组件。所以我们需要在系统中先搭建vue-CLI工具， 官网：https://cli.vuejs.org/zh/ Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。你可以使用 nvm 或 nvm-windows在同一台电脑中管理多个
轻松搞定Vue UI自动化测试，这几个技巧你一定要知道！
主要分享测试的学习资源，帮助快速了解测试行业，帮助想转行、进阶、小白成长为高级测试工程师。
03-01 1064
在前端开发中，Vue.js 是一个非常流行的框架，它通过响应式系统实现了数据的双向绑定。然而，在进行 UI 自动化测试时，Vue.js 的某些特性可能会导致一些意想不到的问题。本文将探讨 Vue 中 input 元素的实现原理，并分析在 UI 自动化测试中可能遇到的问题及其解决方案。
vue自动化测试（笔记，非教程）
qq_44408123的博客
04-04 288
1.spyOn和setMethods是异步操作，要等异步完成之后在操作 2.查找elementUI的组件时，该组件不能被存根，并且要是用mount,否则会无法触发绑定的事件 3.
Vue实现自动化平台（三）--实现项目管理页面
喵酱
04-03 2296
Vue实现自动化平台（三）
vue项目的自动化测试
weixin_41722909的博客
06-09 377
参考kukuv2大神的讲解整了个新项目搞了一下，只跑起了unit tests，e2e还是不行。报错：Error retrieving a new session from the selenium server。重新装了chromedriver也不行，弃了，人间不值得。有了解的大神可以指导一下初入坑的我，还想拯救一下。 ...
Mad-ui-vue：基于Vue的ACGMAD风格前端UI框架介绍
1. Vue.js前端框架：Vue.js是一个流行的JavaScript框架，用于构建用户界面和单页应用程序（SPA）。Vue.js采用数据驱动和组件化的思想，使得开发者能够高效地组织代码，并且便于维护和扩展。 2. ACGMAD视频文化：...
评论 2
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值