正文 

当前位置： 首页 > 知识 >

如何在 Jasmine 中使用 React 测试工具

     2023-02-21     87

关键词：

【中文标题】如何在 Jasmine 中使用 React 测试工具【英文标题】：How to use React Test Utilities with Jasmine 【发布时间】：2014-03-30 12:53:09 【问题描述】：

我用 React 的测试工具编写了单元测试代码。 但是遇到了问题

我的环境是：

导轨 4 茉莉花2.0.0 主干 1.1.2 
describe("cNotice", function () 
    it("lol", function () 
        console.log(Notice); // present
        console.log(<Notice message="show me the message" />); // return Constructor

        var instance = <Notice message="show me the message" />;
        var component = React.addons.TestUtils.renderIntoDocument(instance);
        expect(component.getDOMNode().childNodes[0].className).toBe('notice');
    );
);

错误信息是：

错误：Invariant Violation: addComponentAsRefTo(...): 只有 ReactOwner 可以有 refs。这通常意味着您正在尝试将 ref 添加到没有所有者的组件（即不是在另一个组件的 render 方法中创建的）。尝试在一个新的***组件中渲染这个组件，该组件将保存 ref。

更新

这段代码没问题：

describe("cNotice", function () 
    var Notice = null;
    beforeEach(function ()  Notice = React.createClass(...); );

    it("lol", function () 
        var instance = <Notice message="show me the message" />;
        var component = React.addons.TestUtils.renderIntoDocument(instance);
        expect(component.getDOMNode().childNodes[0].className).toBe('notice');
    );
);

但我想从外部文件导入通知组件。

【问题讨论】：

【参考方案1】：

已解决

我使用了窗口命名空间。 从外部文件导入通知组件

describe("cNotice", function () 
    it("lol", function () 
        var component = React.addons.TestUtils.renderIntoDocument(window.Notice( message: "show me the message" ));
        expect(component.getDOMNode().childNodes[0].className).toBe('notice');
    );
);

【讨论】：

如何在 Jasmine 测试中测试 $scope？

