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 相关文章推荐
一个不错的应用,用于提交获取文章内容,不推荐用
Mar 03 Javascript
jQuery 技巧大全(新手入门篇)
May 12 Javascript
JS防止用户多次提交的简单代码
Aug 01 Javascript
Javascript四舍五入Math.round()与Math.pow()使用介绍
Dec 27 Javascript
JS小数运算出现多为小数问题的解决方法
Jun 02 Javascript
在原生不支持的旧环境中添加兼容的Object.keys实现方法
Sep 11 Javascript
微信小程序页面间跳转传参方式总结
Jun 13 Javascript
如何在JavaScript中谨慎使用代码注释
Jun 21 Javascript
Electron vue的使用教程图文详解
Jul 05 Javascript
详解mpvue实现对苹果X安全区域的适配
Jul 31 Javascript
从Node.js事件触发器到Vue自定义事件的深入讲解
Jun 26 Javascript
JavaScript中reduce()的5个基本用法示例
Jul 19 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开发需要注意的安全问题
2010/09/01 PHP
深入php数据采集的详解
2013/06/02 PHP
PHP采集类Snoopy抓取图片实例
2014/06/19 PHP
PHP使用strtotime计算两个给定日期之间天数的方法
2015/03/18 PHP
浅谈关于PHP解决图片无损压缩的问题
2017/09/01 PHP
在Laravel的Model层做数据缓存的实现
2019/09/26 PHP
又一个图片自动缩小的JS代码
2007/03/10 Javascript
javascript 实现父窗口引用弹出窗口的值的脚本
2007/08/07 Javascript
javascript 文档的编码问题解决
2009/03/01 Javascript
jquery显示和隐藏div特效实例
2013/02/27 Javascript
document.documentElement和document.body区别介绍
2013/09/16 Javascript
js点击出现悬浮窗效果不使用JQuery插件
2014/01/20 Javascript
基于jquery实现省市联动效果
2015/11/23 Javascript
深入浅析react native es6语法
2015/12/09 Javascript
jQuery插件imgPreviewQs实现上传图片预览
2016/01/15 Javascript
jQuery插件扩展操作入门示例
2017/01/16 Javascript
javascript简写常用的12个技巧(可以大大减少你的js代码量)
2020/03/28 Javascript
WebStorm ES6 语法支持设置&babel使用及自动编译(详解)
2017/09/08 Javascript
JS+H5 Canvas实现时钟效果
2018/07/20 Javascript
Electron中实现大文件上传和断点续传功能
2018/10/28 Javascript
Vue中多个元素、组件的过渡及列表过渡的方法示例
2019/02/13 Javascript
微信小程序实现滚动加载更多的代码
2019/12/06 Javascript
布同自制Python函数帮助查询小工具
2011/03/13 Python
解决windows下Sublime Text 2 运行 PyQt 不显示的方法分享
2014/06/18 Python
python实现井字棋游戏
2020/03/30 Python
Python检测网站链接是否已存在
2016/04/07 Python
python解析基于xml格式的日志文件
2017/02/25 Python
Expected conditions模块使用方法汇总代码解析
2020/08/13 Python
实例讲解CSS3中Transform的perspective属性的用法
2016/04/22 HTML / CSS
Sam’s Club山姆会员商店:沃尔玛旗下高端会员制商店
2017/01/16 全球购物
房产销售经理职责
2013/12/20 职场文书
淘宝客服自我总结鉴定
2014/01/25 职场文书
公司门卫岗位职责范本
2014/07/08 职场文书
2014年信息宣传工作总结
2014/12/18 职场文书
幼儿园教师个人总结
2015/02/05 职场文书
Redis Stream类型的使用详解
2021/11/11 Redis