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 相关文章推荐
[转]JS宝典学习笔记
Feb 07 Javascript
超清晰的document对象详解
Feb 27 Javascript
通过百度地图获取公交线路的站点坐标的js代码
May 11 Javascript
jquery getScript动态加载JS方法改进详解
Nov 15 Javascript
Javascript封装DOMContentLoaded事件实例
Jun 12 Javascript
最棒的Angular2表格控件
Aug 10 Javascript
js实现瀑布流效果(自动生成新的内容)
Mar 16 Javascript
Angularjs+bootstrap+table多选(全选)支持单击行选中实现编辑、删除功能
Mar 27 Javascript
Bootstrap 树控件使用经验分享(图文解说)
Nov 06 Javascript
微信小程序实现添加手机联系人功能示例
Nov 30 Javascript
小程序实现多选框功能
Oct 30 Javascript
vue中如何实现后台管理系统的权限控制的方法步骤
Sep 05 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修改Linux或Unix口令的方法分享
2012/01/30 PHP
php+mysql数据库实现无限分类的方法
2014/12/12 PHP
Symfony2实现在controller中获取url的方法
2016/03/18 PHP
javascript定义函数的方法
2010/12/06 Javascript
如何让div span等元素能响应键盘事件操作指南
2012/11/13 Javascript
jQuery实现类似淘宝购物车全选状态示例
2013/06/26 Javascript
使用jQuery插件创建常规模态窗口登陆效果
2013/08/23 Javascript
jquery限定文本框只能输入数字即整数和小数
2013/11/29 Javascript
Jqgrid表格随窗口大小改变而改变的简单实例
2013/12/28 Javascript
jQuery对象初始化的传参方式
2015/02/26 Javascript
浅析jQuery移动开发中内联按钮和分组按钮的编写
2015/12/04 Javascript
jQuery深拷贝Json对象简单示例
2016/07/06 Javascript
JavaScript数据类型和变量_动力节点Java学院整理
2017/06/26 Javascript
three.js实现炫酷的全景3D重力感应
2018/12/30 Javascript
vue2.0 实现富文本编辑器功能
2019/05/26 Javascript
js获取本日、本周、本月的时间代码
2020/02/01 Javascript
JavaScript 正则应用详解【模式、欲查、反向引用等】
2020/05/13 Javascript
微信小程序实现时间戳格式转换
2020/07/20 Javascript
Python实现学校管理系统
2018/01/11 Python
用Python下载一个网页保存为本地的HTML文件实例
2018/05/21 Python
python批量查询、汉字去重处理CSV文件
2018/05/31 Python
python爬取个性签名的方法
2018/06/17 Python
python微信公众号之关注公众号自动回复
2018/10/25 Python
Python 共享变量加锁、释放详解
2019/08/28 Python
Python通过socketserver处理多个链接
2020/03/18 Python
Python字典取键、值对的方法步骤
2020/09/30 Python
用python爬虫批量下载pdf的实现
2020/12/01 Python
美国在线精品家居网站:Burke Decor
2017/04/12 全球购物
意大利独特而优质的家居用品:Fazzini
2018/12/05 全球购物
编辑个人求职信范文
2013/09/21 职场文书
大学生创业计划书的用途
2014/01/08 职场文书
建议书怎么写
2014/03/12 职场文书
学校门卫岗位职责
2014/03/16 职场文书
投标承诺函格式
2015/01/21 职场文书
2015年医生个人工作总结
2015/04/25 职场文书
2015秋季开学典礼致辞
2015/07/16 职场文书