js校验sql合法性_前端测试之视觉校验

前述：

Hi~这是本菜鸟第二次写关于前端测试的文章，基于第一次写的关于前端性能的自动化测试之后的又一篇关于前端GUI层面的自动化测试的文章。那先来谈谈为什么做这个吧~

背景：

相信个大大小小的公司，在新版发布之后，都回去走一遍线上ui的测试，不论新增还是迭代，并且就算校验了，也不能阻止线上可能出现的偶发状况，比方前端在SSR的时候，某个字段内带有特殊字符，走到浏览器渲染层面的时候，就会被当成特殊字符解析，这个时候，页面的某些dom元素就会“被”丢失。嗯？什么？还能被丢失？说到这，相信小伙伴跟我一样，瞪大了双眼~当然这个也算是SSR渲染带来的一个痛点。校验字符的合法性需要走到浏览器层，直☞用户。类似的可能还会存在多标签带来的隐患。比方说页面中，head标签中，多了一个</head>标签，直接导致，第一个闭合标签后的字符还没被解析，直接当成了文本，展示了出来。这样给到用户，是不是很不友好。用户看了懵，研发知道了头大，啥玩意？？既然出现了这样的问题，那么就需要解决问题拉。继续往下看~

需要解决的问题：

1. 服务包含特殊字符的情况下，在页面渲染过程中存在dom丢失问题；
2. Html结构中出现多对标签，导致页面解析出错，出现其他乱码字符问题；
3. 以上不同问题的出现，就针对前端页面该具备的容错能力，兜底能力建设上，提供针对性的错误场景和错误场景代码覆盖点的捕捉、汇总。
4. 前端线上页面，UI层级出现较大差异的预警