`
othella
  • 浏览: 83760 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
社区版块
存档分类
最新评论

用于前端行为测试的JsMock

阅读更多
JsMock用于测试行为,接口的交互测试。
JsMock的地址: http://jsmock.sourceforge.net/

先看个官网上的最简单的例子

function Worker() {
	this.getValue = function() { /* ... */}
	this.isFinished = function() {/* ... */}
}
//Fixture
function doWork(worker) {
	if(worker.isFinished()) {
		return worker.getValue();
	} else {
		return null;
	}
}
//Tests
function test_doWork() {
	//1. Create a mockControl object
	var mockControl = new MockControl(),
		//2. Use mockConrol create a mock object for the Class
		workerMock = mockControl.createMock(Worker);
	//3. Set the expects for methods of the Class
	workerMock.expects().isFinished().andReturn(true);
	workerMock.expects().getValue().andReturn('hello');
	//4. Use mock as the instance of the Class, run it.
	var result = doWork(workerMock);
	
	//assertEquals('hello', result);
	
	//5. verify the test
	mockControl.verify();
}

function test_doWork_null() {
	var mockControl = new MockControl();
	workerMock = mockControl.createMock(Worker);

	workerMock.expects().isFinished().andReturn(false);

	var result = doWork(workerMock);
	
	<span class="comment">//assertNull(result);</span>
	mockControl.verify();
}

大概的流程如图:


JsMock功能简单却很实用。关键是看你如何运用。首先前端开发人员要有意识的做到UI/Logic分层。让UI部分的code仅仅只做UI显示用。任何逻辑相关的代码可以分离出来。目前前端UI测试没有好的工具,只能靠人肉。但是逻辑部分的code我们完全可以做好单元测试。利用JsUnit和JsMock做状态,行为测试。保证我们的代码质量。

JsMock的方法:
  • createMock(Object2Mock) - Create the mock object
  • andReturn(value) - Set the return value on one method for some control logic's test
  • andThrow(throwMsg) - Let the method throw a exception you set
  • andStub(block) - The parameter should be a function. You can use it to get the arguments of the method
  • addMockMethod(method) - Add extra method into mock object
  • reset() - Clear the excepts
  • verify() - Verify the test


再来贴下JsMock的部分源码:

	/**
	 * Create the mock for object/class
	 * @param objectToMock object/function
	 * @return mock object
	 */
	createMock: function(objectToMock) {
		var mock = {
			calls: [],
			expects: function() {
				this.__recording = true;
				return this;
			},
			__recording: false
		};
		mock.expect = mock.expects;
		
		if(objectToMock != null) {
			//if the param is a function - a Class
			if( typeof(objectToMock) == 'function' ) {
				//create methods for class's static methods.
				this.__createMethods(objectToMock, mock);
				//new an instance of the class, and create methods for it
				this.__createMethods(new objectToMock(), mock);
			} else if( typeof(objectToMock) == 'object') {
				//if the param is an object, creat methods for it
				this.__createMethods(objectToMock, mock);
			} else {
				throw new Error("Cannot mock out a " + typeof(objectToMock));
			}
			
		}
		
		var self = this;
		//add addMockMethod into mock object
		mock.addMockMethod = function(method) {
			self.__createMethod(self, mock, method);
		};
		
		return mock;
	}
.....

/**
	 * @private create methods of the object/class into mock
	 * @param object - the object you want to mock it
	 * @param mock - the target mock object
	 */
	__createMethods: function(object, mock) {
		for( property in object ) {
			//if the property is a public method, create method into mock
			if( this.__isPublicMethod(object, property) ) {
				this.__createMethod( this, mock, property );
			}
		}
	},
	/**
	 * @private create the method into mock
	 * @param control - mockControl object
	 * @param mock - the target mock object
	 * @param method - the method need add into mock object
	 */
	__createMethod: function(control, mock, method) {
		//create the property of mock for the method
		mock[method] = function() {
			//If you call expect() first, the __recording value is true
			if( mock.__recording ) {// expect
				control.__lastMock = mock;
				control.__lastCallName = method;
				//add this method into expected calls
				control.__expectationMatcher.addExpectedMethodCall( mock, method, arguments );
				//clear the flag
				mock.__recording = false;
				//return the control object
				return control;
			} else {// If it's real call
				//add this method into actual calls
				control.__expectationMatcher.addActualMethodCall( mock, method, arguments );
				//read mock calls to get the array under the method
				if( mock.calls[method] != null) {
					//get the latest value, popup
					returnValue = mock.calls[method].shift();
					//If the value is a function, apply it
					if( typeof(returnValue) == 'function') {
						return returnValue.apply(this, arguments);
					}
				}
			}
		};
	}


今天我给同事分享了这个,有人问我能否用JsMock模拟Ajax call的数据。我觉得可以定义一个测试用的Ajax类。加上用setInterval/setTimeout来模拟异步call的特性。关键看你自己如何运用。

我个人觉得JsMock非常的实用。
1. 节省时间
2. 保证代码质量
3. 不会被别人block住

这里有人会说要写额外的代码,怎么叫节省时间。可能你在写这些代码的时候是花了时间。但是比起后面要花在跟别人接口整合,和调试问题的时间,这点时间完全是值得的。

保证代码质量这块就不多说了。这是所有测试的目标。你可以写尽可能多的测试case,保证你的代码质量。

Mock即模拟的意思。即使在你开发时候你所依赖的接口还没有好,你可以把对象Mock起来,用andReturn/andThrow等方法来控制返回结果,控制你自己代码的行为。

在以后的代码我会尽量按照这个方向来的。
  • 大小: 36.9 KB
分享到:
评论
1 楼 cuixiping 2010-12-21  
这个东西不错。
最近很少更新啊

相关推荐

    JSMock-开源

    4. **验证结果**:测试执行后,通过 JSMock 的验证功能检查模拟对象的行为是否符合预期。 5. **清理**:测试结束后,记得清理模拟对象,恢复正常的代码执行环境。 ### 开源优势 作为一个开源项目,JSMock 的源...

    node-mockit:模拟HTTP API使用Node.js

    另,如果有诸如开发的API之类,可以在不部署测试服务器的情况下,将配置好的脚本发给合作方,用于辅助接口接入使用。##使用方法安装nodejs (必须)安装node-mockitsudo npm install -g或者sudo npm install node-...

    myMock:基于node.js、express框架 开发的模拟数据 基于 开发的模拟数据

    mock基于、框架 开发的模拟数据基于 开发的模拟数据技术栈node.jsmock.jsexpress (node.js框架)目录结构├── logStyle // 控制台打印的样式├── mock // mock.js├── public // 公用的├── .gitignore // ...

    【大数据课设】p105出租车数据可视化分析-大数据-实训大作业.zip

    项目资源包含:可运行源码+数据集+文档 python + numpy, pandas, matplotlib, pyecharts, wordcloud 适用人群:学习不同技术领域的小白或进阶学习者;可作为课程设计、大作业、工程实训或初期项目立项。 数据来源:数据集taxis.csv从网络下载 数据清洗:异常值与缺失值的处理:有一些数据distance(乘车距离)为零而且上下车地点为空,还有些一些数据的payment(支付方式)为空。 数据预处理:将列名更改成中文 标准化与归一化: 数据分析: 数据可视化:

    TypeScript 入门教程

    TypeScript 入门教程

    人脸识别_课堂考勤_OpenCV_服务端系统_1741777828.zip

    人脸识别项目实战

    历届电赛试题及综合测评(真题+模拟题)

    本资源汇总了 历届全国电子设计竞赛(电赛)真题+模拟题,涵盖 电路设计、嵌入式系统、信号处理、自动控制等核心考点,并提供详细解析及综合测评,帮助参赛者高效备赛、查漏补缺、提升实战能力。 适用人群: 适合 准备参加电子设计竞赛的大学生、电赛爱好者、电子信息类相关专业的学生,以及希望提高电子设计和电路分析能力的工程师。 能学到什么: 电赛考察重点:熟悉往届竞赛的命题方向及考核重点。 电路设计与仿真:提升模拟电路、数字电路、单片机等核心技能。 问题分析与解决能力:通过综合测评找到薄弱点并针对性提升。 实战经验:掌握竞赛策略,提高应试效率和设计能力。 阅读建议: 建议先 通读真题,了解题型与解题思路,然后 结合模拟题实战演练,查找不足并通过测评强化练习,逐步提升竞赛能力。

    2024人工智能如何塑造未来产业:AI对各行业组织带来的的变革研究研究报告.pdf

    2024人工智能如何塑造未来产业:AI对各行业组织带来的的变革研究研究报告.pdf

    人脸识别_Golang_SDK_命令行登录_微信小程序应用_1741772240.zip

    人脸识别项目源码实战

    Vulkan原理与实战课程

    给大家分享一套课程——Vulkan原理与实战课程

    SiriYXR_Sokoban11_1741860914.zip

    c语言学习

    海豚鲸鱼数据集 5435张图 正确识别率可达92.6% 可识别:海豚 虎鲸 蜥蜴 海豹 鲨鱼 龟 支持yolov8格式标注

    海豚鲸鱼数据集 5435张图 正确识别率可达92.6% 可识别:海豚 虎鲸 蜥蜴 海豹 鲨鱼 龟 支持yolov8格式标注

    答谢中书书教学设计.docx

    答谢中书书教学设计.docx

    人脸识别_环境搭建_dlib_face_recognitio_1741771308.zip

    人脸识别项目源码实战

    网络技术_Web服务器_C语言_学习交流版_1741863251.zip

    c语言学习

    安卓开发_Gradle配置_React_Native_Meg_1741777287.zip

    人脸识别项目源码实战

    人工智能_深度学习_图像识别_UI界面_项目展示.zip

    人脸识别项目实战

    基于Springboot框架的美发门店管理系统的设计与实现(Java项目编程实战+完整源码+毕设文档+sql文件+学习练手好项目).zip

    本美发门店管理系统有管理员和用户两个角色。用户功能有项目预定管理,产品购买管理,会员充值管理,余额查询管理。管理员功能有个人中心,用户管理,美容项目管理,项目类型管理,项目预定管理,产品库存管理,产品购买管理,产品入库管理,会员卡管理,会员充值管理,余额查询管理,产品类型管理,系统管理等。因而具有一定的实用性。 本站是一个B/S模式系统,采用SSM框架,MYSQL数据库设计开发,充分保证系统的稳定性。系统具有界面清晰、操作简单,功能齐全的特点,使得美发门店管理系统管理工作系统化、规范化。本系统的使用使管理人员从繁重的工作中解脱出来,实现无纸化办公,能够有效的提高美发门店管理系统管理效率。 关键词:美发门店管理系统;SSM框架;MYSQL数据库;Spring Boot 1系统概述 1 1.1 研究背景 1 1.2研究目的 1 1.3系统设计思想 1 2相关技术 2 2.1 MYSQL数据库 2 2.2 B/S结构 3 2.3 Spring Boot框架简介 4 3系统分析 4 3.1可行性分析 4 3.1.1技术可行性 4 3.1.2经济可行性 5 3.1.3操作可行性 5 3.2系

    Python实现基于SSA-CNN-GRU麻雀算法优化卷积门控循环单元数据分类预测的详细项目实例(含完整的程序,GUI设计和代码详解)

    内容概要:本文档介绍了基于SSA-CNN-GRU麻雀算法优化卷积门控循环单元数据分类预测的详细项目实例,重点讲述了该项目的背景、目标、挑战与解决方案、技术特点、应用领域等方面的内容。文档详细记录了从项目启动、数据预处理、算法设计(SSA优化CNN-GRU模型)、构建与评估模型到实现美观的GUI界面整个过程,并讨论了防止过拟合的技术如正则化、早停和超参数优化。另外还涵盖了项目扩展的可能性、部署和应用策略、需要注意的地方以及未来改进的方向。全文强调了模型的泛化能力和计算效率,展示了该混合算法模型在实际应用中的优越性能。 适合人群:具备一定的Python编程经验及机器学习基础知识的研究人员和技术人员;对深度学习、智能优化算法及实际应用感兴趣的学者和从业者;寻求提升数据分析和预测准确性的金融分析师、数据科学家等相关专业人士。 使用场景及目标:本文档非常适合用作学习和参考资料,以掌握如何将SSA、CNN与GRU三种先进技术结合起来进行复杂的分类和预测问题求解。具体应用场景包括但不限于以下几个方面:金融领域——股票价格预测;医疗保健领域——辅助诊断;工业制造——预防性维护;智能家居——个性化服务;以及其他涉及到时序数据分析和多模态数据处理的场合。文档既包含了理论知识又提供了完整的源代码示例,可以帮助读者理解算法原理并通过实践中加深对其的认识。 其他说明:该项目不仅仅是关于算法的设计实现,更是有关于系统的整体架构规划以及工程上的考量,比如环境准备(确保环境洁净、必要包的安装等)、数据准备、GPU配置支持等等。同时文中给出了详细的代码片段,方便开发者理解和复现实验成果。值得注意的是,虽然文中提供了一套通用解决方案,但在真实场景下还需要针对性的调整参数或修改网络结构来达到最好的性能效果。此外,对于追求更高的预测精度或解决更大规模的问题,作者建议进一步探索深度强化学习等高级技术和多任务学习策略,并且考虑使用增量学习让模型能够适应新数据而不必重新训练整个模型。最后提到安全性和隐私保护也是项目实施过程中的重要因素,要妥善保管用户的敏感信息并且做到合法合规地收集和使用数据。

    人脸识别_T形分布_Gabor变换_特征提取_增强鲁棒性_1741777397.zip

    人脸识别项目实战

Global site tag (gtag.js) - Google Analytics