】如何在Jasmine测试中测试$scope？【英文标题】：Howtotest$scopeinJasminetest?【发布时间】：2016-09-1414:47:20【问题描述】：我尝试使用Jasmine为Angularjs编写单元测试。这是我的控制器：functionHomeController($scope,fav,news,materials)console.log(\'homec... 查看详情

如何在 Angular 中使用 Jasmine 测试 RxJS switchMap？

】如何在Angular中使用Jasmine测试RxJSswitchMap？【英文标题】：HowtotestRxJSswitchMapwithJasmineinAngular?【发布时间】：2022-01-1611:45:10【问题描述】：在我的Angular项目中，我的一个组件中有这段代码：delete(post:PostInterface):voidconstdelete$=this.app... 查看详情

如何在 Jasmine 单元测试中使用 Sinon 对 jQuery 动画进行假时间？

】如何在Jasmine单元测试中使用Sinon对jQuery动画进行假时间？【英文标题】：HowdoIfake-timeajQueryanimationusingSinoninaJasmineunittest?【发布时间】：2011-11-1113:10:27【问题描述】：我有一个1秒的jQuery.animate操作，在页面加载后5秒启动。我在Ja... 查看详情

在 Angular 中使用 Jasmine 使用 *ngIf 指令时，如何对元素是不是可见进行单元测试

】在Angular中使用Jasmine使用*ngIf指令时，如何对元素是不是可见进行单元测试【英文标题】：HowdoIunittestifanelementisvisiblewhenthe*ngIfdirectiveisusedusingJasmineinAngular在Angular中使用Jasmine使用*ngIf指令时，如何对元素是否可见进行单元测试【... 查看详情

在 Nodejs 中使用 Jasmine 测试 promise 是不是被解决或拒绝

】在Nodejs中使用Jasmine测试promise是不是被解决或拒绝【英文标题】：TestifapromiseisresolvedorrejectedwithJasmineinNodejs在Nodejs中使用Jasmine测试promise是否被解决或拒绝【发布时间】：2015-01-2516:21:08【问题描述】：我知道如何在Mocha中做到这... 查看详情

如何在 Visual Studio Code 中使用 Typescript 和 Jasmine 框架编写 Protractor 测试脚本？

】如何在VisualStudioCode中使用Typescript和Jasmine框架编写Protractor测试脚本？【英文标题】：HowtowriteProtractortestscriptsusingTypescriptalongwithJasmineframeworkinVisualstudioCode?【发布时间】：2017-01-1321:07:31【问题描述】：我的项目正在从独立到Web... 查看详情

如何在不使用 Angular 的 spyOn 的情况下检查服务中的方法是不是在 Jasmine 单元测试中被调用？

...在不使用Angular的spyOn的情况下检查服务中的方法是不是在Jasmine单元测试中被调用？【英文标题】：HowtocheckifamethodfromaserviceiscalledornotinJasmineunittestingwithoutusingspyOninAngular?如何在不使用Angular的spyOn的情况下检查服务中的方法是否在J... 查看详情

如何使用 karma/jasmine 在 angularAMD 中模拟服务？

】如何使用karma/jasmine在angularAMD中模拟服务？【英文标题】：HowtomockserviceinangularAMDwithkarma/jasmine?【发布时间】：2014-12-1223:44:13【问题描述】：我有一个使用AngularAMD/RequireJS/Karma/Jasmine的项目，我的基本配置一切正常，大多数单元... 查看详情

如何在 Angular 7 中使用 Karma/Jasmine 为 App_Initializer 编写单元测试用例

】如何在Angular7中使用Karma/Jasmine为App_Initializer编写单元测试用例【英文标题】：howtowriteunittestcasesforApp_InitializerusingKarma/Jasmineinangular7【发布时间】：2019-06-3002:41:22【问题描述】：我已经在我的app.module.ts文件中导入了APP_INITIALIZER... 查看详情

在 Jasmine 单元测试中模拟 AngularJS 模块依赖项

】在Jasmine单元测试中模拟AngularJS模块依赖项【英文标题】：MockingAngularJSmoduledependenciesinJasmineunittests【发布时间】：2013-07-0710:38:36【问题描述】：我试图在一个模块中对控制器代码进行单元测试，该模块将其他模块作为依赖项，... 查看详情

如何模拟在 AngularJS Jasmine 单元测试中返回承诺的服务？

】如何模拟在AngularJSJasmine单元测试中返回承诺的服务？【英文标题】：HowdoImockaservicethatreturnspromiseinAngularJSJasmineunittest?【发布时间】：2014-07-0511:36:08【问题描述】：我有myService使用myOtherService，它进行远程调用，返回承诺：angula... 查看详情

Angular 7：如何在 Jasmine 单元测试中解决 Hammer.js 依赖项

】Angular7：如何在Jasmine单元测试中解决Hammer.js依赖项【英文标题】：Angular7:HowtoresolveHammer.jsdependencyinJasmineunittest【发布时间】：2020-11-0306:31:24【问题描述】：在为使用MaterialSlider并依赖HammerJS的组件编写单元测试时，我看到此错... 查看详情

如何对 DOM 操作进行单元测试（使用 jasmine）

】如何对DOM操作进行单元测试（使用jasmine）【英文标题】：howtounittestDOMmanipulation(withjasmine)【发布时间】：2013-04-1608:14:13【问题描述】：我需要用jasmine对一些DOM操作函数进行单元测试（目前我在浏览器和Karma中运行我的测试）我... 查看详情

如何使用 Jasmine 为私有方法编写 Angular / TypeScript 单元测试

】如何使用Jasmine为私有方法编写Angular/TypeScript单元测试【英文标题】：HowtowriteunittestingforAngular/TypeScriptforprivatemethodswithJasmine【发布时间】：2016-06-2911:06:28【问题描述】：如何在Angular2中测试私有函数？classFooBarprivate_status:number;co... 查看详情

如何在 jasmine 中编写单元测试用例？

】如何在jasmine中编写单元测试用例？【英文标题】：Howtowriteunittestcaseinjasmine?【发布时间】：2021-07-1110:27:36【问题描述】：Flag(a)letelement=this.selected.filter(item=>item.a===a)returnelement.length>1?true:false;不确定如何为上述函数编写单元... 查看详情

你如何在 Jasmine 的 onShow 中测试 Backbone Marionnette 方法？

】你如何在Jasmine的onShow中测试BackboneMarionnette方法？【英文标题】：HowdoyoutestaBackboneMarionnettemethodinsideofonShowinJasmine?【发布时间】：2014-07-2019:45:05【问题描述】：我正在尝试在BackboneMarionette中测试一个视图，但onShow()从未被调用，... 查看详情

如何使用jasmine-marbles测试rxjs管道中的timeout（）(代码片段)

...定超时，如果源未及时发出预期值，则中止等待。我想用jasmine-marbles测试超时情况，但我无法让它工作。我相信expect(source).toBeObservable()会在源发出之前进行评估。见Stackblitz要测试的管道：source=cold('a',a:id:'a').pipe( 查看详情

如何使用jasmine使用dom元素测试javascript？

我试图在jasmine中为JavaScript代码编写测试，包括不起作用的DOM元素。当我只测试JavaScript代码（只是简单的函数而不是DOM元素）时，它可以工作。我一直在研究这个问题并且找不到答案。我也尝试使用jsdom，因为它应该在测试DOM元... 查看详情