前端测试代码怎么写

1. 前端该怎样实现自动化测试 首先,还是要强调一点:
前端是一种特殊的GUI软件
看过我最近一年内做前端工程方面相关分享的人可能有印象,我总是在强调这一点 。前端测试也跟这个理论基础有所关联 。
在这里,我还想吐槽一下:
API测试方法论在测试GUI时并不能解决所有问题 。
与很多前端工程师讨论过前端测试,大家更多的还是盯着API测试方法论 。诚然,前端有那么一小部分代码是可以用API测试保证质量的,但前端项目中的绝大多数代码是GUI界面,前端测试应该向传统GUI测试方法论需求解决方案:GUI软件测试_百度百科,这个百科词条介绍的很不错,大家可以感受一下GUI测试相关概念和方法 。它的测试用例、覆盖率统计、测试方法等等都与API测试有着很大的不同 。
2. 前端开发使用哪些工具来测试代码的性能 Chrome有一个插件叫PageSpeed,谷歌官方出品 。以当前页面为例存在下面的问题
Suggestion Summary
Click on the rule names to see suggestions for improvement.
Minimize payload
(M)Serve scaled images, (L)Enable compression, (L)Minify HTML, (L)Optimize images
Minimize delay in page load
(L)Avoid CSS @import, (L)Minimize request size, (L)Specify image dimensions, (L)Specify a character set
Other
(L)Leverage browser caching/app/?L)Enable Keep-Alive, (L)Remove query
strings from static resources, (L)Specify a Vary: Accept-Encoding header
HML分别代表问题的严重程度,高、中、低
3. 问大家一个问题,我刚做前端一个月(实习) 今年5月开始前端之旅,学习近4个月之后,于9月底,参与了一个商城厂家后台的前端页面的开发,所做的内容并不多,但是在这段时间的收获却不少 。接下来将详细谈谈这些收获 。
1)参与项目之前应该做什么
在实习刚开始的时候,主要是从git上clone代码,然后自己在前辈的指导下查看代码结构,理解整个流程 。当时花的时间不长,基本也把代码看的差不多了 。这个是很重要的,你需要对整个前端的架构有一个大致的了解 。
2)写第一行代码前应该做什么
仔细看产品原型,查看接口文档 。这是非常重要的,特别是原型,需要仔细的查看原型,看看那些地方存在不合理的,需要及时找产品或相关负责人沟通,最终要确保你对整个产品原型有很详细的了解 。这样子不至于在写页面,写交互的时候出现大问题 。还有接口文档也是很重要的,前端和后端都需要一份共同的接口文档,大家根据这个文档进行数据交互 。有了共同的接口文档,在开发过程中不用关注变量名这些无关紧要的细节 。而且能确保前后端数据交互时不会有不一致的地方 。
3)写代码时应该做什么
多思考,就能少写几行不必要的代码 。这是很重要的一个问题,一般来说,在最开始的时候,需要将所需要的技术掌握,然后将页面分成几个小块,从整体到部分,要清楚代码的大致结构,脉络 。先将大的东西做好,再慢慢细调 。这样子不必时刻纠结于细节,浪费不少时间 。写代码时要遵循代码规范,比如说Tab键还是空格缩进的问题,比如说是LF还是CTLF换行的问题,尽量采取和大家一致的开发环境,这样在别人看你的代码和你看别人的代码时会减少不必要的麻烦 。
4)写完代码时应该做什么
单元测试,不用多说 。如果是用RAP来进行单元测试的话,要注意测试用例设计的合理性 。
5)前后端联调
前后端联调应该采取怎样的方式才是最好的?以前是一个前端搭配一个后端,他们用同一个分支 。联调时,后端从git上pull代码,然后在本地跑一遍gulp,然后运行联调 。这样有一个问题就是,当前端有问题时,如果是一个很小的问题,那么他也需要从他自己的机子上改,然后commit,push代码,然后后端在他的机子上重新pull,gulp,运行联调 。这样子比较繁琐,效率不怎么高 。现在的做法是前端将请求用nginx代理请求到后端的机子上,然后在前端进行测试 。这样前端发现有问题,他自己修改就好 。后端不用pull代码 。后端发现有问题也是如此,这样前后端就分开了 。