浅谈Angular单元测试总结

测试分类

按开发阶段划分

  • 单元测试

单元测试又称模块测试，针对软件设计中的最小单位——程序模块，进行正确性检查的测试工作。

  • 集成测试

集成测试又叫组装测试，通常在单元测试的基础上，将所有程序模块进行有序的、递增测试。重点测试不同模块的接口部分

  • 系统测试

指的是将整个软件系统看成一个整体进行测试，包括对功能、性能以及软件所运行的软硬件环境进行测试。

  • 验收测试

指按照项目任务书或合同、供需双方约定的验收依据文档进行的对整个系统的测试与评审，决定是否接收或拒收系统

按是否运行划分

  • 静态测试

是指不实际运行被测软件，而只是静态地检查程序代码、界面或文档中可能存在的错误过程

  • 动态测试

是指实际运行被测程序，输入相应的测试数据，检查实际输出结果和预期结果是否相符的过程。
按是否查看源代码划分

  • 黑盒测试

指的是把被测的软件看做一个黑盒子，不关心盒子里面的结构是什么样子，只关心软件的输入数据和输出数据。

  • 白盒测试

指的是把盒子打开，去研究里面的源代码和程序结构。

其他

  • 回归测试

是指软件被修改后重新进行的测试，重复执行上一个版本测试时的用例，是为了保证对软件所做的修改没有引入新的错误而重复进行的测试。

  • 冒烟测试

是指在对一个新版本进行系统大规模的测试之前，先验证一下软件的基本功能是否实现，是否具备可测性。

  • 随机测试

是指测试中所有的输入数据都是随机生成的，其目的是模拟用户的真实操作，并发现一些边缘性的错误。

一直以来都是后台写单元测试，这周初次使用前台单元测试，出错是必然的

问题使用自己写的组件或者管道是报错

需要在前台单元测试spec.ts文件中加入自己写的组件或管道，例如：

使用框架中自带的组件

需要在前台单元测试spec.ts文件中加入报错信息提示的组件，例如：

[object ErrorEvent] thrown [对象 错误事件] 被抛出

这个错误是遇到次数最多的，当时出现这个错误时和张喜硕组长研究查资料搞了大半宿也没解决，最后还是在潘老师的帮助下解决的，得知ng test 时控制台报错的哪个文件，不一定是这个文件出错，解决办法如下：

打开单元测试时自动弹出来浏览器的控制台

控制台中，由于http发起请求时，必然发生错误，所以有很多个错误，但是导致单元测试不通过的，只有那些发生了异常，我们没有传入error的

找到Uncaught，点开HttpErrorResponse看一下对应service中的那个服务

在对应的服务中找到，找到方法（在方法名上右键Find Usages ）看谁调用了我。

在订阅的时候，要加入error异常错误

加上之后问题解决，单元测试通过。

总结

单元测试从长期来看，可以提高代码质量，减少维护成本，降低重构难度。但是从短期来看，加大了工作量，对于进度紧张的项目中的开发人员来说，可能会成为不少的负担。

但是我这里有个疑问：

angular单元测试都是用命令行自动生成的，测试和不测试有什么区别？感觉加了测试反而更麻烦

赞 (0)

