Dotnet logo

The .NET Tools Blog

Essential productivity kit for .NET developers


ReSharper 6 Introduces Support for JavaScript Unit Testing with QUnit

Previous posts introducing ReSharper 6:

In ReShaper 6 we have taken the first step to make it easier for developers to work with JavaScript. By providing support for analysis, refactoring and code-navigation, we try and remove some of the difficulties developers might encounter when working with this language. Now we’re taking the next step!

Running QUnit from ReSharper

When it comes to Unit Testing, even some of the more experienced JavaScript developers tend to not pay too much attention to testing their code. Reasons for this include too much friction, lack of understanding on how to test, what framework to use, etc. Although we can’t solve all of the problems, we are going to try and remove a few of them by providing support for running JavaScript Unit Tests in an easier way with ReSharper. And we are starting this by providing support for QUnit, the unit testing framework used by jQuery. You will be able to run QUnit JavaScript tests using the same interfaces you know and love in ReSharper. And the best part of it all, is that it’s really easy! Let’s see how.

1. Define the code under test

First step is to have some code that we want to test. This code can be located in the same file where are tests are (not recommended) or in different files. In our case, we want to test some simple calculator operations:

We have placed this code in a file called CodeUnderTest.js but it can be named absolutely anything.

2. Write some tests

Writing Unit Tests in QUnit is pretty straightforward. Whereas with most test frameworks, you’d normally write a class that contains test methods, with QUnit, you call a function test which takes two parameters, a description of the test and the actual code to test, which is passed in as a function:

We place this code in a file called CalculatorTests.js (again, can be named anything). Our project structure now looks like this:

Since our tests are located in a file different to that of our tests, we do need to tell ReSharper which code we are referring to by using a specific reference notation at the top of the test file:

As soon as we add the tests, ReSharper will detect that these are QUnit tests and provide us with the ability to run them by placing the Test Runner menu in the left gutter:

providing us with the ability to run the tests:

We can now run individual tests and get the output displayed in the ReSharper test runner:

Notice how the tests are grouped under “Calculator tests”. This is done using the module function which allows grouping of tests:

When the tests are run, ReSharper launches the default system browser which runs the tests and reports the information back to ReSharper. Normally, to run QUnit tests, you would need to create an HTML file that runs the them. This is handled internally by ReSharper, so it’s one less step to perform.

If you prefer to use a specific browser to run the tests, you can do so by changing the browser under the ReSharper Options | Tools | Qunit

There is still more to come…

Currently, ReSharper is bundling the latest available version of QUnit (at the time of building). We will be adding support in upcoming releases which will allow you to use your own version of QUnit. Also, we will be looking at providing access to the HTML file that ReSharper generates, allowing better support for Continuous Integration environments, as well as the possibility of running the tests from the browser directly.

When can you play with it?

Right now! The public EAP build includes this functionality. Download it from here the ReSharper 6 Early Access page.

And as always, feedback welcome. Feel free to provide comments here or using our issue tracking system where you’ll not only be able to monitor the status of a feature but also get people to vote for it.

Comments below can no longer be edited.

