虽然测试js代码很恶心;但是要测试,特别是写很多js的时候;
在一个项目中,使用jasmine来测试我们一个需要很多很多js代码的页面;对于那个页面,我都觉得都已经写了一个Js的UI了。。。。当初没有用现成的JS UI框架,真是失误啊~
Jasmine is a behavior-driven development framework for testing your JavaScript code. It does not depend on any other JavaScript frameworks. It does not require a DOM. And it has a clean, obvious syntax so that you can easily write tests.
这是jasmine的介绍;
项目链接:http://pivotal.github.com/jasmine/index.html
测试代码结构是:
describe("Jasmine", function() {
it("makes testing JavaScript awesome!", function() {
expect(yourCode).toBeLotsBetter();
});
});
很有rspec的风格;开始用它(Rails3);
第一步:
把
gem "jasmine"
添加到项目的特定环境组里;
然后运行
$ bundle install
$ bundle exec jasmine init
上面第二行是初始化 jasmine,他会在项目目录底下产生一些测试例子,供我们参考:
在 public/javascripts/中产生 player和song的js文件。
在spec/中产生 javascripts 文件夹,里面有一些测试例子;
我们写的测试代码就是放在这个文件夹底下;
第二步:
运行
rake jasmine
然后点击打开http://localhost:8888可以查看自动生成的测试代码运行的结果
第三步:
配置文件在 spec/javascripts/suport/jasmine.yml
可以在里面配置包含要测试的目标js文件,css文件,测试文件存放目录等一些配置;
在spec/javascripts/helpers/里面我们可以自定义一些matcher的方法,比如里面自动产生的示例:toBePlaying方法;
第四步:开始编写测试代码;下面贡献一个我的例子:
js的功能代码
function matchFail_user(it){
$(it).next().val('');
var n = $(it).parent().next();
while(n.attr("class") == 'auto_clean'){
wipe_clean([n.children("input:first").attr('id')]);
n = n.next();
}
}
js功能的测试代码:
describe('matchFail_user',function(){
afterEach(function (){
$("#workspace").remove();
});
it('set project hidden empty and wipe clean current row', function() {
$("body").append("<div id='workspace'></div>");
workspace = $("#workspace");
workspace.html("<tr><td><input id='log_entry_1_log_time'></input><input type='text' value='stud' id='projects_iterations_1'></input><input id='project_hidden' type='hidden' value='58'></input></td><td class='auto_clean'><input id='child' type='text' value='king' /></td></tr>");
bind_autocomplete('child', {});
project = $("#projects_iterations_1").get();
project_hidden = $("#projects_iterations_1").next();
spyOn(window,"wipe_clean");
matchFail_user(project)
expect(project_hidden.val()).toEqual("");
expect(window.wipe_clean).toHaveBeenCalledWith([$(project).parent().next().children("input:first").attr('id')]);
});
});
Jasmine Spies are test doubles that can act as stubs, spies, fakes or when used in an expecation, mocks.
在这个jasmine里面的spy很经常用,比如可以如下使用:
var Klass = function () {
};
Klass.staticMethod = function (arg) {
return arg;
};
Klass.prototype.method = function (arg) {
return arg;
};
Klass.prototype.methodWithCallback = function (callback) {
return callback('foo');
};
...
describe("spy behavior", function() {
it('should spy on a static method of Klass', function() {
spyOn(Klass, 'staticMethod');
//创建一个监视Klass.staticMethod的监视器,理论上这个是不会有返回值的,因为被拦截了,它可以使用 spyOn(Klass, 'staticMethod').andReturn("result")的方法替它返回结果,也有类似的比如andCallThrough之类的方法来真正实现这个功能;
Klass.staticMethod('foo argument');
expect(Klass.staticMethod).toHaveBeenCalledWith('foo argument');
});
it('should spy on an instance method of a Klass', function() {
var obj = new Klass();
spyOn(obj, 'method');
obj.method('foo argument');
expect(obj.method).toHaveBeenCalledWith('foo argument');
var obj2 = new Klass();
spyOn(obj2, 'method');
expect(obj2.method).not.toHaveBeenCalled();
});
it('should spy on Klass#methodWithCallback', function() {
var callback = jasmine.createSpy();
new Klass().methodWithCallback(callback);
expect(callback).toHaveBeenCalledWith('foo');
});
});
虽然测试js很恶心,但也要测,终于写完了这些测试。。。。可以继续研究Android啦~
分享到:
相关推荐
konacha, 使用 mocha 测试框架和链断言库测试应用程序的Rails JavaScript Konacha Konacha ( [koh-NAH-cha],绿茶的一种) 是一个支持你使用 mocha 插件测试框架和链断言库测试你的JavaScript的Rails 引擎。...
Jasmine 测试示例###Description 一个简单的 rails post 创建应用程序,它使用 Jasmine 进行 javascript(coffeescript) 测试。 这个 repo 紧跟 RailsCast #261。 -###设置 git clone ...
Teaspoon的目标是易于使用,同时为Rails提供最完整的Javascript测试解决方案。 Teaspoon利用了Rails资产管道,并附带了对Jasmine,Mocha和QUnit的支持。 如果您想将Teaspoon与一起使用,请查看项目。 或者,如果...
rails添加到您的Gemfile中group :test, :development do gem 'jasmine-rails'end下一个: $ bundle install最后,运行Rails生成器: $ rails generate jasmine_rails:install生成器将创建必要的配置文件,并将测试...
使用Babel.js进行JavaScript转换(带有Browserify的ES6模块支持) 使用Sass生成样式表 缓存爆裂的资产用于生产 使用车把进行模板编译 用JSHint进行ES6整理 使用QUnit和Phantom.js进行测试 使用testem进行测试 所有...
这个例子展示了如何在不使用 Grunt 或 Gulp 的情况下为单元测试配置 Karma 和 Jasmine。 这里包括以下内容: 一个 package.json 文件,指定用于运行 Karma 和 Jasmine 的 NodeJS 库。 Karma 配置文件示例:karma....
Your Ruby on Rails ...This new edition has been updated to Rails 5.2 and RSpec 3.7 and contains full coverage of new Rails features, including system tests and the Webpack-based JavaScript setup.
水豚::茉莉花 ... 将此添加到您的Rakefile (或在lib/tasks/capybara_jasmine.rake Rakefile下的 Rails 中,例如): # Load the library require 'capybara-jasmine' # In this case, I want to use webkit
是一个很棒的3D javascript库,可轻松在浏览器中使用WebGL(即3D对象)进行播放。 请参阅。 这个gem将通过资产管道将threejs r89添加到您的Rails应用程序中: 安装 将此行添加到您的应用程序的Gemfile中: gem '...
带有linters的Full Rails + Javascript测试套件(RSpec,Jasmine,Rubocop,JSHint) 完整的持续集成和持续部署配置(Github,Travis CI,Heroku) 连续测试环境 电子邮件设定 各种第三方集成(NewRelic,Honey...
Ruby Gem是一个帮助程序代码包,用于为基于Ruby的Web项目(Rails,Sinatra等)或在Ruby是受欢迎的合作伙伴JavaScript项目中开发Jasmine项目。 它在浏览器中提供了项目的Jasmine套件,因此您可以专注于代码,而无需...
使用框架构建应用程序,包括:Rails、Django、AngularJS、ExpressJS、Sinatra、Flask 喜欢测试,适合:RSpec、Capybara、Selenium(ruby/js/python 绑定)、unittest、nose、Jasmine、Mocha、Karma、Protractor 和...
ERD:即将到来…… 线框: : 技术:Ruby、Ruby on rails、Javascript、Jquery、AJAX、Devise、Bootstrap、Paperclip、Capybara、Turbolinks、Postgresql、Selenium-Webdriver、Jasmine-rails、Rack-livereload、rb-...