最近写自动化框架的过程中，脑子蹦出来一些想法。发此贴记录一下。

众所周知，说到 UI 自动化。大家都会想到用元素进行定位。但是目前的趋势是用 AI 进行识别 + 元素结合。而我的思路是 "利用前端固定显示的图片/插图"

来实现，断言的结果就是看图片是否一致，通过图片对比，比 OCR 提取是不是块多了，看下我问 gpt 的截图

• 比如，优惠卷，封面，按钮等等，这些按钮，图片的样式是不是都是固定死的。再说封面，封面是需要我们自己先上传的吧？那也就是我提前知道了这个封面是什么样子的，那封面是不是也是 固定死的？ 然后我们把这一样的地方进行截图进行对比，，获取他在页面中的作为区域，获取的了区域是不是就可以进行鼠标操作了？

我接下来用测试用例来说明再说明一下我的具体思路

假设我们要录制一个外卖下单这样的一个用例，流程如下
进入首页-->点击商品-->进入商品详情->商品详情页点击下单-->订单详情页

1. 进入首页并跳转详情页 首先，看下首页截图，紫色框是我们要测试的商品

然后获取我们想要测试的商品截图，比如下面这个是我们要测试的商品

我们把首页跟截图进入对比，如果包含，则标记出来截图再首页的区域，那这一块的区域我们知道了，是不是就能进行鼠标操作了？然后我们进行点击，进入道商品详情页

1. 商品详情页并下单 商品详情页的截图

我们这个时候，是不是需要进行判断这个商品详情页，到底是不是我们预期的，那么我们的预期如下，如果包含了下面这张图，是不是用例就通过了

我们选择 10 元的，紫色框是我们要测试的地方

这个时候我们选择 “10 元单人餐”

跟上面的一样，进行对比。这里我提一点，我们可以提前把商品详情页的截图这里给标记一下，是不是也能知道我们测试的地方

3.提交订单页
提交订单页的截图

这里我问一下，这个页面同一类用户，或者同一批优惠进入，某些地方页面长得是不是一样的？我们就用一样的地方进行判断，如果你要看金额，那你就单独截取金额的图，可以截取多个，进行多次对比 对吧？

想法就是这个想法，但是我自己做不了。欢迎大家讨论！