相关推荐

  • 使用Angular CLI进行单元测试和E2E测试的方法

    第一篇文章是: "使用angular cli生成angular5项目" ://www.jb51.net/article/136621.htm 第二篇文章是: "使用angular cli从蓝本生成代码" ://www.jb51.net/article/137031.htm 第三篇文章是: "使用Angular CLI生成路由" ://www.jb51.net/article/137033.htm 第四篇文章时: "使用Angular C

  • AngularJS 单元测试（二）详解

    使用对象模拟注入 我们可以非常容易的使用angularjs的$provider服务用一个对象模拟一个依赖并且注入. 例子如下 angular.module('artists',[]). factory('Artists',['imageStore',function(imageStore){ return { thumb:function(){ return imageStore.thumbnailUrl(id) } } }]) 如何实现 如何确定了服务 1.创建一个URL的引用,稍后会被moc

  • angularjs中的单元测试实例

    当ng项目越来越大的时候,单元测试就要提上日程了,有的时候团队是以测试先行,有的是先实现功能,后面再测试功能模块,这个各有利弊,今天主要说说利用karma和jasmine来进行ng模块的单元测试. 什么是Karma karma是一个单元测试的运行控制框架,提供以不同环境来运行单元测试,比如chrome,firfox,phantomjs等,测试框架支持jasmine,mocha,qunit,是一个以nodejs为环境的npm模块. 安装测试相关的npm模块建议使用----save-dev参数,因为

  • AngularJS 单元测试（一）详解

    AngularJS单元测试 网上有很多单元测试的教程,比如如何安装jasmine和ngMock,大家可以搜一下.这里就不在说了.下面重点介绍一个单元测试的过程. 加载一个模块 AngularJS用module来包括应用不同的部分比如controllers,services, filters.为了测试不同的部分,我们需要一个不同模块的引用,并且加载它.Angularjs模块注入使用ngMock模块.ngMock模块能够注入服务service进入单元测试. ngMock暴露出angular.mock

  • 浅谈Angular单元测试总结

    测试分类 按开发阶段划分 单元测试 单元测试又称模块测试,针对软件设计中的最小单位--程序模块,进行正确性检查的测试工作. 集成测试 集成测试又叫组装测试,通常在单元测试的基础上,将所有程序模块进行有序的.递增测试.重点测试不同模块的接口部分 系统测试 指的是将整个软件系统看成一个整体进行测试,包括对功能.性能以及软件所运行的软硬件环境进行测试. 验收测试 指按照项目任务书或合同.供需双方约定的验收依据文档进行的对整个系统的测试与评审,决定是否接收或拒收系统 按是否运行划分 静态测试 是指不实际

  • 浅谈Angular中ngModel的$render

    浅谈Angular中ngModel的$render

    在我开始着手ngModel的领域时候,有一个问题很令我纠结,那就是$render()到底是做什么的呢?查了很多资料都只是简单的描述一下,这就令我很纠结了,终于在一个阳光明媚的晚上,我终于解决了这个大问题 那么这个$render方法到底是干什么的呢?他的用处就是在$viewValue改变的时候可以重新绑定model数据,但是我们要注意一点($viewValue和DOM节点的value是不同的),我觉得他们的区别有点类似setTimeout和$timeout的区别,但是又不太一样.ps:其实mode

  • 浅谈angular懒加载的一些坑

    浅谈angular懒加载的一些坑

    写在前面 最近在工作中接触到angular模块化打包加载的一些内容,感觉中间踩了一些坑,在此标记一下. 项目背景: 项目主要用到angularJs作为前端框架,项目之前发布的时候会把所有的前端脚本打包压缩到一个文件中,在页面初次访问的时候加载,造成页面初始载入缓慢,在此基础上,提出按需加载,即只有当用户访问某个模块的时候,该模块的脚本才会加载. 工具类: 项目使用grunt打包根据AMD规范,使用grunt-contrib-requirejs来压缩合并模块,同时用ocLazyLoad来完成ang

  • 浅谈angular表单提交中ng-submit的默认使用方法

    在表单提交的时候,我使用了一个button,但ng-submit写在form标签中,然而button中我未使用任何方法访问submit()函数 <div ng-app="dkr"> <div ng-controller="logincontrol"> <form ng-submit="submit(user)"> <div>账号名 <input type="text" ng

  • 浅谈Angular的12个经典问题

    浅谈Angular的12个经典问题

    1. 请解释Angular 2应用程序的生命周期hooks是什么? Angular 2组件/指令具有生命周期事件,是由@angular/core管理的.@angular/core会创建组件,渲染它,创建并呈现它的后代.当@angular/core的数据绑定属性更改时,处理就会更改,在从DOM中删除其模板之前,就会销毁掉它.Angular提供了一组生命周期hooks(特殊事件),可以被分接到生命周期中,并在需要时执行操作.构造函数会在所有生命周期事件之前执行.每个接口都有一个前缀为ng的hook方

  • 浅谈Angular路由复用策略

    一.引言 路由在执行过程中对组件无状态操作,即路由离退时组件状态也一并被删除:当然在绝大多数场景下这是合理的. 但有时一些特殊需求会让人半死亡状态,当然这一切都是为了用户体验:一种非常常见场景,在移动端中用户通过关键词搜索商品,而死不死的这样的列表通常都会是自动下一页动作,此时用户好不容易滚动到第二页并找到想要看的商品时,路由至商品详情页,然后一个后退--用户懵逼了. Angular路由与组件一开始就透过 RouterModule.forRoot 形成一种关系,当路由命中时利用Component

  • 浅谈Angular的$q, defer, promise

    1. $q $q是Angular的一种内置服务,它可以使你异步地执行函数,并且当函数执行完成时它允许你使用函数的返回值(或异常). 2. defer defer的字面意思是延迟,$q.defer() 可以创建一个deferred实例(延迟对象实例). deferred 实例旨在暴露派生的Promise 实例,以及被用来作为成功完成或未成功完成的信号API,以及当前任务的状态.这听起来好复杂的样子,总结$q, defer, promise三者之间的关系如下所示. var deferred = $q

  • 浅谈Angular路由守卫

    浅谈Angular路由守卫

    引言 在企业应用中权限.复杂页多路由数据处理.进入与离开路由数据处理这些是非常常见的需求. 当希望用户离开一个正常编辑页时,要中断并提醒用户是否真的要离开时,如果在Angular中应该怎么做呢? 其实Angular路由守卫属性可以帮我们做更多有意义的事,而且非常简单. 什么是路由守卫? Angular 的 Route 路由参数中除了熟悉的 path.component 外,还包括四种是否允许路由激活与离开的属性. canActivate 控制是否允许进入路由. canActivateChild

  • 浅谈angular.copy() 深拷贝

    浅谈angular.copy() 深拷贝

    因为项目中需要拷贝,查阅angularjs API文档,发现对angular.copy() 的解释: 复制一个对象或者一个数组(好吧,万物皆对象,数组也是一个对象). 1> 如果省略了destination,一个新的对象或数组将会被创建出来: 2> 如果提供了destination,则source对象中的所有元素和属性都会被复制到destination中: 3> 如果source不是对象或数组(例如是null或undefined), 则返回source: 4> 如果source和d

  • 浅谈Angular.js中使用$watch监听模型变化

    $watch简单使用 $watch是一个scope函数,用于监听模型变化,当你的模型部分发生变化时它会通知你. $watch(watchExpression, listener, objectEquality); 每个参数的说明如下: watchExpression:监听的对象,它可以是一个angular表达式如'name',或函数如function(){return $scope.name}. listener:当watchExpression变化时会被调用的函数或者表达式,它接收3个参数:n

随机推荐