5

I am building a web app using BackboneJS and RequireJS and need to implement some form of unit testing for UI interaction and data retrieval via AJAX. I have come across QUnit and Jasmine but don't really know how I can integrate this into my app.

If I am testing things such as:

  • Is the user logged in alright?
  • Has the data been received from the server ok?
  • Does clicking a button trigger the expected response?
  • Do click events work on dynamically loaded html content?
  • Does the app respond correctly to changes in hash/push-state urls?

I would imagine the testing has to be directly integrated into my app so as to have access to specific JS objects, work with session specific data and respond to changes in push state URLs.

How can I integrate QUnit or Jasmine (or other suggestions) into my modular app to unit test such features?

Improve this question

3 Answers 3

Reset to default
4

Unit testing is really simple.

You make a test HTML page. You include QUnit/NodeUnit/Jasmine/TestLibraryOfChoice

You then use requireJS and load one of your javascript modules,

and you simply test the exported object or function. That means testing the valid inputs of your module and asserting the outputs are correct.

You may have to mock out ajax and write HTML mocks

Improve this answer
Sign up to request clarification or add additional context in comments.

9 Comments

ok so do I have to create a complete replica environment for my tests, tests don't run directly on my app? So I provide dummy data and dummy html elements for testing UI events. A lot of my logic is within BackboneJS objects, is this an issue?
Here is an example someone has given for QUnit and RequireJS testing.
@pagewil it depends on how "modular" your application is. If it's truly modular then creating a replica environment is trivial, include the html snippet and mock out some ajax. Rembember that you should have one unit test suite per module.
Questions: 1. Should I be performing tests that persist dummy models to the backend? If so that data needs to be removed from the DB after test completes. 2. Some tests will require cookie/session data to pass security checks on the back-end how should that be handled? 3. Should all testing modules sit in a '/tests' directory?
@pagewil personally I test with the live database and the live system. Every unit test I make creates real data on the database and removes that real data again. This is probably a bad practice, but that's how I do it.
|
2

Dojo Objective Harness (DOH) is a very good unit test framework, which is browser agnostic and supports testing asynchronous functions, see here for a walkthrough guide.

However, from your test cases it looks like you want something more like an integration test? If so Selenium is a good browser automation tool.

Crucially, neither of these tools will require you to modify your code (unless you find bugs :))

Improve this answer

Comments

1

If you want to see an example where requireJS based modules are unit tested with QUnit, download the javascript reference architecture at http://boilerplatejs.org.

Disclaimer: I'm the main author of it.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.