首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

用 jest 单元测试改善老旧的 Backbone.js 项目

当然,采用 ES6语法 和 babel 并非一定必要,AMD 也是可以实现测试的。 Backbone.js ?...其主要功能模块包括: Events:提供一系列事件的绑定和触发等功能 Model: 对数据或状态的转化、校验、计算派生值、提供访问控制等,也负责数据的远程同步等,并有事件触发机制;作用类似于 MobX...、绑定事件等的视图组件 在我们的实际项目中,视图层同时支持了 Backbone.View 和早期的 react@13,这也正体现了其灵活之处。...Backbone 中的请求,包括 Backbone.sync / model.fetch() 等, 本质上还是调用的 jQuery 中的 $.ajax 方法(默认情况下),也就是传统的 xhr 方式,使用...$el.find('.multi').length).toEqual(0); }); 对方法调用的测试 自然还是用 sinon 来做: it('应正确响应事件回调并加载子模板', function()

3.5K10

提高代码质量——使用Jest和Sinon给已有的代码添加单元测试

现在,我们可以使用单元测试来提高自己的代码质量。下面,我将自己在使用Jest和Sinon.js配置和编写单元测试中的收获的经验和踩到的坑进行总结,根据从零开始配置和编写单元测试这一条线来进行分享。...Sinon.js是一个用来做独立测试和模拟的JavaScript库。它在单元测试的编写中通常用来模拟HTTP等相关请求。...; 在我的项目中,主要是使用Sinon.js来模拟HTTP请求。...编写单元测试 在本章中,我们会针对如何编写单元测试文件进行一个具体的讲解,其中包含: 同步函数测试 异步函数测试 HTTP测试 同时,我们会对当中使用到的Jest和Sinon.js的API会进行简单介绍...,如果需要使用其他的API,可以自行阅读Jest和Sinon.js的文档。

3.8K00
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    欧盟官员或已被以色列飞马间谍软件盯上

    目前尚不清楚是谁是间谍软件的使用者,以及在攻击中泄露了哪些信息。 NSO公司近日在一份声明中对路透社表示,公司方面不对这些黑客行为负责,并补充说道,“NSO的工具不可能被用于攻击行为”。...然而,在苹果公司2021年 11 月通报的几起由国家政府支持的攻击事件中,有证据显示NSO公司卷入了其中。同月,苹果对NSO提起诉讼,要求法院发布禁令,禁止该公司利用其产品和服务发起间谍软件攻击。...公司产品飞马间谍软件通常通过诸如ForcedEntry等复杂的“零点击”(zero-click)漏洞部署,授予其政府和执法者客户对目标设备的完全访问权限,包括个人数据、照片、消息和精确位置等。...2022年2月,欧洲数据保护监督机构(European Data Protection Supervisor)呼吁禁止在本地区开发和使用类似飞马的商业间谍软件,并指出该技术的侵入已经“达到了前所未有的水平...尽管各方正不断规范间谍软件的使用,国际人权组织Front Line Defenders上周发布了一项调查发现,约旦记者与人权捍卫者 Suhair Jaradat 的 iPhone 于 2021 年 12

    23710

    Backbone.js

    Backbone.js 是一个前端 MVC 框架,model 能够绑定键值对和自定义事件,集合具备可枚举方法的富 API,视图具备事件处理能力,并且可以通过 RESTful 的 JSON 接口和你已有的...View Backbone 里的视图就是用来反映数据模型的,可以监听事件并响应,通过利用 Underscore.js(这个真是一个牛逼哄哄的东西,自己看),还支持了 JavaScript 模板技术,把数据和模板分离开...: “click input[type=button]”: “doSearch”; 对于模板的使用,先定义这个模板: 事件绑定的写法(看下面的 bind 方法的调用)和属性校验的写法(validate 方法): Person = Backbone.Model.extend({ // If you return...在创建好所有的 router 之后,一定要调用一下 Backbone.history.start() 方法来 route 你的 URL。

    95520

    Backbone事件模块及其用法

    示例3:使用on方法获取属性修改前的值 在使用on方法绑定change和change属性事件时,还可以通过回调函数中的model对象获取属性修改前的所有值,如下所示: model.previous('attrName...绑定的格式有两种,第一种为各个事件使用空格隔开,格式如下: obj.on(“eventName1 eventName2”, function) 其中,使用空格隔开的参数eventName1 和 eventName2..., function, [context]) 示例1:使用off方法移出对象的某个或多个绑定事件 在Backbone中,如果要移除对象的某个绑定事件,可以调用对象的off方法,指定需要移除的事件名称...;原文参见:这里 ##四 理解Backbone中的bind和bindAll 在Backbone.js的学习过程中,已经有了on方法绑定;后面又新增了ListenTo监听;而又有bind绑定方法。...参见文章:理解 backbone.js 中的 bind 和 bindAll 方法 参见原文:Understanding bind and bindAll in Backbone.js 1, 首先说熟悉的

    2.5K50

    新发现的零点击iPhone漏洞被NSO间谍软件利用

    随后学术研究实验室向苹果报告并提供了调查该漏洞所需的取证工具,并表示没有证据表明使用最新版本iOS的苹果客户会受到HOMAGE攻击。...据Citizen Lab主任Ron Deibert称,Citizen Lab也向英国政府报告了英国官方网络中的多起疑似Pegasus间谍软件感染事件。...其中不但首相办公室官员设备上的感染与Pegasus间谍软件有关,而且针对英国外交和联邦事务部有关的袭击也可能和阿联酋、印度、塞浦路斯等有关。...欧洲议会正在成立一个调查委员会(将于4 月19 日举行第一次会议),以调查因使用NSO Pegasus间谍软件和同类型间谍软件等而违反欧盟法律的行为。...参考来源 https://www.bleepingcomputer.com/news/security/newly-found-zero-click-iphone-exploit-used-in-nso-spyware-attacks

    61010

    如何模拟一个XMLHttpRequest请求用于单元测试——nise源码阅读与分析

    目前,有许许多多的测试框架都提供了模拟HTTP请求相关的一些流程功能,我们在这边文章中将会讲到的,就是我们在上一篇关于单元测试的博客提高代码质量——使用Jest和Sinon给已有的代码添加单元测试中提到的...它是Sinon.js的一部分,用来处理HTTP相关测试问题。 该库提供了替换原生的XHR对象和Server相关的接口,但是我们在本文中只介绍关于XHR部分,也就是浏览器中的XHR对象的替换。...: FakeXMLHttpRequest, // XHR对象构造函数 useFakeXMLHttpRequest: useFakeXMLHttpRequest //调用后,使用fake XHR对象替换全局...,并返回一个带有restore方法的fake XHR对象构造函数 }; 我们在使用时,只需调用userFakeXMLHttpRequest方法,即可将原生的XHR对象替换成nise提供的XHR对象。...附录 Sinon.js nise 我folk的nise

    2.5K10

    JavaScript 中至关重要的 Bind

    当我们在一个方法中用到了 this, 而这个方法调用于一个接收器对象, 我们会需要使用到 bind() 方法; 在这种情况下, 由于 this 不一定完全如我们所期待的绑定在目标对象上, 程序有时便会出错...$("input").val(this.data[randomNum].name + " " + this.data[randomNum].age); } } // 给点击事件添加一个事件处理器...在 JavaScript 中这种问题比较常见, JavaScript 框架中例如 Backbone.js, jQuery 都自动为我们做好了绑定的工作, 所以在使用时 this 总是可以绑定到我们所期望的那个对象上...// 将通过 bind 传递的参数和调用时传递的参数进行合并, 并作为最终的参数传递 aArgs.concat(Array.prototype.slice.call...正如在之后的 Apply 和 Call 方法 章节我们会介绍, 借用函数的最佳实践应该是使用 Apply 或者 Call 方法.

    54730

    一些前端框架的比较(上)——GWT、AngularJS 和 Backbone.js

    因为许多项目大量的时间都会被花在问题定位和一些困难需求或者奇葩功能的实现上面,很可能不得不使用 JSNI 去写 JavaScript,碰到 JSNI 和 Java 互相调用的 case,就更讨厌。...但是 AngularJS 把和 Controller 之间的绑定用属性的形式固定在 DOM 上了(属性 ng-controller),甚至把 Controller 上面方法的调用也用属性的形式固定在 DOM...但是 Backbone.js 说了,它的 Controller 是 Router,那好吧……)写着写着,有一种只手遮天的感觉——什么东西它都知道,它都管,包括初始化、模板渲染、DOM 操纵、事件响应、绑定等等...中的 events 中还是绑定事件来监听,这些不同组件(层)之间的消息互通,实现都是类似的——而对于程序员来说,这可是一大块工作,不但枯燥和令人沮丧,还容易出错。...选择了 Backbone.js 还迫切需要双向绑定的,可以使用第三方的库,比如 Epoxy.js,不过这不在今天的讨论范围内。

    1.9K10

    深度解析 Vue MVVM 原理实现

    使用代码来理解之间的关系: 使用jQuery来操作DOM元素,添加一个button按钮,并绑定click事件 if(Btn){ let btn = $('点我'...,负责视图的 HTML 代码和负责业务逻辑的 JS 代码耦合到一起,这是个很严重的问题 如果我们直接操作DOM元素,会造成性能低下等一系列问题 如果使用Vue的话,可以将视图层和模型层有效地分离开来...实现数据绑定的做法有大致如下几种: 脏值检查(angular.js) 数据劫持(vue.js) 发布者-订阅者模式(backbone.js) 这里大致说下脏值检查: angular.js 是通过脏值检测的方式比对数据是否有变更...,来决定是否更新视图,最简单的方式就是通过 setInterval() 定时轮询检测数据变动,angular只有在指定的事件触发时进入脏值检测,大致如下: DOM事件,譬如用户输入文本,点击按钮等。...( ng-click ) XHR响应事件 ( $http ) 浏览器Location变更事件 ( $location ) Timer事件( $timeout , $interval ) 执行 $

    1.5K20

    1.初识backbone.js

    backbone.js提供了一套web开发的框架,通过Models进行key-value绑定及custom事件处理,通过Collections提供一套丰富的API用于枚举功能,通过Views来进行事件处理及与现有的...更重要的是它能够优雅的把原本无逻辑的javascript代码进行组织,并且提供数据和逻辑相互分离的方法,减少代码开发过程中的数据和逻辑混乱。...上面是一个简单的介绍,关于backbone我看完他的介绍和简单的教程之后,第一印象是它为前端开发制定了一套自己的规则,在这个规则下,我们可以像使用django组织python代码一样的组织js代码,它很优雅...在查backbone资料的时候,发现没有很系统的中文入门资料和更多的实例,所以我打算自己边学边写,争取能让大家通过一系列文章能快速的用上backbone.js。...当然,除了我自己分析的应用范围之外,在backbone的文档上看到了很多使用它的外国站点,有很多,说明backbone还是很易用的。

    91220

    探索从 MVC 到 MVVM + Flux 架构模式的转变

    但是 MVC 架构是好东西,其对数据、视图、逻辑有了清晰的分工,于是前端 MVC 框架(比如 backbone.js) 出来了,对于很多业务规模不大的场景,前端 MVC 框架已经够用了,它也能做到前后端分离开发单页面应用...拿 backbone.js 说,它的 Model 对外暴露了 set 方法,也就是说可以在不止一个 View 里修改同个 Model 的数据,然后一个 Model 的数据同时对应多个 View 的呈现,...从 Flux 的源码中可以看出 Dispacher.js 是其的核心文件,其核心是基于事件的发布/订阅模式完成的,核心源码如下: class Dispatcher { ... // 注册回调函数...CommentStore.getComment() 的能力,所以再次引用事件发布/订阅模式,这次使用了 Node.js 提供的 events 模块,对 commentStore.js 文件进行修改,修改后代码如下...但是使用 Flux 有什么缺点呢?在下篇 《聊聊 Redux 架构模式》中会进行分析,下回见。

    1.5K50

    前端架构101:MVC的不足与Flux的崛起

    正文从这开始~~ MVC 的不足 事件 在前几篇中,我演示了一个前端 Backbone.js MVC 框架用于解决实际问题的例子。...;对于消费方而言,也并不希望一视同仁的响应所有的事件 你可能会认为事件机制存在的问题是否只存在于 Backbone.js 中,那 AngularJS 这个 MVC 框架会不会好一些呢?...实现的例子,无论是 view 文件还是 controller 文件,其它们的职责并不明确,他们同时在负责好几件事情: 管理 view model,例如负责保存和清空用户输入的值 协调用户流程,例如首先将用户输入值清空...事件机制依然是我们许多问题里可选的解决方案之一;Backbone.js 和 AngularJS 放在现在看也依然是优秀的解决框架,但不是最优解而已。...如果你现在站在开发 React 应用的体验上看 Backbone.js 和 AngularJS 的开发体验,你会感觉框架带来的约束是松散的。

    1.4K20

    AngularDart 4.0 高级-生命周期钩子 顶

    取消订阅observables并分离事件处理程序以避免内存泄漏。 在Angular摧毁指令/组件之前调用。 其他生命周期挂钩 其他Angular子系统除了这些组件钩子可能有自己的生命周期钩子。...刺探OnInit和OnDestroy 使用这两个间谍钩进行卧底探索,以发现元素何时被初始化或销毁。 这是指令的完美渗透工作。 英雄们永远不会知道他们正在被监视。...一边开玩笑,注意两点: Angular为指令和组件调用钩子方法。 间谍指令可以提供对不能直接更改的DOM对象的洞察。 显然,你不能触摸本地div的实现。 您也不能修改第三方组件。...间谍的ngOnInit记录该事件。 重置按钮清除英雄列表。 Angular从DOM中移除所有英雄元素并同时销毁他们的间谍指令。 间谍的ngOnDestroy方法报告其最后时刻。...取消订阅observables和DOM事件。 停止间隔定时器。 取消注册此指令在全局或应用服务中注册的所有回调。 如果你忽视这样做,你会冒内存泄漏的风险。

    6.2K10

    一些前端框架的比较(下)——Ember.js 和 React

    属性绑定是另一个和 Backbone.js 比强化了的地方,依然遵照 CoC 的原则,如果属性以 Binding 结尾,绑定属性就自动创建,而计算属性则(方法的输出和某些属性之间的依赖关系)使用 property...事件方面使用 observes 方法并传入属性名来建立监听,其实和 Backbone.js 是差不多的。...我拿它不知不觉地和 Backbone.js 比较,最初还是因为 API 长得像的关系,后来才知道,其实这并不奇怪,因为核心开发人员 Tom Dale 说,灵感就是来自于 Cocoa、RoR 和 Backbone.js...说到状态,React 引入的状态机机制,即通过事件监听来更新状态(setState),从而自动调用 render 来渲染组件的方式,也实现了绑定。...,没有表现力,啰嗦无比; Backbone.js 说其实还是把有限的精力放到解决从 RESTful API 的调用到 view 的模型生成这一个流程上比较靠谱; Ember.js 说太幼稚,世界是你们的

    2.3K20

    纽约时报记者的手机两次被NSO Group的Pegasus间谍软件感染

    美国《纽约时报》记者本·哈伯德(Ben Hubbard)24日在该报网站上发文表示,自己的iphone手机曾两度被以色列技术公司NSO Group 的 Pegasus 间谍软件入侵感染。...来自多伦多大学的公民实验室研究小组记录了这些袭击事件,调查显示,入侵时间发生在2020年7月12日和2021年6月13日,这期间哈伯德正根据自己此前对沙特阿拉伯方面的采访报道,撰写一本关于沙特王储穆罕默德...NSO官方宣称自己向经过审查的政府机构和执法部门出售包括Pegasus在内的软件,以打击恐怖主义和毒品走私等非法活动,但近来,Pegasus被更多地用来入侵媒体记者及社会活动家。...公民实验室的研究人员在他们的调查结果摘要中写道:“Pegasus 间谍软件被广泛地用以入侵记者,对全球新闻自由构成了直接威胁,并导致调查性新闻进一步受挫。”.../hacking-nso-surveillance.html https://www.businessinsider.com/nyt-reporters-phone-hacked-with-zero-click-tool

    56320
    领券