< Go Back to Homepage

How to test jQuery enabled Apps using JSON with Visual Studio

by Andreas Grabner, Apr 20, 09

Visual Studio Team System offers a nice Web- and Load-Testing Feature that allows you to easily create tests to verify your web application’s functionality as well as verifying how it performs under load. Web Applications that make use of AJAX Frameworks like jQuery execute additonal web requests to request information from the Web Server without causing the browser to reload the complete page. JSON is one of the formats that is used to exchange information between the Web Server and the AJAX Framework running in the browser.

Challenges with AJAX in Web- and Load-Testing

Asynchronous calls executed by AJAX frameworks can be very hard to deal with for web- and loadtesting tools? Why? Because those requests can most often not easily be correlated to a Page Request done by the browser and therefore its not easy to create a nice script that shows the sequential logic of all user interactions.
The next problem with AJAX requests is that its hard to verify if the simulated request produced the correct result and whether the result of one request needs to feed a subsequent request. An example for this would be a login call that returns a user id. This user id needs to be used for subsequent calls. If the testing tool doesn’t understand JSON and is not able to automatically detect the dependency between those calls its up to the test engineer to add parsing statements for the first call and use the parsed value in subsequent calls.

How to test JSON with Visual Studio?

I’ve downloaded the following ASP.NET MVC Sample App (KIGG) that uses jQuery and JSON. My task was to create a web script with Visual Studio that creates new user accounts. In order to do that a user needs to sign on to the page with username, password and email. The user account can then be activated by following an activation link that is sent via email.

Necessary steps for the Test Script

  • Execute the request to sign up a new user by providing username, password and email
  • Get the information about the activation link
  • Execute the request to activate the user account

The default procedure for the activation uses an email that is sent out. As I didn’t want to bother with email during my web testing I extended the JSON message that is returned when signing up a new account to include the information about the activation link. Having that information as part of the response allows me to finish all the steps.

How to deal with JSON messages?

Here is the JSON message that is responded by the user signup request:

{"isSuccessful":true,"userId":"9JU51KDxp0-3Llw1BU2h7w","errorMessage":null}

The userId is the value that I am interested in. This is the value I need to use to call the Activate page. Another interesting value is the isSuccessful property. This allows me to add additional logic to my web script. I can verify if the sign-up request was successful. In order to do all this I need to extend Visual Studio Web Testing by writing my own Extraction and Validation Rule. Visual Studio offers an interface to provide custom implementations for value parsing and validation. Here is my implementation for the ExtractorRule using a helper class that parses the JSon string:

public override void Extract(object sender, Microsoft.VisualStudio.TestTools.WebTesting.ExtractionEventArgs e) {
  NameValueCollection jsonProperties = JSonHelper.ParseJSonString(e.Response.BodyString);
  string propertyValue = jsonProperties.Get(JSonPropertyName);
  if (propertyValue != null) {
    e.WebTest.Context.Add(ContextParameterName, propertyValue);
    e.Success = true;
  } else
    e.Success = false;
}

In a similar way I implemented the ValidationRule. Using it all in my web test allows me to specify the Extractor and Validation Rule in my web test.

Using JSON Validator and Extractor in Web Test

Using JSON Validator and Extractor in Web Test

Conclusion

With Visual Studios extensibility mechanisms its easy to build support for those emerging technologies like jQuery and JSON. Let me know if you need the library that implements the two extension Rules.

Share
  • Facebook
  • Reddit
  • Digg
  • del.icio.us
  • StumbleUpon
  • LinkedIn
  • MisterWong
  • Technorati
  • E-mail this story to a friend!
  • Google Bookmarks
  • DZone
  • FriendFeed
  • Ping.fm
  • Slashdot
  • Twitter

Related posts:

  1. Microsoft released Visual Studio 2010 – Download the dynaTrace Add-On today! Microsoft released the next version of it’s Development IDE Visual...
  2. Boston .NET User Group: Load and Performance Testing: How to do Transactional Root-Cause Analysis with Visual Studio Team System for Testers I am going to present at the next Boston .NET...
  3. Extending Visual Studio Unit Testing with Transactional Tracing In my previous blog entry I wrote about how to...
  4. Randomizing Input Data for Visual Studio Load Tests While preparing for my presentation Load and Performance Testing: How...
  5. Extending Visual Studio with Transactional Tracing Visual Studio is the number one development environment for Microsoft...

Trackback

6 comments yet

  1. [...] to VoteHow to test jQuery enabled Apps using JSON with Visual Studio (4/20/2009)Monday, April 20, 2009 from blog.dynatrace.comVisual Studio Team System offers a nice Web- and [...]

  2. Great article mate. Would appreciate more articles on ASP.net code performance.

    With some projects every second counts and it is also a good idea to tune your client side code as well. I found nice jQuery code performance tips round-up article here called “5 easy tips on how to improve code performance with huge data sets in jQuery“.

    Also I would suggest taking a look at the Yahoo Devnet performance guidelines… for tuning your html, css, etc…

  3. Christine @ 2009-09-02 00:44

    Can you please show me the library that implements the two extension Rules? Thanks

  4. can you send me an email so that I can send you my implementation? my email is firstname.lastname@dynatrace.com

  5. [...] including this one from Resig on performance testing (which comes with a free plugin), this one on Ajax/JSON testing within Visual Studio and Paul Irish’s interesting presentation on Anti-patterns in performance and compression here. [...]

  6. [...] including this one from Resig on performance testing (which comes with a free plugin), this one on Ajax/JSON testing within Visual Studio and Paul Irish’s interesting presentation on Anti-patterns in performance and compression here. [...]

Add your comment now