Tag Archives: JSTest.Net

Unit Testing JavaScript with MSTest and JSTest.Net

JavaScript: A necessary evil

I’ve always found that while JavaScript was a powerful tool for web development it could be a real pain to test and debug.  Until now I pushed through the pain with good old fashioned manual testing and the debugging tools available in web browsers.  Recently, I was developing a web page that needed a lot of client side calculations and data manipulation. I decided it was time to man up and find a way to unit test client side JavaScript.

I Wanted

  1. Integration with MSTest
  2. Writing unit tests with server-side code as I do for C# code
  3. Running JavaScript and C# unit tests together in harmony
  4. Nothing to install so others can just start using the testing library
  5. No web browser required

Surprise and Delight
A few minutes on Google and I found a solution that appeared to be the answer. Before I go on, I should mention I found several testing libraries so there are many options. Most of which integrate with MSTest and most other testing frameworks.

The winner is
I selected to use JSTest.Net

It was pretty simple to get up and running:

  1. Just download the dll from JSTest.Net
  2. Made a reference to it in my test project
  3. Added a couple using statements in my test class
  4. Started writing tests

Consider this JavaScript example

function calculateMarketPrice(value, quantity, factor) {
    return (value / quantity) * factor;
}

It’s pretty simple, send in a few parameters and return a value.  However, testing this manually and debugging through the web browser is not always as simple, especially if it’s implemented on complex web pages.  In a lot of cases it’s tedious and inefficient.  Even worse it could be ineffective and bugs could be missed.  For example, maybe there’s a rounding issue?  Or maybe a null parameter won’t be handled as expected.  We just don’t know unless we test for it.  And when testing is difficult it’s more likely to be missed or god forbid skipped.

Test Class Example

using Microsoft.VisualStudio.TestTools.UnitTesting;
using JSTest;
using JSTest.ScriptLibraries;

namespace JavaScriptTestProject
{
    [TestClass]
    public class CommonJavaScriptTests
    {
        private readonly TestScript _commonTestScript = new TestScript();

        public CommonJavaScriptTests()
        {
            _commonTestScript.AppendFile(@"..\..\..\..\MyJavaScriptTest\MyJavaScriptTest\JavaScript\Common.js");
            _commonTestScript.AppendBlock(new JsAssertLibrary());
        }
        public TestContext TestContext { get; set; }

        [TestMethod]
        public void GivenValueQuantityAndFactorTheCorrectMarketPriceIsReturned()
        {
            _commonTestScript.RunTest(@"assert.equal(99.26, calculateMarketPrice(49630, 50000, 100));", true);
        }
    }
}

A quick overview
The library uses a class called TestScipt as a wrapper  to command line scripts (CScript). Before writing tests it’s necessary to add the script file you’ll be testing and any additional libraries to the TestScript.   In my example I used the AppendFile method to add my js file and the AppendBlock to add the assertion library included with JSTest.   According to the documentation there are other assertion libraries and mocking libraries available but I have not tried them yet.

Once the scripts are appended to the TestScript class the RunTest method can be invoked.  It takes the script block to be tested as the first parameter and has an overload that includes a boolean to turn debug off and on.  When debug is on and you select to debug your test it allows you to step into the debug test script and from there into your script. This is awesome. Not only do I get to easily test every scenario I can think of, I get to debug it too!

JsTest Documentation

Other Things

  • My example uses MSTest but it works with other test frameworks
  • The documentation says it only works with VS2010, But I have it working in 2008

Conclusion
With testing libraries that are compatible with most frameworks available there are no excuses for not covering JavaScript with unit tests. And the integration with the visual studio just in time debugger is icing on the cake. It’s also worth noting I’ve since used this library for more complicated tests that included date manipulation and JSON and found it just as effective.


%d bloggers like this: