前端页面测试需要测试哪些内容？前端测试主要分4大类，而这4大类也分很多小方向测试，今天小编简单的介绍每个方向的概念：
1）界面样式测试
固定界面样式测试：主要针对文字内容不变的区域，例如页面的页头，页脚这类结构、内容不变的区域，而测试一般通过截图对比解决。
结构不变界面样式测试：主要针对结构不变的区域，例如新闻区域这类结构不变，内容变化的区域，这类测试一般通过DOM元素对比解决。
计算样式测试：主要针对计算样式不变的区域，这类测试一般通过比较计算样式解决，但是这种测试不推荐，因为测试成本比较大。
2）功能测试
服务器数据预期测试：主要针对用户在前端界面进行某种操作后，提交数据给后台后，测试后台能否返回预期的数据
界面功能测试：主要针对用户在前端界面进行某种交互性操作后，测试能否获取预期的功能、界面交互
3）多浏览器测试
多浏览器测试：基于界面样式测试、功能测试的基础上来进行不同浏览器的的测试，俗称兼容性测试。
4）性能测试
白屏时间：用户浏览器输入网址后至浏览器出现至少1px画面为止。
首屏时间：用户浏览器首屏内所有的元素呈现所花费时间。
页面回归时间：用户浏览器非第一次加载所有的元素呈现所花费时间。
用户可操作时间(dom ready) ：网站某些功能可以使用的时间。
页面总下载时间(onload):网站中所有资源加载完成并且可用时间。
下面，主要跟大家分享一下前端自动化测试的实现：
1.允许测试脚本里调用api
我们经常在测试时要做一些准备活动，比如注册一个新用户。这一步骤可能每次花费几分钟时间，那么这时候建议直接调用注册用户的api来生成新用户。每个场景节约几分钟，加起来就多了。
2.允许测试脚本里访问数据库
虽然我们做测试可以说重点在界面上，但是业务逻辑上如果出错了最好也要能找出来。也就是说，我的检查点不止检查页面元素，更先去检查对应数据在数据库里是否正确。好处是数据库里不正确的时候，脚本就不用傻乎乎等个几十秒才报出来页面上的错误。
3.为测试准备独立干净的测试环境
测试如果针对网站，很多时候要考虑在windows系统上跑脚本。一般建议和工作用的电脑分开。如果有条件，还可以自动化搭建这样的测试环境，我们以前是通过云自动搭建符合要求的虚拟机来做。
4.考虑测试逻辑的重要性
通常采用页面对象建模，详见selenium官网。如果是商业工具则一般已经自带对象库，如QTP等都自带了。简单来说就是同样的测试逻辑封装在一起，用的时候直接调，改的时候只改一个地方。
5.在开发阶段考虑可测性
有的app就是不可测，这也动态那也动态，控件各种不标准，自定义，这种是没法做自动化的。
6.采用统一的设计和分层次的设计
如果有一个测试场景会用到网站、桌面app、手机app，如何做自动化？如果采用统一的自动化测试设计应当可以解决。不管是桌面的网页的还是手机的，对测试脚本来说都是执行测试的库去负责的，也就是说我写测试只是写业务逻辑，如何执行是那些库的事情。第一层是测试逻辑层，第二层是测试实现层。
这样分开的好处是：
1).实现层的工具可能会换；
2).可以测试复杂的场景；
3).维护人员可以分开，降低测试逻辑层维护人员的技术要求；
4).便于大团队的协作。
7.允许半自动化测试
脚本负责截图，事后人工检查截下来的图，来判断是否有界面错乱之类的问题，好处是实现方便。
更多前端自动化测试阅读：
前端自动化测试方法及工具使用注意事项
web自动化测试工具AR和APP自动化测试工具MR的区别
怎么做前端自动化测试？实现前端项目的自动化测试的要点
web自动化测试的思路和方法
Web自动化测试工具有哪些？Web自动化测试基本步骤
自动化测试生命周期的6个阶段
如何选择正确的自动化测试工具？
sales@spasvo.com
