AngularJS 单元测试(二)详解


Posted in Javascript onSeptember 21, 2016

使用对象模拟注入

我们可以非常容易的使用angularjs的$provider服务用一个对象模拟一个依赖并且注入。

例子如下

angular.module('artists',[]).
  factory('Artists',['imageStore',function(imageStore){
    return {
      thumb:function(){
        return imageStore.thumbnailUrl(id)
      }
    }
  }])

如何实现

如何确定了服务

1、创建一个URL的引用,稍后会被mock捕获,和为Artists注入的一个变量

var URL;
var Artists;

2、紧接着在beforeEach方法中使用$provide 服务注册模拟的factory服务。使用一个对象模拟thumbnailUrl方法。

beforeEach(module(function($provide){
  $provide.value('imageStore',{
    thumbnailUrl:function(id){
      url='/thumb/'+id
    }
  })
})

3、使用$injector服务注入这个方法,返回这个Artists服务并且用刚才创建的的变量来声明,稍后可以使用到。

beforeEach(inject(function($inject){
  Artists=$inject.get('Artists');
 }))

4、调用Artists创建一个简单的测试

it('return the correct artist thumbnailUrl',function(){
  Artists.thumb('1');
  expect(url).toBe('/thumbs/1');
 })

5、这里有一个完整的使用$provide模拟测试例子,这返回一个定义了thumbnailUrl方法,

describe('factory:artists',function(){
  var url;
  var Artists;
  beforeEach(module('artist'));
  beforeEach(module(function($provide){
    $provide.value('imageStore',{
      thumbnailUrl: function (id) {
      url = '/thumbs/' + id;
      }  
    })
  }));
  beforeEach(inject(function($injector){
    Artists=$injector.get('Artists')
  }))
  it('return the correct artist thumbnailUrl',function(){
    Artists.thumb('1');
    expect(url).toBe('/thumb/1')
  })

 })

使用spec模拟注册实例

为了声明依赖注入的实例,下面声明一个例子,下面有两个服务,第二个服务被注入到了第一个里。

angular.module('hiphop',[])
  .factory('deejays',['$rootscope','scratch',function($rootscope,scratch){
    return{
      originator: 'DJ Kool Herc',
      technique: scratch.technique()
    }
  }])
  .factory('scratch',['$rootscope',function($rootscope){
    return{
      technique:function(){
        return 'breakbeat';
      }
    }
  }])

2、

describe('Service: deejays',function(){
  beforeEach(module('hiphop'));
  var deejays;
  beforeEach(inject(function($injector){
    deejays=$injector.get('deejays');
  }))
  beforeEach(inject(function($provide) {
    $provide.value('scratch',jasmine.createSpyObj('scratch', ['technique']));
  }));
  it('should return the correct originator',function(){
    expect(deejays.originator).toBe('DJ Kool Herc');
  })
 })

以上就是对AngularJS 单元测试的资料整理,后续继续补充相关资料,谢谢大家对本站的支持!

Javascript 相关文章推荐
JQuery实现简单验证码提示解决方案
Dec 20 Javascript
javascript中的括号()用法小结
Apr 14 Javascript
学习JavaScript设计模式之单例模式
Jan 19 Javascript
利用Angularjs和Bootstrap前端开发案例实战
Aug 27 Javascript
js弹出窗口简单实现代码
Mar 22 Javascript
说说node中的可读流和可写流的区别
Jun 01 Javascript
在vue中获取token,并将token写进header的方法
Sep 26 Javascript
node.js实现为PDF添加水印的示例代码
Dec 05 Javascript
详解JavaScript的this指向和绑定
Sep 08 Javascript
vue中实现点击空白区域关闭弹窗的两种方法
Dec 30 Vue.js
vue打开新窗口并实现传参的图文实例
Mar 04 Vue.js
javascript函数式编程基础
Sep 15 Javascript
jQuery实现带延时功能的水平多级菜单效果【附demo源码下载】
Sep 21 #Javascript
AngularJS 单元测试(一)详解
Sep 21 #Javascript
vue.js+boostrap项目实践(案例详解)
Sep 21 #Javascript
AngularJS  ng-table插件设置排序
Sep 21 #Javascript
BooStrap对导航条的改造实践小结
Sep 21 #Javascript
AngularJs $parse、$eval和$observe、$watch详解
Sep 21 #Javascript
jQuery+CSS3实现仿花瓣网固定顶部位置带悬浮效果的导航菜单
Sep 21 #Javascript
You might like
如何在PHP中使用Oracle数据库(3)
2006/10/09 PHP
?生?D片??C字串
2006/12/06 PHP
php下实现在指定目录搜索指定类型文件的函数
2008/10/03 PHP
phpmyadmin安装时提示:Warning: require_once(./libraries/common.inc.php)错误解决办法
2011/08/18 PHP
php中出现空白页的原因及解决方法汇总
2014/07/08 PHP
PHP下载远程图片的几种方法总结
2017/04/07 PHP
Yii框架操作cookie与session的方法实例详解
2019/09/04 PHP
laravel 实现上传图片到本地和前台访问示例
2019/10/21 PHP
JQuery 图片延迟加载并等比缩放插件
2009/11/09 Javascript
用js做一个小游戏平台 (一)
2009/12/29 Javascript
6款新颖的jQuery和CSS3进度条插件推荐
2013/03/05 Javascript
使用js实现雪花飘落效果
2013/08/26 Javascript
jQuery选择器总结之常用元素查找方法
2016/08/04 Javascript
全面了解函数声明与函数表达式、变量提升
2016/08/09 Javascript
bootstrap手风琴制作方法详解
2017/01/11 Javascript
JavaScript实现父子dom同时绑定两个点击事件,一个用捕获,一个用冒泡时执行顺序的方法
2017/03/30 Javascript
bootstrap基本配置_动力节点Java学院整理
2017/07/14 Javascript
在vscode中统一vue编码风格的方法
2018/02/22 Javascript
解决vue处理axios post请求传参的问题
2018/03/05 Javascript
分享5个好用的javascript文件上传插件
2018/09/16 Javascript
一次微信小程序内地图的使用实战记录
2019/09/09 Javascript
VUE项目中加载已保存的笔记实例方法
2019/09/14 Javascript
python使用multiprocessing模块实现带回调函数的异步调用方法
2015/04/18 Python
Python面向对象特殊成员
2017/04/24 Python
python email smtplib模块发送邮件代码实例
2018/04/26 Python
Django中的forms组件实例详解
2018/11/08 Python
Python使用sax模块解析XML文件示例
2019/04/04 Python
Pyqt清空某一个QTreeewidgetItem下的所有分支方法
2019/06/17 Python
基于opencv实现简单画板功能
2020/08/02 Python
python3爬虫中引用Queue的实例讲解
2020/11/24 Python
python使用dlib进行人脸检测和关键点的示例
2020/12/05 Python
Hotels.com中国区:好订网
2016/08/18 全球购物
公司财务部岗位职责
2015/04/14 职场文书
关于运动会的宣传稿
2015/07/23 职场文书
好段摘抄大全(48句)
2019/08/08 职场文书
Go gorilla/sessions库安装使用
2022/08/14 Golang