单元测试 – 用Sinon,Mocha,Enzyme和React模拟窗口
发布时间:2020-12-15 20:50:58 所属栏目:百科 来源:网络整理
导读:我正在尝试使用上面列出的四个库来模拟我正在使用的组件的窗口对象. 我知道可以使用JSDom完成,但客户端反对使用它.根据我的研究,简单地做sinon.stub(窗口,’位置’)应该工作,但是当我运行我的测试时,我仍然在我的组件中得到Window undefined. 目前,在render
我正在尝试使用上面列出的四个库来模拟我正在使用的组件的窗口对象.
我知道可以使用JSDom完成,但客户端反对使用它.根据我的研究,简单地做sinon.stub(窗口,’位置’)应该工作,但是当我运行我的测试时,我仍然在我的组件中得到Window undefined. 目前,在render return {window.location.host}中调用该组件 我想做什么错误的任何想法,让sinon剔除那件作品.一旦我删除了那一块,那么我就可以专注于测试那个与窗口无关的组件的其他部分. 我的测试方法: import React from 'react'; import { shallow } from 'enzyme'; import chai from 'chai'; chai.should(); import sinon from 'sinon'; import BillingStatementRow from '../BillingStatementRow'; describe('Test <BillingStatementRow /> Component',function() { context('Function Testing',function() { it('Test - onFieldChange - Make sure it handles NaN',function() { var e = {target: {value: NaN}}; var window = { location : { host : "..." } }; var mockedOnChange = sinon.spy(); const wrapper = shallow ( <BillingStatementRow slds={''} key={'1'} Id={'1'} inputValue={'0'} salesInvoice={'SIN0001'} invoicedAmount={1000} duedate={'1461628800000'} outstandingBalance={1000} receiptRemaining={1000} amountAllocated={1000} onChange={mockedOnChange.bind(this,'BS0001')} /> ); wrapper.instance().onFieldChange('amountAllocated',e); wrapper.update(); }) }); });
Sinon存根/间谍/模拟仅适用于函数.在这种情况下,您正在尝试模拟全局(嵌套)变量,而Sinon不是正确的工具.
相反,就像在浏览器中一样,您可以创建一个全局对象来模拟适当数量的窗口来处理组件,这很容易,因为它只访问window.location.host. 因此,在实例化组件之前,请声明以下内容: global.window = { location : { host : 'example.com' } }; (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |