CODEWITHSUNDEEP
requirejskarma-runner
H1D
H1D

Reputation: 758

How to debug tests with karma.js + require.js

I have a setup basically described here - http://karma-runner.github.io/0.8/plus/RequireJS.html

Problem is that I can't see source files of my tests in Chrome dev tools. So I can't debug it. Adding debugger; works but it is very uncomfortable, almost unusable since I can't browse any other file except the one with debugger; currently fired

Seems like karma load files, parse them, wrap each test and then unload files before run.

Upvotes: 1

Views: 472

Answers (2)

zhon
zhon

Reputation: 1630

ng-boilerplate has a grunt build that will put all your plain js files into a build directory for testing and debugging.

Take a look at the Gruntfile and karma/karma-unit.tpl.js for how this is done.

Running grunt watch will leave your browser in a state where you can debug all your tests. Just click the debug button, set your break point(s) and reload the page.

Suddenly, you are debugging any or all your js files.

Upvotes: 1

Simon Boudrias
Simon Boudrias

Reputation: 44589

If you need to debug your test deeply, this is generally an indicator of badly organized code or badly made unit test. If you follow a TDD workflow, taking small step will help you prevent any major issue with your code. I warmly recommend you watch this video: http://blog.testdouble.com/posts/2013-10-03-javascript-testing-tactics.html?utm_source=javascriptweekly&utm_medium=email (it doesn't use Karma, but you should watch it for the workflow/the principles presented)

Then, if you really want to debug your test code, nothing beat the browser. As so, you should set up your test in a manner it can be runned both in Karma and the browser. We implemented this for QUnit, Jasmine and Mocha on the Backbone-Boilerplate. Feel free to base yourself on these settings to set up your own environment.

Upvotes: 0

Related Questions