29 Responses to ReSharper 6 Introduces Support for JavaScript Unit Testing with QUnit

  1. Karl says:

    March 29, 2011

    Hello, it is great to see progress that Resharper 6 has made. Cong!

    I have a question, though. Not sure if it is OK to ask here. Actually quite simple:
    How can I change the font used in some dialogs/windows that Resharper pops up? For example, when I use shortcut Ctrl+N to navigate types, words like “Enter type name” and “Include library types” are in an ugly font that is not consistent with my normal VS settings. I spent more than a couple of hours but could not find out how to customize the font. Will you support that in Resharper 6? Or does Resharper just read the setting from OS? If yes, where to change the font setting that Resharper reads? (I am using Windows 7 and Visual Studio 2010.) Thanks a lot.

  2. Hadi Hariri says:

    March 29, 2011


    I don’t think that’s possible, but I will check. I think it’s actually a very important feature to add in terms of accessibility support too. I’ve logged the issue here so you can be kept updated on it.


  3. Vasiliy Aksyonov says:

    March 30, 2011

    Great! But will you add a support for other JS testing frameworks or interface for using them?

  4. Hadi Hariri says:

    March 30, 2011


    Yes, that’s the plan. Although to begin with, out of the box only QUnit will be supported.

  5. David says:

    March 30, 2011

    So this is off-topic; but relevant to the code you posted…

    Basically, you are saying that the crazy make-my-code-impossible-to-read-by-a-humans function indentation is NOT a bug?!? That can’t be intentional, can it?

    I’ve just assumed it was a beta-bug but after seeing this post should I assume that this is how it is going to be from now on? And if so, is there going to be a way to turn it off? And if not, is there going to be (or is there currently) a way to to ReSharper’s javascript “formatting” off entirely?

    By the way, this is not an opinion, it is an absolute fact: you’re doing it wrong.

    Great product overall. I love ReSharper! Well, most of it, I guess :-p

  6. Vasiliy Aksyonov says:

    March 30, 2011

    Absolutely agree with David, i thought that it is a bug, but it seems to be a feature 😀

  7. Hadi Hariri says:

    March 30, 2011

    @David, @Vasiliy

    We’re looking into those issues.

  8. Roland says:

    March 31, 2011

    Yes, its me again! Release please ! I can’t live without new features now after I read about them. ! 🙂

  9. fschwiet says:

    April 1, 2011

    I suppose if you’re going to support one javascript test framework, QUnit is the one to support. Given its part of jQuery and all that. But, if by chance, you decide to support two, please support Jasmine ( I’ve used both, but only use Jasmine now.

  10. Neil Mosafi says:

    April 3, 2011

    Lovely news!
    I second fschwiet’s comment – any plans to support Jasmine? It’s quite popular too.

  11. Hadi Hariri says:

    April 4, 2011

    @Fschwiet, @Neil

    Could you please log the request in YouTrack? The more people vote for it, the more chances there will be on us providing it out of the box. However, that probably will not happen for 6.

    You can log it here:


  12. Guido Tapia says:

    May 15, 2011

    A few qs on JS unit testing:
    Any other framework supported? I.e. Jsunit, closure tests, etc
    Will team city also run these tests?
    Is the testing functionality extensible, I.e. Can I plug my own unit test lib if not supported out of box?

    Good work guys, glad to see more JS stuff making into your awesome product.


  13. Hadi Hariri says:

    May 16, 2011


    Currently only QUnit but you could extend it to add support for other type of frameworks.

  14. Ramona Eid says:

    June 14, 2011

    Is is possible for the:

    to point to an external js file somewhere on the Internet?

  15. Ramona Eid says:

    June 14, 2011

    Is is possible for the:
    (referenc path)

    to point to an external js file somewhere on the Internet

  16. Polly Shaw says:

    June 29, 2011

    I might want to test the javascript that’s present in dynamic pages, such as MVC views. It would be really good if the reference path could be a path to a relative url on the site, and the page were spun up (in Cassini or IIS, depending on the website’s settings) when ReSharper ran the QUnit tests. Can this be done?

  17. pmn says:

    July 26, 2011

    @Ramona Eid – I’d like to know too!

  18. Hadi Hariri says:

    July 26, 2011

    @Ramona, @Polly, @pmn,

    As far as I’m aware this is not possible, but please feel free to log a feature request for it.

  19. Steen Hulthin Rasmussen says:

    October 14, 2011

    Really nice to just be able to write the intent in the QNunit tests, but how does this play with CI?
    Making QUnit tests run on for instance Teamcity is not that trivial normally, but I really don’t want to install Resharper on my build server in order run the QUnit tests.
    What is the story here? Is there a clean way a can run the QUnit tests I write with “resharper-syntax” on my build server?

  20. Hadi Hariri says:

    October 15, 2011


    Currently even if you were to install R# on the server, it wouldn’t help. Running QUnit on the server kind of fails out of the context of R#. It’s more in TC’s area.

  21. Christian says:

    December 6, 2011

    Great stuff! I can’t, however, get the code under test into the tests when the c.u.t.-file isn’t located in the same folder as the test file. Is this a known limitation?

  22. Hadi Hariri says:

    December 6, 2011


    Currently yes.

  23. Johan says:

    January 4, 2012

    Forcing the test script file to be in the same folder as the code under test is a bit of a hindrance for us. Has there been any progress with this, or is there an estimate for when this will be solved?

  24. Hadi Hariri says:

    January 4, 2012


    It’s logged. Hoping it will be fixed for next version, but not sure if it will be in a minor revision.

  25. acl123 says:

    January 10, 2012

    Hi there,
    What happens if your javascript under test requires another javascript (e.g. another embedded resource, jQuery, mooTools etc)?

  26. Marc says:

    November 12, 2012

    @acl123 just include them like the example:


  27. Marc says:

    November 12, 2012

    or not… (remove spaces)


  28. Marc says:

    November 12, 2012

    or just give up…
    reference path=”jquery…js”

Discover more