录制用户操作实现自动化任务

今天也想MK代码

于 2024-03-03 14:05:08 发布

阅读量443

点赞数 3

分类专栏：从0到1开发流程图自动化桌面应用文章标签：自动化运维

本文链接：https://blog.csdn.net/weixin_42429220/article/details/136430665

版权

从0到1开发流程图自动化桌面应用专栏收录该内容

21 篇文章 5 订阅

订阅专栏

先上视频！！

流程自动化工具-录制操作绘制流程

这个想法之前就有了，趁着周末时间给它撸出来。

实现思路

从之前的文章自动化桌面未来展望中已经验证了录制绘制流程图的可行性。基于DOM录制页面操作轨迹的思路监听页面点击、输入事件即可，同时获取当前操作元素的Xpath，最后生成之前定义数据格式。

// 监听点击事件
  document.body.addEventListener('click', _throttleOnClick, {
      capture: true, 
      passive: true,
    })

// 监听输入事件
   document.body.addEventListener('input', _throttleOnInput, {
      capture: true,
      passive: true,
    } )

操作数据重复过多？

当在输入框输入字符时，每次都触发输入事件，发现打印出来数据很多，例如：第一次输入‘q’,触发了一次，此时记录了‘q’,紧接输入‘w’,触发了一次，此时记录‘qw’,而真正想要的是最后一次的‘qw’, 而不是[‘q’, ‘qw’]，因此得做了一个数据去除重复的，思路：把xpath作为唯一key，遍历数组，只要上次操作xpath与xpath一致，就把上一次xpath数据去除。点击事件也是如此。